Adding Title link to Video Sidebar Widget WordPress

benjaminconnor comments:

Oh sorry,

Here it is: http://benconnormusic.com/

Cheers guys,

Ben

benjaminconnor comments:

Oh sorry,

Here it is: http://benconnormusic.com/

Cheers guys,

Ben

Arnav Joy comments:

as i can see there is a section in right sidebar "Latest Video" with the video but there where is title of the video?

benjaminconnor comments:

Hey Arnav.

Sorry. I'm referring to "Latest Video". Wanting to be able to click it to link through to the video post.

Doable?

Cheers,

Ben

benjaminconnor comments:

Here it is: http://benconnormusic.com/

Abdelhadi Touil comments:

It'll be better to display the link of post above or under the video player in the sidebar and link it to the post page, it's better than link the widget title for SEO purpose.
I want the widget code to make change, or you can send me the theme for making changes for you and resend it. I can also display the video thumbnail insted of the video player, so the visitor will be forced to click on the title or thumbnail to go to the post page and watch the video there.
Good luck.

benjaminconnor comments:

Hey Abdelhadi,

Na, like that they can watch the video in the sidebar. Thanks though.

Are you suggesting it might be better for me to just have a separate widget (a text widget maybe) above the video that is both the title for the video widget below (i.e. Latest Video) and a link to the video post?

Or, are you suggesting adding another bit of text with link above or below the video player...

Reading again, I think you mean the latter, yes?

Sending a widget code and/or theme is a little beyond me without more explanation on how to do so.

Do you want me to go into my host provider and acquire the html, php, css or something? I've relatively new to this stuff but have navigated the back end of my hosting provider a little.

Is step by step possible?

Go to Hostgator - file manager - html - content...

Something along those lines?

Abdelhadi Touil comments:

Hi benjaminconnor.
Yes I mean the latter (adding another bit of text with link above or below the video player).
To make change, I can't make it without the code used in your theme to display the sidebar widget. As I see you are using News Child Theme from StudioPress:
[[LINK href="http://my.studiopress.com/themes/news/"]]http://my.studiopress.com/themes/news/[[/LINK]]
So normally you have the theme files; except if you aren't install wordpress and the theme yourself in your website. If you don't have theme files, you can find it via FTP of File manager in wp-content/themes folder (it's called "news").
Good luck.

benjaminconnor comments:

Okay,

So, um, just to check with this.

The widget is a plugin, so i'm thinking you might need the widget code, no?

And, um... sorry, but I'm pretty tech dumb. When you say code, do you mean html, php, css or something else?

This is the news themes css:

/*
Theme Name: News Child Theme
Theme URI: http://www.studiopress.com/themes/news
Description: News is a two or three column child theme created for the Genesis Framework.
Author: StudioPress
Author URI: http://www.studiopress.com/

Version: 2.1

Tags: black, custom-background, custom-header, custom-menu, featured-images, fixed-width, gray, left-sidebar, one-column, right-sidebar, sticky-post, theme-options, threaded-comments, three-columns, translation-ready, two-columns, white

Template: genesis
Template Version: 1.8.2

License: GNU General Public License v2.0
License URI: http://www.opensource.org/licenses/gpl-license.php
*/

/* Table of Contents

* Import Fonts
* Defaults
* Hyperlinks
* Body
* Wrap
* Header
* Image Header - Partial Width
* Image Header - Full Width
* Navigation Constants
* Header Right Navigation
* Primary Navigation
* Primary Navigation Extras
* Secondary Navigation
* Social Icons
* Inner
* Breadcrumb
* Taxonomy Description
* Content-Sidebar Wrap
* Content
* Column Classes
* Featured Post Grid
* Headlines
* Ordered / Unordered Lists
* Post Info
* Post Meta
* Author Box
* Sticky Posts
* Archive Page
* Post Icons
* Images
* Post Navigation
* Primary / Secondary Sidebars
* Dropdowns
* Featured Page / Post
* User Profile
* Buttons
* Search Form
* eNews & Updates Widget
* Calendar Widget
* Footer Widgets
* Footer
* Comments
* Gravity Forms
* News Green
* News Orange
* News Pink
* News Purple
* News Red
* News Teal
* Responsive Design

*/


/* Import Fonts
------------------------------------------------------------ */

@import url(http://fonts.googleapis.com/css?family=Droid+Sans);
@import url(http://fonts.googleapis.com/css?family=Oswald);



/* Defaults
------------------------------------------------------------ */

body,
h1,
h2,
h2 a,
h2 a:visited,
h3,
h4,
h5,
h6,
p,
select,
textarea {
color: #333;
font-family: 'Droid Sans', sans-serif;
font-size: 13px;
font-weight: normal;
line-height: 22px;
margin: 0;
padding: 0;
text-decoration: none;
}

input {
color: #333;
font-family: 'Droid Sans', sans-serif;
}

input,
select,
textarea,
.breadcrumb,
.sticky,
.taxonomy-description {
background-color: #f5f5f5;
border: 1px solid #ddd;
}

li,
ol,
ul {
margin: 0;
padding: 0;
}

ol li {
list-style-type: decimal;
}


/* Hyperlinks
------------------------------------------------------------ */

a,
a:visited {
color: #0094d2;
text-decoration: none;
}

a:hover {
text-decoration: underline;
}

a img {
border: none;
}


/* Body
------------------------------------------------------------ */

body {
background: url(images/bg-light.png);
}


/* Wrap
------------------------------------------------------------ */

#wrap {
margin: 0 auto;
}


/* Header
------------------------------------------------------------ */

#header {
background-color: #fff;
border-left: 1px solid #d5d5d5;
border-right: 1px solid #d5d5d5;
border-top: 1px solid #d5d5d5;
min-height: 110px;
margin: 0 auto;
overflow: hidden;
width: 960px;
}

#title-area {
float: left;
overflow: hidden;
padding: 18px 0 0 20px;
width: 440px;
}

#title {
font-family: 'Papyrus';
font-size: 54px;
font-weight: bold;
line-height: 54px;
margin: 0;
text-shadow: 3px 3px #ccc;
text-transform: uppercase;
}

#title a,
#title a:hover {
color: #333;
text-decoration: none;
}

#description {
color: #999;
font-size: 14px;
font-weight: bold;
text-transform: uppercase;
}

#header .widget-area {
float: right;
padding: 25px 0 0;
width: 493px;
}


/* Image Header - Partial Width
------------------------------------------------------------ */

.header-image #title-area,
.header-image #title,
.header-image #title a {
display: block;
float: left;
height: 110px;
overflow: hidden;
padding: 0;
text-indent: -9999px;
width: 465px;
}

.header-image #description {
display: block;
overflow: hidden;
}


/* Image Header - Full Width
------------------------------------------------------------ */

.header-full-width #title-area,
.header-full-width #title,
.header-full-width #title a {
width: 960px;
}


/* Navigation Constants
------------------------------------------------------------ */

li:hover ul ul,
li.sfHover ul ul {
left: -9999px;
}

li:hover,
li.sfHover {
position: static;
}

li a .sf-sub-indicator {
position: absolute;
text-indent: -9999px;
}


/* Header Right Navigation
------------------------------------------------------------ */

#header ul.menu {
float: right;
}

#header ul.menu ul {
float: right;
margin: 0;
padding: 0;
width: 100%;
}

#header ul.menu li {
float: left;
list-style-type: none;
text-transform: uppercase;
}

#header ul.menu li a {
color: #999;
display: block;
font-size: 12px;
padding: 6px 15px 5px;
position: relative;
text-decoration: none;
}

#header ul.menu li a:hover,
#header ul.menu li a:active,
#header ul.menu .current_page_item a,
#header ul.menu .current-cat a,
#header ul.menu .current-menu-item a {
color: #0094d2;
}

#header ul.menu li li a,
#header ul.menu li li a:link,
#header ul.menu li li a:visited {
background-color: #111;
border: 1px solid #444;
border-top-width: 0;
color: #999;
font-size: 11px;
padding: 5px 10px;
position: relative;
text-transform: none;
width: 128px;
}

#header ul.menu li li a:hover,
#header ul.menu li li a:active {
color: #0094d2;
}

#header ul.menu li ul {
height: auto;
left: -9999px;
margin: 0 0 0 -1px;
position: absolute;
width: 150px;
z-index: 9999;
}

#header ul.menu li ul a {
width: 130px;
}

#header ul.menu li ul ul {
margin: -33px 0 0 149px;
}

#header ul.menu li:hover>ul,
#header ul.menu li.sfHover ul {
left: auto;
}


/* Primary Navigation
------------------------------------------------------------ */

#nav {
background: url(images/bg-dark.png);
border-left: 1px solid #d5d5d5;
border-right: 1px solid #d5d5d5;
clear: both;
color: #fff;
font-family: 'Oswald', arial, serif;
margin: 0 auto;
overflow: hidden;
text-transform: uppercase;
width: 960px;
}

#nav ul {
float: left;
width: 100%;
}

#nav li {
float: left;
list-style-type: none;
}

#nav li a {
color: #fff;
display: block;
font-size: 14px;
padding: 9px 15px;
position: relative;
text-decoration: none;
}

