Ask your WordPress questions! Pay money and get answers fast!

Customizing Single Sidebar - Genesis WordPress

SOLVED

Hello!

I'm trying to target JUST the homepage sidebar on this page:

http://wholetrifecta.com/

I want to be able to style that sidebar differently from the rest of the sidebars.

Thanks!
Linda

2013-03-04 by ohlivia13

Answers (3)

2013-03-04

Arnav Joy answers:

please check this plugin

http://wordpress.org/extend/plugins/genesis-simple-sidebars/

Also check these links

http://dreamwhisperdesigns.com/genesis-tutorials/load-sidebar-specific-pages/

and

http://brianlis.com/add-a-unique-sidebar-to-the-genesis-home-page.htm/

ohlivia13 comments:

Ah! Well, that does help some.

Now, how do I target a specific sidebar?

Thanks!

ohlivia13 comments:

I know how to add them - just having problems styling them!

That's what I paid for help for :)

Arnav Joy comments:

show me your link and let me know how you want to style it?

ohlivia13 comments:

Just need to add a negative margin, so that it lines up with the top of the content section.

Can't for the life of me find the right selector combination.

http://wholetrifecta.com/contact/

Thank you!

Arnav Joy comments:

you can do it in two ways:-

for only this page whose id is 15

.page-id-15 .sidebar{margin-top:-15px !important;}

or if you want to add it to all of your default page then use it

.page-template-default .sidebar{margin-top:-15px !important;}

ohlivia13 comments:

So, I can't target the sidebar itself?

That seems silly. Thank you for the page tip, though. That should work.

Arnav Joy comments:

i think you have corrected it , it is looking good now on your site..

2013-03-04

Jerson Baguio answers:

I used Wordpress Page Widgets plugin which enables sidebar to assigned specific widgets in posts and pages..

plugin link http://www.codeandmore.com/products/wordpress-plugins/wp-page-widget/

2013-03-05

Duncan O'Neill answers:

The home page has a body class of "home". You can use that to target your styles just to the homepage sidebar. Following are some examples ( using the sidebar's id of #sidebar )

To change the font-size of the h2 heading in this sidebar;

.home #sidebar h2 {font-size:30px;}
The following would color the list-items in the sidebar red IF there were no inline styles. As it is, you have inline styles in your <span>s inside the lists. I can't tell whether you have added this manually, or whether this is a setting you've made in your Genesis theme.
.home #sidebar ul li {color:red;}

Duncan O'Neill comments:

The home page has a body class of "home". The sidebar has an id of "sidebar". So to target only this sidebar only on the home page, use .home #sidebar. To target the h2 deadings within the sidebar, for example:
.home #sidebar h2 {font-size:30px;}

Hope this helps.