Splitting Sidebar in Optimal Theme

Tagged: Optimal, primary sidebar, split sidebar

This topic has 3 replies, 2 voices, and was last updated 10 years, 2 months ago by Wes.

Viewing 4 posts - 1 through 4 (of 4 total)

Author

Posts
February 16, 2014 at 5:57 pm #10719
askdesign
Customer
I’m using the Optimal theme primary sidebar. Underneath the full width of the sidebar, I’d like to split it into 2 equal halves. I’ve used Brad Dalton’s wonderful code that he has generously shared, but it doesn’t work with the Optimal theme and I don’t know why. Here’s his code:

http://wpsites.net/web-design/genesis-split-sidebars/

The split sidebar, left and right sidebars, bottom sidebar all seem to get registered correctly in the functions.php file. But the CSS isn’t working and seems to be over-ridden by some widget-related CSS that I cannot isolate. When I view in Firebug and select the split sidebar area html, the CSS does not appear. In Chrome, I can see that the div width is 351px, when it should be 160px. Here’s my site where I’ve been trying to get this to work (the split sidebar begins at the Comments area):

http://www.askdesign.biz/blog/

Many thanks for any help you could provide.
February 17, 2014 at 4:49 pm #10746
Wes
Moderator
Are you sure you added the css? I can see that the widget locations are showing up, but I don’t see any css styles for it.

Once you add the css it should work instantly. Here is what it will look like once you do – http://i.imgur.com/mSd9dfe.png

Also, if you did add the css and it’s not showing up, make sure you clear your cache if you’re using any caching plugins for your site.

Let me know if this helps.
```
.split-sidebars .aligncenter {
	margin: 0 auto 12px;
	margin: 0 auto 1.2rem
}
 
.split-sidebars ul.children {
	margin-left: 0;
}
 
.split-sidebar-left,
.split-sidebar-right {
	width: 160px;
}
 
.split-sidebar-left {
	float: left;
}
 
.split-sidebar-right {
	float: right;
}
 
.bottom-sidebar {
	clear: both;
}
 
/*
Add To Media Queries max-width: 1139px
---------------------------------------------------------------------------------------------------- */
@media only screen and (max-width: 1139px) {
 
    .split-sidebar-left,
	.split-sidebar-right {
		width: 100%;
	}
}
```
February 17, 2014 at 6:04 pm #10760
askdesign
Customer
Hi Wes,
I definitely added the CSS. It is related to cache-ing. I de-activated Cloudflare AND turned off my host’s added feature “SuperCacher”. Now, at least in Chrome, I can see the split sidebar: yay! I’m still not seeing it in Firefox or Safari, but I’m hoping the new cache-ing settings filter through eventually.
many thanks!
February 17, 2014 at 6:21 pm #10764
Wes
Moderator
You’re Welcome!
Author

Posts

Viewing 4 posts - 1 through 4 (of 4 total)

The topic ‘Splitting Sidebar in Optimal Theme’ is closed to new replies.