#nav li a:hover,
#nav li a:active,
#nav .current_page_item a,
#nav .current-cat a,
#nav .current-menu-item a {
color: #0094d2;
}

#nav li li a,
#nav li li a:link,
#nav li li a:visited {
background: url(images/bg-dark.png);
border: 1px solid #444;
border-top-width: 0;
color: #fff;
font-size: 11px;
padding: 5px 10px;
position: relative;
text-transform: none;
width: 118px;
}

#nav li li a:hover,
#nav li li a:active {
color: #0094d2;
}

#nav li ul {
height: auto;
left: -9999px;
position: absolute;
width: 140px;
z-index: 9999;
}

#nav li ul a {
width: 120px;
}

#nav li ul ul {
margin: -33px 0 0 139px;
}

#nav li:hover>ul,
#nav li.sfHover ul {
left: auto;
}


/* Primary Navigation Extras
------------------------------------------------------------ */

#nav li.right {
float: right;
font-size: 14px;
padding: 9px 15px;
}

#nav li.right a {
background: none;
border: none;
color: #fff;
display: inline;
text-decoration: none;
}

#nav li.right a:hover {
color: #0094d2;
text-decoration: none;
}

#nav li.search {
padding: 0 10px;
}

#nav li.rss a {
background: url(images/rss.png) no-repeat center left;
margin: 0 0 0 20px;
padding: 7px 0 5px 18px;
}

#nav li.twitter a {
background: url(images/twitter-nav.png) no-repeat center left;
padding: 7px 0 5px 20px;
}


/* Secondary Navigation
------------------------------------------------------------ */

#subnav {
clear: both;
font-family: 'Oswald', arial, serif;
margin: 0 auto;
overflow: hidden;
width: 960px;
}

#subnav ul {
float: left;
width: 100%;
}

#subnav li {
float: left;
list-style-type: none;
}

#subnav li a {
color: #333;
display: block;
font-size: 12px;
padding: 12px 15px 10px;
position: relative;
text-decoration: none;
}

#subnav li a:hover,
#subnav li a:active,
#subnav .current_page_item a,
#subnav .current-cat a,
#subnav .current-menu-item a {
color: #0094d2;
}

#subnav li li a,
#subnav li li a:link,
#subnav li li a:visited {
background: url(images/bg-light.png);
border: 1px solid #ccc;
border-top-width: 0;
color: #333;
font-size: 11px;
padding: 5px 10px;
position: relative;
text-transform: none;
width: 118px;
}

#subnav li li a:hover,
#subnav li li a:active {
color: #0094d2;
}

#subnav li ul {
height: auto;
left: -9999px;
position: absolute;
width: 140px;
z-index: 9999;
}

#subnav li ul a {
width: 120px;
}

#subnav li ul ul {
margin: -33px 0 0 139px;
}

#subnav li:hover>ul,
#subnav li.sfHover ul {
left: auto;
}


/* Social Icons
------------------------------------------------------------ */

#subnav li.social-facebook,
#subnav li.social-rss,
#subnav li.social-twitter {
float: right;
}

#subnav li.social-facebook a,
#subnav li.social-facebook a:hover,
#subnav li.social-rss a,
#subnav li.social-rss a:hover,
#subnav li.social-twitter a,
#subnav li.social-twitter a:hover {
display: block;
height: 23px;
padding: 0;
text-indent: -9999px;
width: 23px;
}

#subnav li.social-facebook a,
#subnav li.social-facebook a:hover,
#subnav li.social-rss a,
#subnav li.social-rss a:hover,
#subnav li.social-twitter a,
#subnav li.social-twitter a:hover {
background: url(images/social-icons.png);
margin: 10px 10px 0 0;
}

#subnav li.social-rss a,
#subnav li.social-rss a:hover {
margin: 10px 15px 0 0;
}

#subnav li.social-facebook a {
background-position: 0 0;
}

#subnav li.social-facebook a:hover {
background-position: 0 -23px;
}

#subnav li.social-rss a {
background-position: -46px 0;
}

#subnav li.social-rss a:hover {
background-position: -46px -23px;
}

#subnav li.social-twitter a {
background-position: -23px 0;
}

#subnav li.social-twitter a:hover {
background-position: -23px -23px;
}


/* Inner
------------------------------------------------------------ */

#inner {
background-color: #fff;
border-left: 1px solid #d5d5d5;
border-right: 1px solid #d5d5d5;
border-bottom: 1px solid #d5d5d5;
overflow: hidden;
margin: 0 auto;
width: 960px;
}

.news-landing #inner {
margin: 20px auto;
width: 700px;
}

#inner:after {
clear: both;
content: ".";
display: block;
height: 0;
visibility: hidden;
}

.content-sidebar #inner {
background: url(images/inner-cs.png);
}

.sidebar-content #inner {
background: url(images/inner-sc.png);
}

.content-sidebar-sidebar #inner {
background: url(images/inner-css.png);
}

.sidebar-sidebar-content #inner {
background: url(images/inner-ssc.png);
}

.sidebar-content-sidebar #inner {
background: url(images/inner-scs.png);
}

.full-width-content #inner {
background: #fff;
}


/* Home Top
------------------------------------------------------------ */

#home-top {
border-bottom: 1px solid #d5d5d5;
overflow: hidden;
}

#home-top .border {
border-bottom: 4px solid #eee;
overflow: hidden;
}

#home-top .wrap {
overflow: hidden;
padding: 20px 25px 15px;
}

#home-top .ui-tabs ul.ui-tabs-nav {
border-bottom: 1px dotted #ddd;
margin: 10px 0;
padding: 0 0 13px;
}

#home-top .ui-tabs ul.ui-tabs-nav li a {
background-color: #f5f5f5;
font-weight: bold;
}

#home-top .ui-tabs ul.ui-tabs-nav li a:hover,
#home-top .ui-tabs ul.ui-tabs-nav li.ui-tabs-selected a {
background-color: #00a7ed;
color: #fff;
}

#home-top .ui-tabs .post {
background-color: #fff;
margin: 0;
padding: 0;
}


/* Home Middle
------------------------------------------------------------ */

#home-middle {
border-bottom: 1px solid #d5d5d5;
overflow: hidden;
}

#home-middle .border {
border-bottom: 4px solid #eee;
overflow: hidden;
}

#home-middle .wrap {
overflow: hidden;
padding: 25px 25px 15px;
}

.home-middle-left {
float: left;
width: 290px;
}

.home-middle-right {
float: right;
width: 285px;
}


/* Home Bottom
------------------------------------------------------------ */

#home-bottom {
overflow: hidden;
}

#home-bottom .wrap {
overflow: hidden;
padding: 20px 25px 15px;
}


/* Breadcrumb
------------------------------------------------------------ */

.breadcrumb {
border: none;
font-size: 12px;
line-height: 20px;
margin: 0 0 30px;
padding: 5px 10px;
}


/* Taxonomy Description
------------------------------------------------------------ */

.taxonomy-description {
border: none;
margin: 0 0 30px;
padding: 10px;
}


/* Content-Sidebar Wrap
------------------------------------------------------------ */

#content-sidebar-wrap {
float: left;
width: 810px;
}

.content-sidebar-sidebar #content-sidebar-wrap,
.sidebar-sidebar-content #content-sidebar-wrap {
width: 805px;
}

.content-sidebar #content-sidebar-wrap,
.full-width-content #content-sidebar-wrap,
.sidebar-content #content-sidebar-wrap {
width: 960px;
}

.sidebar-content-sidebar #content-sidebar-wrap,
.sidebar-sidebar-content #content-sidebar-wrap {
float: right;
}

.news-landing #content-sidebar-wrap {
width: 700px;
}


/* Content
------------------------------------------------------------ */

#content {
float: left;
padding: 25px 35px;
width: 430px;
}

.content-sidebar #content,
.sidebar-content #content {
width: 580px;
}

.content-sidebar-sidebar #content {
width: 425px;
}

.sidebar-content #content,
.sidebar-sidebar-content #content {
float: right;
}

.home.news.content-sidebar #content {
padding: 0;
width: 650px;
}

.full-width-content #content {
width: 910px;
}

.full-width-content.news-landing #content {
width: 630px;
}

blockquote {
background-color: #f5f5f5;
margin: 5px 15px 20px;
padding: 15px 20px 0;
}

blockquote p {
color: #666;
font-family: Georgia, Times, 'Times New Roman', serif;
font-style: italic;
}

.post {
margin: 0 0 40px;
}

.single .post {
margin: 0 0 10px;
}

.entry-content {
overflow: hidden;
}

.entry-content p {
padding: 0 0 15px;
}

p.subscribe-to-comments {
padding: 20px 0 10px;
}

.after-post-ad {
background-color: #f5f5f5;
margin: 5px 0 10px;
padding: 10px;
overflow: hidden;
}

.after-content-ad {
clear: both;
margin: 0 auto;
overflow: hidden;
padding: 0 0 20px;
text-align: center;
width: 960px;
}

.more-from-category {
background: url(images/list.png) no-repeat top left;
list-style-type: none;
padding: 0 0 0 15px;
}

.clear {
clear: both;
}

.clear-line {
border-bottom: 1px dotted #ddd;
clear: both;
margin: 0 0 15px;
}


/* Column Classes
------------------------------------------------------------ */

.five-sixths,
.four-fifths,
.four-sixths,
.one-fifth,
.one-fourth,
.one-half,
.one-sixth,
.one-third,
.three-fifths,
.three-fourths,
.three-sixths,
.two-fifths,
.two-fourths,
.two-sixths,
.two-thirds {
float: left;
margin: 0 0 20px;
padding-left: 3%;
}

.one-half,
.three-sixths,
.two-fourths {
width: 48%;
}

.one-third,
.two-sixths {
width: 31%;
}

.four-sixths,
.two-thirds {
width: 65%;
}

.one-fourth {
width: 22.5%;
}

.three-fourths {
width: 73.5%;
}

.one-fifth {
width: 17.4%;
}

.two-fifths {
width: 37.8%;
}

.three-fifths {
width: 58.2%;
}

.four-fifths {
width: 78.6%;
}

.one-sixth {
width: 14%;
}

.five-sixths {
width: 82%;
}

.first {
clear: both;
padding-left: 0;
}


/* Featured Post Grid
------------------------------------------------------------ */

.genesis-grid-even {
float: right;
padding: 0 0 15px;
width: 48%;
}

.genesis-grid-odd {
clear: both;
float: left;
padding: 0 0 15px;
width: 48%;
}

.genesis-grid-even,
.genesis-grid-odd {
margin: 0 0 20px;
}


/* Headlines
------------------------------------------------------------ */

h1,
h2,
h3,
h4,
h5,
h6 {
font-family: 'Oswald', arial, serif;
margin: 0 0 10px;
}

h1,
h2,
h2 a,
h2 a:visited {
font-family: 'Oswald', arial, serif;
font-size: 24px;
line-height: 30px;
}

.featuredpost h2,
.featuredpost h2 a {
font-size: 16px;
line-height: 20px;
margin: 0 0 5px;
}

#home-bottom h2,
#home-top h2 {
margin: 5px 0;
}

.home-middle-right .featuredpost h2,
.home-middle-right h2 a,
.sidebar .featuredpost h2,
.sidebar .featuredpost h2 a {
font-family: 'Droid Sans', sans-serif;
font-size: 13px;
font-weight: bold;
line-height: 18px;
margin: 10px 0 0;
}

.taxonomy-description h1,
.widget-area h2,
.widget-area h2 a {
font-size: 18px;
line-height: 24px;
}

h2 a:hover {
color: #0094d2;
text-decoration: none;
}

h3 {
font-size: 24px;
}

h4 {
font-size: 20px;
}

.widget h4,
.widget-area h4 {
text-transform: uppercase;
word-spacing: 2px;
}

.widget h4,
.widget-area h4 {
font-size: 14px;
}

.widget-area h4 a {
color: #333;
text-decoration: none;
}

#footer-widgets h4 {
background: none;
border: none;
margin: 0 0 5px;
padding: 0;
}

h5 {
font-size: 18px;
}

h6 {
font-size: 16px;
}


/* Ordered / Unordered Lists
------------------------------------------------------------ */

.entry-content ol,
.entry-content ul {
margin: 0;
padding: 0 0 15px;
}

.entry-content ol {
margin: 0;
}

.archive-page ul li,
.entry-content ul li {
list-style-type: square;
margin: 0 0 0 30px;
padding: 0;
}

.entry-content ol li {
margin: 0 0 0 35px;
}

.archive-page ul ul,
.entry-content ol ol,
.entry-content ul ul {
padding: 0;
}


/* Post Info
------------------------------------------------------------ */

.post-info {
font-size: 11px;
margin: 0 0 15px;
}

.featuredpost .post-info,
.ui-tabs .post-info {
color: #666;
margin: 0;
}

.ui-tabs .post-info {
margin: 0 0 5px;
}


/* Post Meta
------------------------------------------------------------ */

.post-meta {
background-color: #f5f5f5;
clear: both;
font-size: 11px;
padding: 7px 10px 5px;
}


/* Author Box
------------------------------------------------------------ */

.author-box {
background-color: #f5f5f5;
margin: 0 0 40px;
overflow: hidden;
padding: 10px;
}

.author-box p {
font-size: 13px;
line-height: 20px;
}


/* Sticky Posts
------------------------------------------------------------ */

.sticky {
margin: 0 0 40px;
padding: 20px;
}


/* Archive Page
------------------------------------------------------------ */

.archive-page {
float: left;
padding: 20px 0;
width: 45%;
}


/* Post Icons
------------------------------------------------------------ */

.categories {
background: url(images/icon-categories.png) no-repeat top left;
padding: 3px 0 3px 22px;
}

.post-comments {
background: url(images/icon-comments.png) no-repeat top left;
margin: 0 0 0 10px;
padding: 2px 0 2px 22px;
}

.tags {
background: url(images/icon-tags.png) no-repeat top left;
margin: 0 0 0 10px;
padding: 3px 0 3px 20px;
}

.time {
background: url(images/icon-time.png) no-repeat top left;
padding: 2px 0 2px 21px;
}

.featuredpost .post-comments,
.featuredpost .time {
background: none;
margin: 0;
padding: 0;
}


/* Images
------------------------------------------------------------ */

img {
height: auto;
max-width: 100%;
}

.avatar,
.entry-content img,
.featuredpage img,
.featuredpost img,
.post-image,
.ui-tabs img {
background-color: #fff;
border: 4px solid #eee;
padding: 1px;
}

.featuredpost img {
margin: 0 0 10px;
}

img.ad-left {
float: left;
margin: 5px 10px 5px 0;
}

img.ad-right {
float: left;
margin: 5px 0;
}

.author-box .avatar {
background-color: #fff;
border: 4px solid #ddd;
float: left;
height: 72px;
margin: 0 10px 0 0;
width: 72px;
}

.post-image {
margin: 0 10px 10px 0;
}

.comment-list li .avatar {
background-color: #fff;
float: left;
height: 30px;
margin: 0 5px 0 0;
width: 30px;
}

img.centered,
.aligncenter {
display: block;
margin: 0 auto 10px;
}

img.alignnone {
display: inline;
margin: 0 0 15px;
}

img.alignleft {
display: inline;
margin: 0 15px 10px 0;
}

img.alignright {
display: inline;
margin: 0 0 10px 15px;
}

.alignleft {
float: left;
margin: 0 10px 0 0;
}

#home-top .alignleft {
margin: 0 15px 0 0;
}

.alignright {
float: right;
margin: 0 0 0 10px;
}

.wp-caption {
background-color: #f5f5f5;
padding: 10px;
text-align: center;
}

p.wp-caption-text {
font-size: 12px;
line-height: 16px;
padding: 5px 0;
}

.wp-smiley,
.wp-wink {
border: none;
float: none;
}

.gallery-caption {
}


/* Post Navigation
------------------------------------------------------------ */

.navigation {
overflow: hidden;
padding: 20px 0;
width: 100%;
}

.navigation li {
display: inline;
}

.navigation li a,
.navigation li.disabled,
.navigation li a:hover,
.navigation li.active a {
background-color: #333;
border: 1px solid #333;
color: #fff;
padding: 5px 8px;
text-decoration: none;
}

.navigation li a:hover,
.navigation li.active a {
background-color: #0094d2;
border: 1px solid #0094d2;
}


/* Primary / Secondary Sidebars
------------------------------------------------------------ */

.sidebar {
display: inline;
float: right;
font-size: 13px;
line-height: 20px;
width: 305px;
}

.sidebar p {
font-size: 13px;
line-height: 20px;
}

#sidebar-alt {
float: left;
width: 150px;
}

.sidebar-content #sidebar,
.sidebar-sidebar-content #sidebar {
float: left;
}

.content-sidebar-sidebar #sidebar-alt {
float: right;
}

#sidebar .widget,
#sidebar-alt .widget {
border-bottom: 1px solid #d5d5d5;
}

.sidebar .widget-wrap {
border-bottom: 4px solid #eee;
overflow: hidden;
padding: 15px 20px 20px;
}

.sidebar .widget ul {
margin: 5px 0 -5px;
}

.sidebar .widget ul li,
.sidebar .widget-area ul li {
background: url(images/list.png) no-repeat top left;
border-bottom: 1px solid #eee;
list-style-type: none;
margin: 0 0 7px;
padding: 0 0 5px 15px;
word-wrap: break-word;
}


/* Dropdowns
------------------------------------------------------------ */

#cat,
.widget_archive select {
display: inline;
font-family: 'Droid Sans', sans-serif;
font-size: 12px;
width: 100%;
}


/* Featured Page / Post
------------------------------------------------------------ */

.featuredpage,
.featuredpost {
clear: both;
overflow: hidden;
}

.featuredpage .page,
.featuredpost .post {
border-bottom: 1px dotted #ddd;
overflow: hidden;
margin: 0 0 10px;
padding: 0 0 15px;
}

.home.content-sidebar .home-middle-right .featuredpost .post,
.home.content-sidebar #home-bottom .featuredpost .post {
padding: 0;
}


/* User Profile
------------------------------------------------------------ */

.user-profile {
overflow: hidden;
}


/* Buttons
------------------------------------------------------------ */

input[type="button"],
input[type="submit"] {
background-color: #00a7ed;
border: 1px solid #0094d2;
color: #fff;
cursor: pointer;
font-family: 'Droid Sans', sans-serif !important;
font-size: 13px;
font-weight: normal;
padding: 5px;
text-decoration: none;
}

input:hover[type="button"],
input:hover[type="submit"] {
background-color: #0094d2;
border: 1px solid #0094d2;
color: #fff;
text-decoration: none;
}


/* Search Form
------------------------------------------------------------ */

#header .searchform {
float: right;
padding: 25px 20px 0 0;
}

#nav .searchform {
float: right;
padding: 2px 0 0;
}

.s {
font-family: 'Droid Sans', sans-serif;
font-size: 13px;
margin: 5px -6px 0 0;
padding: 5px;
width: 180px;
}


/* eNews and Update Widget
------------------------------------------------------------ */

.enews {
background: url(images/enews.png) no-repeat top right;
}

.enews #subbox {
font-family: 'Droid Sans', sans-serif;
font-size: 13px;
margin: 10px -2px 0 0;
padding: 5px;
width: 175px;
}


/* Calendar Widget
------------------------------------------------------------ */

#wp-calendar {
width: 100%;
}

#wp-calendar caption {
font-size: 12px;
font-style: italic;
padding: 2px 5px 0 0;
text-align: right;
}

#wp-calendar thead {
background-color: #f5f5f5;
font-weight: bold;
margin: 10px 0 0;
}

#wp-calendar td {
background-color: #f5f5f5;
padding: 2px;
text-align: center;
}


/* Footer Widgets
------------------------------------------------------------ */

#footer-widgets {
background-color: #fff;
border-left: 1px solid #d5d5d5;
border-right: 1px solid #d5d5d5;
border-bottom: 1px solid #d5d5d5;
margin: 0 auto;
overflow: hidden;
width: 960px;
}

#footer-widgets .wrap {
border: 4px solid #f5f5f5;
font-size: 13px;
line-height: 20px;
overflow: hidden;
padding: 15px 14px 0;
}

#footer-widgets .widget {
background: none;
border: none;
margin: 0 0 15px;
padding: 0;
}

#footer-widgets .textwidget {
padding: 0;
}

#footer-widgets .widget_tag_cloud div div {
padding: 0;
}

#footer-widgets p {
font-size: 13px;
line-height: 20px;
padding: 0 0 10px;
}

#footer-widgets .widget ul li,
#footer-widgets .widget-area ul li {
background: url(images/list.png) no-repeat top left;
border-bottom: 1px dotted #ddd;
list-style-type: none;
margin: 0 0 7px;
padding: 0 0 5px 18px;
word-wrap: break-word;
}

#footer-widgets #wp-calendar thead,
#footer-widgets #wp-calendar td {
background: none;
}

.footer-widgets-1 {
float: left;
margin: 0 20px 0 0;
width: 295px;
}

.footer-widgets-2 {
float: left;
width: 290px;
}

.footer-widgets-3 {
float: right;
width: 295px;
}


/* Footer
------------------------------------------------------------ */

#footer {
background: url(images/footer.png) no-repeat top;
clear: both;
font-size: 11px;
margin: 0 auto;
padding: 30px 0 20px;
overflow: hidden;
text-transform: uppercase;
width: 960px;
}

#footer p {
color: #666;
font-size: 11px;
}

#footer a,
#footer a:visited {
color: #666;
}

#footer a:hover {
color: #0094d2;
text-decoration: none;
}

#footer .gototop {
float: left;
padding: 0 0 0 10px;
width: 200px;
}

#footer .creds {
float: right;
padding: 0 10px 0 0;
text-align: right;
width: 735px;
}


/* Comments
------------------------------------------------------------ */

#comments,
#respond {
margin: 0 0 30px;
overflow: hidden;
}

#comments {
font-size: 13px;
line-height: 20px;
}

#author,
#comment,
#email,
#url {
font-size: 12px;
margin: 10px 5px 0 0;
padding: 5px;
width: 250px;
}

#comment {
height: 150px;
margin: 10px 0;
width: 98%;
}

.ping-list {
margin: 0 0 40px;
}

.comment-list ol,
.ping-list ol {
margin: 0;
padding: 10px;
}

.comment-list li,
.ping-list li {
font-weight: bold;
list-style: none;
margin: 10px 0 0;
padding: 10px;
}

.comment-list li ul li {
list-style-type: none;
}

.comment-list p,
.ping-list p {
font-size: 13px;
font-weight: normal;
line-height: 20px;
margin: 10px 5px 10px 0;
padding: 0;
text-transform: none;
}

.comment-list ul.children {
margin-top: 20px;
}

.comment-list ul.children li.comment {
background: #fff;
}

.comment-list cite,
.ping-list cite {
font-style: normal;
font-weight: bold;
}

.commentmetadata {
font-weight:normal;
}

.comment-author {
background: #e5e5e5;
font-size: 12px;
font-weight: bold;
padding: 8px 10px 0;
}

.comment-meta {
background: #e5e5e5;
font-size: 12px;
padding: 0 10px 8px;
}

.nocomments {
text-align: center;
}

#comments .navigation {
display: block;
padding: 0;
}

.bypostauthor {
}

.thread-alt,
.thread-even {
background: #f5f5f5;
}

.alt,
.depth-1,
.even {
border: 1px solid #ddd;
}


/* Gravity Forms
------------------------------------------------------------ */

div.gform_wrapper input,
div.gform_wrapper select,
div.gform_wrapper textarea {
color: #333;
font-family: 'Droid Sans', sans-serif;
font-size: 12px !important;
padding: 4px 5px !important;
}

div.gform_footer input.button {
color: #fff;
}

div.gform_wrapper .ginput_complex label {
font-size: 12px;
}

div.gform_wrapper li,
div.gform_wrapper form li {
margin: 0 0 10px;
}

div.gform_wrapper .gform_footer {
border: none;
margin: 0;
padding: 0;
}


/* News Green
------------------------------------------------------------ */

.news-green a,
.news-green a:visited {
color: #1c9b3d;
text-decoration: none;
}

.news-green a:hover {
text-decoration: underline;
}

.news-green #header ul.nav li li a,
.news-green #header ul.nav li li a:link,
.news-green #header ul.nav li li a:visited,
.news-green #header ul.menu li li a,
.news-green #header ul.menu li li a:link,
.news-green #header ul.menu li li a:visited,
.news-green #nav li li a,
.news-green #nav li li a:link,
.news-green #nav li li a:visited {
color: #fff;
}

.news-green #subnav li li a,
.news-green #subnav li li a:link,
.news-green #subnav li li a:visited,
.news-green h2 a,
.news-green h2 a:visited {
color: #333;
}

.news-green #header ul.nav li a:hover,
.news-green #header ul.nav li a:active,
.news-green #header ul.nav .current_page_item a,
.news-green #header ul.nav .current-cat a,
.news-green #header ul.nav .current-menu-item a,
.news-green #header ul.menu li a:hover,
.news-green #header ul.menu li a:active,
.news-green #header ul.menu .current_page_item a,
.news-green #header ul.menu .current-cat a,
.news-green #header ul.menu .current-menu-item a,
.news-green #header ul.nav li li a:hover,
.news-green #header ul.nav li li a:active,
.news-green #header ul.menu li li a:hover,
.news-green #header ul.menu li li a:active,
.news-green #nav li a:hover,
.news-green #nav li a:active,
.news-green #nav .current_page_item a,
.news-green #nav .current-cat a,
.news-green #nav .current-menu-item a,
.news-green #nav li li a:hover,
.news-green #nav li li a:active,
.news-green #nav li.right a:hover,
.news-green #subnav li a:hover,
.news-green #subnav li a:active,
.news-green #subnav .current_page_item a,
.news-green #subnav .current-cat a,
.news-green #subnav .current-menu-item a,
.news-green #subnav li li a:hover,
.news-green #subnav li li a:active,
.news-green h2 a:hover,
.news-green #footer a:hover {
color: #1c9b3d;
}

.news-green #home-top .ui-tabs ul.ui-tabs-nav li a:hover,
.news-green #home-top .ui-tabs ul.ui-tabs-nav li.ui-tabs-selected a,
.news-green .navigation li a:hover,
.news-green .navigation li.active a {
background-color: #1c9b3d;
}

.news-green .navigation li a:hover,
.news-green .navigation li.active a {
border: 1px solid #1c9b3d;
}

.news-green h2 a:hover {
text-decoration: none;
}

.news-green input[type="button"],
.news-green input[type="submit"] {
background-color: #27c753;
border: 1px solid #1c9b3d;
}

.news-green input:hover[type="button"],
.news-green input:hover[type="submit"] {
background-color: #1c9b3d;
border: 1px solid #1c9b3d;
}


/* News Orange
------------------------------------------------------------ */

.news-orange a,
.news-orange a:visited {
color: #e88e05;
text-decoration: none;
}

.news-orange a:hover {
text-decoration: underline;
}

.news-orange #header ul.nav li li a,
.news-orange #header ul.nav li li a:link,
.news-orange #header ul.nav li li a:visited,
.news-orange #header ul.menu li li a,
.news-orange #header ul.menu li li a:link,
.news-orange #header ul.menu li li a:visited,
.news-orange #nav li li a,
.news-orange #nav li li a:link,
.news-orange #nav li li a:visited {
color: #fff;
}

.news-orange #subnav li li a,
.news-orange #subnav li li a:link,
.news-orange #subnav li li a:visited,
.news-orange h2 a,
.news-orange h2 a:visited {
color: #333;
}

.news-orange #header ul.nav li a:hover,
.news-orange #header ul.nav li a:active,
.news-orange #header ul.nav .current_page_item a,
.news-orange #header ul.nav .current-cat a,
.news-orange #header ul.nav .current-menu-item a,
.news-orange #header ul.menu li a:hover,
.news-orange #header ul.menu li a:active,
.news-orange #header ul.menu .current_page_item a,
.news-orange #header ul.menu .current-cat a,
.news-orange #header ul.menu .current-menu-item a,
.news-orange #header ul.nav li li a:hover,
.news-orange #header ul.nav li li a:active,
.news-orange #header ul.menu li li a:hover,
.news-orange #header ul.menu li li a:active,
.news-orange #nav li a:hover,
.news-orange #nav li a:active,
.news-orange #nav .current_page_item a,
.news-orange #nav .current-cat a,
.news-orange #nav .current-menu-item a,
.news-orange #nav li li a:hover,
.news-orange #nav li li a:active,
.news-orange #nav li.right a:hover,
.news-orange #subnav li a:hover,
.news-orange #subnav li a:active,
.news-orange #subnav .current_page_item a,
.news-orange #subnav .current-cat a,
.news-orange #subnav .current-menu-item a,
.news-orange #subnav li li a:hover,
.news-orange #subnav li li a:active,
.news-orange h2 a:hover,
.news-orange #footer a:hover {
color: #e88e05;
}

.news-orange #home-top .ui-tabs ul.ui-tabs-nav li a:hover,
.news-orange #home-top .ui-tabs ul.ui-tabs-nav li.ui-tabs-selected a,
.news-orange .navigation li a:hover,
.news-orange .navigation li.active a {
background-color: #e88e05;
}

.news-orange .navigation li a:hover,
.news-orange .navigation li.active a {
border: 1px solid #e88e05;
}

.news-orange h2 a:hover {
text-decoration: none;
}

.news-orange input[type="button"],
.news-orange input[type="submit"] {
background-color: #f5a506;
border: 1px solid #e88e05;
}

.news-orange input:hover[type="button"],
.news-orange input:hover[type="submit"] {
background-color: #e88e05;
border: 1px solid #e88e05;
}


/* News Pink
------------------------------------------------------------ */

.news-pink a,
.news-pink a:visited {
color: #c62765;
text-decoration: none;
}

.news-pink a:hover {
text-decoration: underline;
}

.news-pink #header ul.nav li li a,
.news-pink #header ul.nav li li a:link,
.news-pink #header ul.nav li li a:visited,
.news-pink #header ul.menu li li a,
.news-pink #header ul.menu li li a:link,
.news-pink #header ul.menu li li a:visited,
.news-pink #nav li li a,
.news-pink #nav li li a:link,
.news-pink #nav li li a:visited {
color: #fff;
}

.news-pink #subnav li li a,
.news-pink #subnav li li a:link,
.news-pink #subnav li li a:visited,
.news-pink h2 a,
.news-pink h2 a:visited {
color: #333;
}

.news-pink #header ul.nav li a:hover,
.news-pink #header ul.nav li a:active,
.news-pink #header ul.nav .current_page_item a,
.news-pink #header ul.nav .current-cat a,
.news-pink #header ul.nav .current-menu-item a,
.news-pink #header ul.menu li a:hover,
.news-pink #header ul.menu li a:active,
.news-pink #header ul.menu .current_page_item a,
.news-pink #header ul.menu .current-cat a,
.news-pink #header ul.menu .current-menu-item a,
.news-pink #header ul.nav li li a:hover,
.news-pink #header ul.nav li li a:active,
.news-pink #header ul.menu li li a:hover,
.news-pink #header ul.menu li li a:active,
.news-pink #nav li a:hover,
.news-pink #nav li a:active,
.news-pink #nav .current_page_item a,
.news-pink #nav .current-cat a,
.news-pink #nav .current-menu-item a,
.news-pink #nav li li a:hover,
.news-pink #nav li li a:active,
.news-pink #nav li.right a:hover,
.news-pink #subnav li a:hover,
.news-pink #subnav li a:active,
.news-pink #subnav .current_page_item a,
.news-pink #subnav .current-cat a,
.news-pink #subnav .current-menu-item a,
.news-pink #subnav li li a:hover,
.news-pink #subnav li li a:active,
.news-pink h2 a:hover,
.news-pink #footer a:hover {
color: #c62765;
}

.news-pink #home-top .ui-tabs ul.ui-tabs-nav li a:hover,
.news-pink #home-top .ui-tabs ul.ui-tabs-nav li.ui-tabs-selected a,
.news-pink .navigation li a:hover,
.news-pink .navigation li.active a {
background-color: #c62765;
}

.news-pink .navigation li a:hover,
.news-pink .navigation li.active a {
border: 1px solid #c62765;
}

.news-pink h2 a:hover {
text-decoration: none;
}

.news-pink input[type="button"],
.news-pink input[type="submit"] {
background-color: #e8358a;
border: 1px solid #c62765;
}

.news-pink input:hover[type="button"],
.news-pink input:hover[type="submit"] {
background-color: #c62765;
border: 1px solid #c62765;
}


/* News Purple
------------------------------------------------------------ */

.news-purple a,
.news-purple a:visited {
color: #8827c7;
text-decoration: none;
}

.news-purple a:hover {
text-decoration: underline;
}

.news-purple #header ul.nav li li a,
.news-purple #header ul.nav li li a:link,
.news-purple #header ul.nav li li a:visited,
.news-purple #header ul.menu li li a,
.news-purple #header ul.menu li li a:link,
.news-purple #header ul.menu li li a:visited,
.news-purple #nav li li a,
.news-purple #nav li li a:link,
.news-purple #nav li li a:visited {
color: #fff;
}

.news-purple #subnav li li a,
.news-purple #subnav li li a:link,
.news-purple #subnav li li a:visited,
.news-purple h2 a,
.news-purple h2 a:visited {
color: #333;
}

.news-purple #header ul.nav li a:hover,
.news-purple #header ul.nav li a:active,
.news-purple #header ul.nav .current_page_item a,
.news-purple #header ul.nav .current-cat a,
.news-purple #header ul.nav .current-menu-item a,
.news-purple #header ul.menu li a:hover,
.news-purple #header ul.menu li a:active,
.news-purple #header ul.menu .current_page_item a,
.news-purple #header ul.menu .current-cat a,
.news-purple #header ul.menu .current-menu-item a,
.news-purple #header ul.nav li li a:hover,
.news-purple #header ul.nav li li a:active,
.news-purple #header ul.menu li li a:hover,
.news-purple #header ul.menu li li a:active,
.news-purple #nav li a:hover,
.news-purple #nav li a:active,
.news-purple #nav .current_page_item a,
.news-purple #nav .current-cat a,
.news-purple #nav .current-menu-item a,
.news-purple #nav li li a:hover,
.news-purple #nav li li a:active,
.news-purple #nav li.right a:hover,
.news-purple #subnav li a:hover,
.news-purple #subnav li a:active,
.news-purple #subnav .current_page_item a,
.news-purple #subnav .current-cat a,
.news-purple #subnav .current-menu-item a,
.news-purple #subnav li li a:hover,
.news-purple #subnav li li a:active,
.news-purple h2 a:hover,
.news-purple #footer a:hover {
color: #8827c7;
}

.news-purple #home-top .ui-tabs ul.ui-tabs-nav li a:hover,
.news-purple #home-top .ui-tabs ul.ui-tabs-nav li.ui-tabs-selected a,
.news-purple .navigation li a:hover,
.news-purple .navigation li.active a {
background-color: #8827c7;
}

.news-purple .navigation li a:hover,
.news-purple .navigation li.active a {
border: 1px solid #8827c7;
}

.news-purple h2 a:hover {
text-decoration: none;
}

.news-purple input[type="button"],
.news-purple input[type="submit"] {
background-color: #9f2ede;
border: 1px solid #8827c7;
}

.news-purple input:hover[type="button"],
.news-purple input:hover[type="submit"] {
background-color: #8827c7;
border: 1px solid #8827c7;
}


/* News Red
------------------------------------------------------------ */

.news-red a,
.news-red a:visited {
color: #c72730;
text-decoration: none;
}

.news-red a:hover {
text-decoration: underline;
}

.news-red #header ul.nav li li a,
.news-red #header ul.nav li li a:link,
.news-red #header ul.nav li li a:visited,
.news-red #header ul.menu li li a,
.news-red #header ul.menu li li a:link,
.news-red #header ul.menu li li a:visited,
.news-red #nav li li a,
.news-red #nav li li a:link,
.news-red #nav li li a:visited {
color: #fff;
}

.news-red #subnav li li a,
.news-red #subnav li li a:link,
.news-red #subnav li li a:visited,
.news-red h2 a,
.news-red h2 a:visited {
color: #333;
}

.news-red #header ul.nav li a:hover,
.news-red #header ul.nav li a:active,
.news-red #header ul.nav .current_page_item a,
.news-red #header ul.nav .current-cat a,
.news-red #header ul.nav .current-menu-item a,
.news-red #header ul.menu li a:hover,
.news-red #header ul.menu li a:active,
.news-red #header ul.menu .current_page_item a,
.news-red #header ul.menu .current-cat a,
.news-red #header ul.menu .current-menu-item a,
.news-red #header ul.nav li li a:hover,
.news-red #header ul.nav li li a:active,
.news-red #header ul.menu li li a:hover,
.news-red #header ul.menu li li a:active,
.news-red #nav li a:hover,
.news-red #nav li a:active,
.news-red #nav .current_page_item a,
.news-red #nav .current-cat a,
.news-red #nav .current-menu-item a,
.news-red #nav li li a:hover,
.news-red #nav li li a:active,
.news-red #nav li.right a:hover,
.news-red #subnav li a:hover,
.news-red #subnav li a:active,
.news-red #subnav .current_page_item a,
.news-red #subnav .current-cat a,
.news-red #subnav .current-menu-item a,
.news-red #subnav li li a:hover,
.news-red #subnav li li a:active,
.news-red h2 a:hover,
.news-red #footer a:hover {
color: #c72730;
}

.news-red #home-top .ui-tabs ul.ui-tabs-nav li a:hover,
.news-red #home-top .ui-tabs ul.ui-tabs-nav li.ui-tabs-selected a,
.news-red .navigation li a:hover,
.news-red .navigation li.active a {
background-color: #c72730;
}

.news-red .navigation li a:hover,
.news-red .navigation li.active a {
border: 1px solid #c72730;
}

.news-red h2 a:hover {
text-decoration: none;
}

.news-red input[type="button"],
.news-red input[type="submit"] {
background-color: #e93542;
border: 1px solid #c72730;
}

.news-red input:hover[type="button"],
.news-red input:hover[type="submit"] {
background-color: #c72730;
border: 1px solid #c72730;
}


/* News Teal
------------------------------------------------------------ */

.news-teal a,
.news-teal a:visited {
color: #27c3c7;
text-decoration: none;
}

.news-teal a:hover {
text-decoration: underline;
}

.news-teal #header ul.nav li li a,
.news-teal #header ul.nav li li a:link,
.news-teal #header ul.nav li li a:visited,
.news-teal #header ul.menu li li a,
.news-teal #header ul.menu li li a:link,
.news-teal #header ul.menu li li a:visited,
.news-teal #nav li li a,
.news-teal #nav li li a:link,
.news-teal #nav li li a:visited {
color: #fff;
}

.news-teal #subnav li li a,
.news-teal #subnav li li a:link,
.news-teal #subnav li li a:visited,
.news-teal h2 a,
.news-teal h2 a:visited {
color: #333;
}

.news-teal #header ul.nav li a:hover,
.news-teal #header ul.nav li a:active,
.news-teal #header ul.nav .current_page_item a,
.news-teal #header ul.nav .current-cat a,
.news-teal #header ul.nav .current-menu-item a,
.news-teal #header ul.menu li a:hover,
.news-teal #header ul.menu li a:active,
.news-teal #header ul.menu .current_page_item a,
.news-teal #header ul.menu .current-cat a,
.news-teal #header ul.menu .current-menu-item a,
.news-teal #header ul.nav li li a:hover,
.news-teal #header ul.nav li li a:active,
.news-teal #header ul.menu li li a:hover,
.news-teal #header ul.menu li li a:active,
.news-teal #nav li a:hover,
.news-teal #nav li a:active,
.news-teal #nav .current_page_item a,
.news-teal #nav .current-cat a,
.news-teal #nav .current-menu-item a,
.news-teal #nav li li a:hover,
.news-teal #nav li li a:active,
.news-teal #nav li.right a:hover,
.news-teal #subnav li a:hover,
.news-teal #subnav li a:active,
.news-teal #subnav .current_page_item a,
.news-teal #subnav .current-cat a,
.news-teal #subnav .current-menu-item a,
.news-teal #subnav li li a:hover,
.news-teal #subnav li li a:active,
.news-teal h2 a:hover,
.news-teal #footer a:hover {
color: #27c3c7;
}

.news-teal #home-top .ui-tabs ul.ui-tabs-nav li a:hover,
.news-teal #home-top .ui-tabs ul.ui-tabs-nav li.ui-tabs-selected a,
.news-teal .navigation li a:hover,
.news-teal .navigation li.active a {
background-color: #27c3c7;
}

.news-teal .navigation li a:hover,
.news-teal .navigation li.active a {
border: 1px solid #27c3c7;
}

.news-teal h2 a:hover {
text-decoration: none;
}

.news-teal input[type="button"],
.news-teal input[type="submit"] {
background-color: #2edade;
border: 1px solid #27c3c7;
}

.news-teal input:hover[type="button"],
.news-teal input:hover[type="submit"] {
background-color: #27c3c7;
border: 1px solid #27c3c7;
}

Abdelhadi Touil comments:

The css code I can see it. By the code I mean the php code, because wordpress is a php script :)
You say that the widget is a plugin, so can you tell me witch plugin is it?

benjaminconnor comments:

As for the plugin, it's called video sidebar widgets. There are a number of document/files for it.

The following is the class-videosidebarwidget.php:


<?php
/*
* Widget - Video Sidebar Widget
*/

//Video Sidebar Widget Class to extend WP_Widget class
class VideoSidebarWidget extends WP_Widget {

//function to set up widget in admin
function VideoSidebarWidget() {

$widget_ops = array( 'classname' => 'videosidebar',
'description' => __('A Video Widget to display video in sidebar from various video sharing networks', 'videosidebar') );

$control_ops = array( 'width' => 200, 'height' => 350, 'id_base' => 'videosidebar' );
$this->WP_Widget( 'videosidebar', __('Video Sidebar Widget', 'videosidebar'), $widget_ops, $control_ops );

}


//function to echo out widget on sidebar
function widget( $args, $instance ) {
extract( $args );

$title2 = apply_filters('widget_title2', $instance['title2'] );
$cap2 = $instance['v_cap2'];

echo $before_widget;

// if user written title echo out
if ( $title2 ){
echo $before_title . $title2 . $after_title;
}

//get settings from Widget Admin Form to assign to function VSWShowVideo
$autoplaysetting = $instance['v_autoplay2'];
$videoid = $instance['v_id2'];
$videosource = $instance['v_source'];
$videowidth = $instance['v_width2'];
$videoheight = $instance['v_height2'];

//function to show video in blog sidebar, please look for it below
VSWShowVideo($videosource,$videoid,$autoplaysetting,$videowidth,$videoheight,'false','false');

if($cap2){
echo "<p class=\"VideoCaption\">$cap2</p>";
}

echo $after_widget;

}//end of function widget



//function to update widget setting
function update( $new_instance, $old_instance ) {

$instance = $old_instance;
$instance['title2'] = strip_tags( $new_instance['title2'] );
$instance['v_width2'] = strip_tags( $new_instance['v_width2'] );
$instance['v_height2'] = strip_tags( $new_instance['v_height2'] );
$instance['v_autoplay2'] = strip_tags( $new_instance['v_autoplay2'] );
$instance['v_id2'] = strip_tags( $new_instance['v_id2'] );
$instance['v_source'] = strip_tags( $new_instance['v_source'] );
$instance['v_cap2'] = $new_instance['v_cap2'];
return $instance;

}//end of function update


//function to create Widget Admin form
function form($instance) {

$instance = wp_parse_args( (array) $instance, array( 'title2' => '', 'v_width2' => '', 'v_height2' => '',
'v_autoplay2' => '','v_id2' => '','v_source' => '','v_cap2' => '') );

$instance['title2'] = strip_tags( $instance['title2'] );
$instance['v_width2'] = strip_tags( $instance['v_width2'] );
$instance['v_height2'] = strip_tags( $instance['v_height2'] );
$instance['v_autoplay2'] = strip_tags( $instance['v_autoplay2'] );
$instance['v_id2'] = strip_tags( $instance['v_id2'] );
$instance['v_source'] = strip_tags( $instance['v_source'] );
$instance['v_cap2'] = $instance['v_cap2'];

//function to show video in widget admin form fixed width and height, please look for it below
$autoplaysetting = '0';
$videoid = $instance['v_id2'];
$videosource = $instance['v_source'];
$videowidth = "";
$videoheight = "";
//$admin = true // to show video in admin

VSWShowVideo($videosource,$videoid,$autoplaysetting,$videowidth,$videoheight,'true','false');

?>


<p>
<label for="<?php echo $this->get_field_id('title2'); ?>">Widget Title:</label>
<input class="widefat" id="<?php echo $this->get_field_id('title2'); ?>" name="<?php echo $this->get_field_name('title2'); ?>"
type="text" value="<?php echo $instance['title2']; ?>" />
</p>

<p>
<label for="<?php echo $this->get_field_id( 'v_source' ); ?>">Select Video Source:</label>
<select id="<?php echo $this->get_field_id( 'v_source' );?>" name="<?php echo $this->get_field_name( 'v_source' );?>" class="widefat" style="width:100%;">

<?php
$network = array('YouTube','Vimeo','MySpace','Veoh','Blip','WordPress','Viddler','DailyMotion','Revver','Metacafe','Tudou','Youku','cn6','Google');

foreach($network as $net){

echo "<option value='$net'";
if($instance['v_source'] == $net){
echo 'selected="selected"';
}
echo" >$net</option>";

}

?>


</select>
</p>

<p>
<label for="<?php echo $this->get_field_id('v_id2'); ?>">Video ID: </label>
<input class="widefat" id="<?php echo $this->get_field_id('v_id2'); ?>"
name="<?php echo $this->get_field_name('v_id2'); ?>" type="text" value="<?php echo $instance['v_id2']; ?>" /></p>

<p>
<label for="<?php echo $this->get_field_id('v_width2'); ?>">Video Width: </label>
<input class="widefat" id="<?php echo $this->get_field_id('v_width2'); ?>"
name="<?php echo $this->get_field_name('v_width2'); ?>" type="text" value="<?php echo $instance['v_width2']; ?>" />
</p>

<p>
<label for="<?php echo $this->get_field_id('v_height2'); ?>">Video Height: </label>
<input class="widefat" id="<?php echo $this->get_field_id('v_height2'); ?>"
name="<?php echo $this->get_field_name('v_height2'); ?>" type="text" value="<?php echo $instance['v_height2']; ?>" />
</p>

<p>
<label for="<?php echo $this->get_field_id('v_cap2'); ?>">Video Caption: </label>
<input class="widefat" id="<?php echo $this->get_field_id('v_cap2'); ?>"
name="<?php echo $this->get_field_name('v_cap2'); ?>" type="text" value="<?php echo $instance['v_cap2']; ?>" />
</p>


<p>

<?php

// check whether autoplay feature supported by video network
$source = $instance['v_source'];
$msg = "<p>Sorry, auto play option not supported by ".$source."</p>";
switch ($source) {

case 'WordPress':
echo $msg;
break;

case 'Tudou':
echo $msg;
break;

case 'Youku':
echo $msg;
break;

case 'Blip':
echo "<p>Sorry, auto play option removed as it is causing error in Internet Explorer</p>";
break;

case 'cn6':
echo "<p>Sorry, auto play option not supported by 6.cn</p>";
break;
}

?>

<label for="<?php echo $this->get_field_id( 'v_autoplay2' ); ?>">Auto Play:</label>
<select id="<?php echo $this->get_field_id( 'v_autoplay2' );?>"
name="<?php echo $this->get_field_name( 'v_autoplay2' );?>" class="widefat" style="width:100%;">';
<option value='1' <?php if($instance['v_autoplay2'] == '1'){echo 'selected="selected"';}?>>Yes</option>
<option value='0' <?php if($instance['v_autoplay2'] == '0'){echo 'selected="selected"';}?>>No</option>
</select>
</p>

<?php

}//end of function form($instance)

}//end of Video Sidebar Widget Class
?>

benjaminconnor comments:

Does that help? :-/

benjaminconnor comments:

No worries if all of this is a lot of work. Do I need to pay you extra?

Abdelhadi Touil comments:

Yes, now we are on the right road :)
For now I must leave, I'll continue with you after ~3 hours..
Sorry for that, and good luck..

benjaminconnor comments:

Oh good,

I'll be in bed. It's 11.30pm in Sydney.

Will check this thread in the morning.

Cheers,

Ben

Abdelhadi Touil comments:

Back.
I'v installed the plugin but as I see it needs some time to be edited like you want it, and I don't have enough time for that. I'v found another plugin I think is better, and it let you write a text (post title for example) and put a link, so in the sidebar you'll have the video widget, with your text as link to what you want:

[[LINK href="http://wordpress.org/extend/plugins/widget-video-box/"]]http://wordpress.org/extend/plugins/widget-video-box/[[/LINK]]

Hope you like it. Good luck.

benjaminconnor comments:

Hi Abdelhadi,

Okay, thanks man.

I've installed the easy video box widget plugin.

It's got the link thing, but for some reason it doesn't have the separation line between it and the widget below, which makes it look sloppy (i.e. it merges with the space of the widget below).

You can check it out here (is merging with the facebook 'like' widget):

http://benconnormusic.com/

Also, it doesn't centre so I have to widen it so it goes from one side of the box to the other.

I would like to be able to have it in the centre with space around it.

Are these things simple to adjust?

Here's the php for the plugin:

<?php
/*
Plugin Name: Easy Video Widget Box
Plugin URI: http://www.purpleturtleproductions.ca/
Description: Simple plugin to add video into your widget box. Supports Youtube, Dailymotion, Vimeo and many other sites that provide embedd code.. just don't forget to edit the embedd code to the size of your widget box
Version: 1.2
Author: Purple Turtle Productions
Author URI: http://www.purpleturtleproductions.ca/
*/


class VideoBox extends WP_Widget
{
function VideoBox()
{
$widget_ops = array('classname' => 'VideoBox', 'description' => 'Displays testimonials for homepage...' );
$this->WP_Widget('VideoBox', 'Video Box', $widget_ops);
}

function form($instance)
{
$instance = wp_parse_args( (array) $instance, array( 'video_title' => '', 'video_text' => '', 'video_more' => '', 'video_link' => '' ) );
$video_title = $instance['video_title'];
$video_text = $instance['video_text'];
$video_more = $instance['video_more'];
$video_link = $instance['video_link'];
?>
<p><label for="<?php echo $this->get_field_id('video_title'); ?>">Title: <input class="widefat" id="<?php echo $this->get_field_id('video_title'); ?>" name="<?php echo $this->get_field_name('video_title'); ?>" type="text" value="<?php echo attribute_escape($video_title); ?>" /></label></p>
<p><label for="<?php echo $this->get_field_id('video_text'); ?>">Embed Code: <textarea class="widefat" id="<?php echo $this->get_field_id('video_text'); ?>" name="<?php echo $this->get_field_name('video_text'); ?>"><?php echo attribute_escape($video_text); ?></textarea></label></p>
<p><label for="<?php echo $this->get_field_id('video_more'); ?>">More Text: <input class="widefat" id="<?php echo $this->get_field_id('video_more'); ?>" name="<?php echo $this->get_field_name('video_more'); ?>" type="text" value="<?php echo attribute_escape($video_more); ?>" /></label></p>
<p><label for="<?php echo $this->get_field_id('video_link'); ?>">Link: <input class="widefat" id="<?php echo $this->get_field_id('video_link'); ?>" name="<?php echo $this->get_field_name('video_link'); ?>" type="text" value="<?php echo attribute_escape($video_link); ?>" /></label></p>
<?php
}

function update($new_instance, $old_instance)
{
$instance = $old_instance;
$instance['video_title'] = $new_instance['video_title'];
$instance['video_text'] = $new_instance['video_text'];
$instance['video_more'] = $new_instance['video_more'];
$instance['video_link'] = $new_instance['video_link'];
return $instance;
}

function widget($args, $instance)
{
$video_title = $instance['video_title'];
$video_text = $instance['video_text'];
$video_more = $instance['video_more'];
$video_link = $instance['video_link'];
/*
if ( get_option('videojs_options') ) {
preg_match('/ *video[^>]*mp4 *= *["\']?([^"\']*)/i', $video_text, $matches);
$params['mp4'] = $matches[1];
$video_text = buildVideoJs($params);
}
*/

?>
<div class="video-box">
<?php if ( strlen($video_title)>0) { echo '<h2>'.$video_title.'</h2>'; } ?>
<?php echo $video_text; ?>
<?php if ( strlen($video_more)>0) { echo '<br/><a href="'.$video_link.'">'.$video_more.'</a>'; } ?>
</div>
<?php
}

}
add_action( 'widgets_init', create_function('', 'return register_widget("VideoBox");') );

/*
function buildVideoJs($params) {

$options = get_option('videojs_options'); //load the defaults

extract(shortcode_atts(array(
'mp4' => $params['mp4'],
'webm' => '',
'ogg' => '',
'poster' => '',
'width' => $options['videojs_width'],
'height' => $options['videojs_height'],
'preload' => $options['videojs_preload'],
'autoplay' => $options['videojs_autoplay'],
'id' => '',
'class' => ''
), $atts));

// ID is required for multiple videos to work
if ($id == '')
$id = 'example_video_id_'.rand();

// MP4 Source Supplied
if ($mp4)
$mp4_source = '<source src="'.$mp4.'" type=\'video/mp4\' />';
else
$mp4_source = '';

// WebM Source Supplied
if ($webm)
$webm_source = '<source src="'.$webm.'" type=\'video/webm; codecs="vp8, vorbis"\' />';
else
$webm_source = '';

// Ogg source supplied
if ($ogg)
$ogg_source = '<source src="'.$ogg.'" type=\'video/ogg; codecs="theora, vorbis"\' />';
else
$ogg_source = '';

// Poster image supplied
if ($poster)
$poster_attribute = ' poster="'.$poster.'"';
else
$poster_attribute = '';

// Preload the video?
if ($preload) {
if ($preload == "on")
$preload = "auto";

$preload_attribute = 'preload="'.$preload.'"';
} else {
$preload_attribute = '';
}

// Autoplay the video?
if ($autoplay == "true" || $autoplay == "on")
$autoplay_attribute = " autoplay";
else
$autoplay_attribute = "";

// Is there a custom class?
if ($class)
$class = ' ' . $class;


$videojs = <<<_end_

<!-- Begin Video.js -->
<video id="{$id}" class="video-js vjs-default-skin{$class}" width="{$width}" height="{$height}"{$poster_attribute} controls {$preload_attribute}{$autoplay_attribute} data-setup="{}">
{$mp4_source}
{$webm_source}
{$ogg_source}
</video>
<!-- End Video.js -->

_end_;
return $videojs;
}
*/

?>

benjaminconnor comments:

Oh,

Also, would like the widget title and link text to indent from the left like the other widgets do.

Sorry man.

Would be great if you help.

Does it only require a few appropriately place php statements in the above text?

Cheers,

Ben

Abdelhadi Touil comments:

Add this to your style.css file:
.video-box {
border-bottom: 4px solid #EEEEEE;
}
the problem should be fixed. Good luck.

Abdelhadi Touil comments:

Please add this code to your style.css file:

.video-box {
padding: 15px 20px 20px;
border-bottom: 4px solid #EEEEEE;
}

Use this insted the above one, and make the video player width equal to 265px.
Good luck.

benjaminconnor comments:

Hi Abdelhadi,

It worked and is looking great:

http://benconnormusic.com/

Thank you so much!!!

Did it take much of your time to help me? If so, let me know and i'll send you a little extra cash.

Cheers,

Ben

Abdelhadi Touil comments:

Great news :)
I was happy to help you for 1$ :) If you want to send me extra cash then Thank you ;)
Good luck.

benjaminconnor comments:

Hi Abdelhadi,

I'd be happy to give you some extra cash. Not sure how to though.

Would give you a total of $5 for all your help if you assist me with one last thing:

The line that you helped me put in between the video box and facebook like box is close but not exactly the same as the other lines bordering the widgets. The other ones seem to have a shadow line or something.

If you could give me the code to whack in CSS to make it exactly the same and send me your account details or however I'm supposed to pay you, I'll do so.

Thanks again :-)

Ben

Abdelhadi Touil comments:

Hi.
What you see it's a border-bottom added to the container of each widget, but for the video widget the plugin's developer dosn't add some html code to the plugin, so I'v added it for you (but if you update the plugin in the futur you'll lose these changes).
Open the video-box.php file and replace it by this code and save changes:
<?php
/*
Plugin Name: Easy Video Widget Box
Plugin URI: http://www.purpleturtleproductions.ca/
Description: Simple plugin to add video into your widget box. Supports Youtube, Dailymotion, Vimeo and many other sites that provide embedd code.. just don't forget to edit the embedd code to the size of your widget box
Version: 1.2
Author: Purple Turtle Productions
Author URI: http://www.purpleturtleproductions.ca/
*/


class VideoBox extends WP_Widget
{
function VideoBox()
{
$widget_ops = array('classname' => 'VideoBox', 'description' => 'Displays testimonials for homepage...' );
$this->WP_Widget('VideoBox', 'Video Box', $widget_ops);
}

function form($instance)
{
$instance = wp_parse_args( (array) $instance, array( 'video_title' => '', 'video_text' => '', 'video_more' => '', 'video_link' => '' ) );
$video_title = $instance['video_title'];
$video_text = $instance['video_text'];
$video_more = $instance['video_more'];
$video_link = $instance['video_link'];
?>
<p><label for="<?php echo $this->get_field_id('video_title'); ?>">Title: <input class="widefat" id="<?php echo $this->get_field_id('video_title'); ?>" name="<?php echo $this->get_field_name('video_title'); ?>" type="text" value="<?php echo attribute_escape($video_title); ?>" /></label></p>
<p><label for="<?php echo $this->get_field_id('video_text'); ?>">Embed Code: <textarea class="widefat" id="<?php echo $this->get_field_id('video_text'); ?>" name="<?php echo $this->get_field_name('video_text'); ?>"><?php echo attribute_escape($video_text); ?></textarea></label></p>
<p><label for="<?php echo $this->get_field_id('video_more'); ?>">More Text: <input class="widefat" id="<?php echo $this->get_field_id('video_more'); ?>" name="<?php echo $this->get_field_name('video_more'); ?>" type="text" value="<?php echo attribute_escape($video_more); ?>" /></label></p>
<p><label for="<?php echo $this->get_field_id('video_link'); ?>">Link: <input class="widefat" id="<?php echo $this->get_field_id('video_link'); ?>" name="<?php echo $this->get_field_name('video_link'); ?>" type="text" value="<?php echo attribute_escape($video_link); ?>" /></label></p>
<?php
}

function update($new_instance, $old_instance)
{
$instance = $old_instance;
$instance['video_title'] = $new_instance['video_title'];
$instance['video_text'] = $new_instance['video_text'];
$instance['video_more'] = $new_instance['video_more'];
$instance['video_link'] = $new_instance['video_link'];
return $instance;
}

function widget($args, $instance)
{
$video_title = $instance['video_title'];
$video_text = $instance['video_text'];
$video_more = $instance['video_more'];
$video_link = $instance['video_link'];
/*
if ( get_option('videojs_options') ) {
preg_match('/ *video[^>]*mp4 *= *["\']?([^"\']*)/i', $video_text, $matches);
$params['mp4'] = $matches[1];
$video_text = buildVideoJs($params);
}
*/

?>
<div class="widget widget_video-box">
<div class="video-box">
<?php if ( strlen($video_title)>0) { echo '<h2>'.$video_title.'</h2>'; } ?>
<?php echo $video_text; ?>
<?php if ( strlen($video_more)>0) { echo '<br/><a href="'.$video_link.'">'.$video_more.'</a>'; } ?>
</div>
</div>
<?php
}

}
add_action( 'widgets_init', create_function('', 'return register_widget("VideoBox");') );

/*
function buildVideoJs($params) {

$options = get_option('videojs_options'); //load the defaults

extract(shortcode_atts(array(
'mp4' => $params['mp4'],
'webm' => '',
'ogg' => '',
'poster' => '',
'width' => $options['videojs_width'],
'height' => $options['videojs_height'],
'preload' => $options['videojs_preload'],
'autoplay' => $options['videojs_autoplay'],
'id' => '',
'class' => ''
), $atts));

// ID is required for multiple videos to work
if ($id == '')
$id = 'example_video_id_'.rand();

// MP4 Source Supplied
if ($mp4)
$mp4_source = '<source src="'.$mp4.'" type=\'video/mp4\' />';
else
$mp4_source = '';

// WebM Source Supplied
if ($webm)
$webm_source = '<source src="'.$webm.'" type=\'video/webm; codecs="vp8, vorbis"\' />';
else
$webm_source = '';

// Ogg source supplied
if ($ogg)
$ogg_source = '<source src="'.$ogg.'" type=\'video/ogg; codecs="theora, vorbis"\' />';
else
$ogg_source = '';

// Poster image supplied
if ($poster)
$poster_attribute = ' poster="'.$poster.'"';
else
$poster_attribute = '';

// Preload the video?
if ($preload) {
if ($preload == "on")
$preload = "auto";

$preload_attribute = 'preload="'.$preload.'"';
} else {
$preload_attribute = '';
}

// Autoplay the video?
if ($autoplay == "true" || $autoplay == "on")
$autoplay_attribute = " autoplay";
else
$autoplay_attribute = "";

// Is there a custom class?
if ($class)
$class = ' ' . $class;


$videojs = <<<_end_

<!-- Begin Video.js -->
<video id="{$id}" class="video-js vjs-default-skin{$class}" width="{$width}" height="{$height}"{$poster_attribute} controls {$preload_attribute}{$autoplay_attribute} data-setup="{}">
{$mp4_source}
{$webm_source}
{$ogg_source}
</video>
<!-- End Video.js -->

_end_;
return $videojs;
}
*/

?>
It must work. Good luck.

benjaminconnor comments:

Thanks Abdelhadi, that's worked a treat!

Sorry for the delay. Had a busy weekend

Let me know if I do anything to thank you.

Cheers,

Ben

benjaminconnor comments:

Hi Trevor,

Thanks for this, but problem has already been solved.

Cheers,

Ben