Add Sidebar to Category Page

[martin]

Hello,

How can I add a sidebar to the category page?

I would like it to be 2 columns of blog post previews and then the sidebar on the right.

Thanks.

[Towfiq I.]

you can change the category layout in PRO version only.

[martin]

ok I do not see it on your demo page: http://zenonpro.towfiqi.com/

so you can confirm that if I buy the Pro version I will be able to change the category page layout to have a right sidebar?

thanks!

[Towfiq I.]

In PRO its not there by default. but you can change it by editing this line of category.php:

<?php get_template_part(''.$zn_lays = of_get_option('layout_images').''); ?>

with this:

<?php get_template_part('layout4'); ?>

[martian7]

hello,

well i purchased the theme upgrade, but looks like the upgrade doesnt save the custom work the previous developer did on this theme before.

any way i can just get the side bar on the category page without loosing all the custom work the previous developer did?

http://coreypowellhair.com/category/blog/

thanks.

[Towfiq I.]

did he make only css changes?

[martian7]

i dont think so, im not sure how the customizations were made. i dont see a custom css area in your theme options.

their is a outline on all pages, when i activate the upgrade theme, the pages layout the content very differently.

[Towfiq I.]

he made these changes to your stylesheet.( green color texts on right):
http://www.diffchecker.com/9to8g4hs

you will have to find and make those changes to your PRO stylesheet too.

[martian7]

thanks for that.

back to original issue:

i made updated the category.php file and it works, but we would like to have excerpt boxes like on the standard category view page.

can we get the blog post featured preview boxes in 2 columns with the right sidebar?

[martian7]

heres the page i want to add the sidebar on: http://coreypowellhair.com/category/blog/

[Towfiq I.]

download this file and upload it to your theme folder and let me know:

http://ge.tt/api/1/files/6f04i0S1/0/blob?download

[martian7]

ok i uploaded it to the Zenon pro folder. looks like the sidebar is loading below, i would like it to be 2 columns of blog post previews and the third column the right sidebar.

thank you.

http://coreypowellhair.com/category/blog/

[Towfiq I.]

First add this to the very bottom of your Stylesheet:

#sidebar{margin-top:20px;}
.lay1 {width: 670px;}

then open up zenon.js file and replace this line:

var divs = jQuery(".lay1 .hentry");

with this:

var divs = jQuery(".home .lay1 .hentry");

if you dont know how to edit the zenon.js file, try this plugin:

http://wordpress.org/plugins/solid-code-theme-editor/

[martian7]

got it, its almost there, the boxes are stacking oddly: http://coreypowellhair.com/category/blog/

appreciate your help.

[Towfiq I.]

Add this to the very bottom of your stylesheet:

.category-blog .lay1 .hentry:nth-child(3), .category-blog .lay1 .hentry:nth-child(6), .category-blog .lay1 .hentry:nth-child(9), .category-blog .lay1 .hentry:nth-child(12), .category-blog .lay1 .hentry:nth-child(15), .category-blog .lay1 .hentry:nth-child(18) {
margin-right: 25px!important;
}

.category-blog .lay1 .hentry:nth-child(2), .category-blog .lay1 .hentry:nth-child(4), .category-blog .lay1 .hentry:nth-child(6), .category-blog .lay1 .hentry:nth-child(8), .category-blog .lay1 .hentry:nth-child(10), .category-blog .lay1 .hentry:nth-child(12) {
margin-right: 25px!important;
}

[martian7]

ok i added that css code, but it only shows 1 column now.

[Towfiq I.]

oops sorry. try replacing this:

.category-blog .lay1 .hentry:nth-child(2), .category-blog .lay1 .hentry:nth-child(4), .category-blog .lay1 .hentry:nth-child(6), .category-blog .lay1 .hentry:nth-child(8), .category-blog .lay1 .hentry:nth-child(10), .category-blog .lay1 .hentry:nth-child(12) {
margin-right: 25px!important;
}

with this:

.category-blog .lay1 .hentry:nth-child(2), .category-blog .lay1 .hentry:nth-child(4), .category-blog .lay1 .hentry:nth-child(6), .category-blog .lay1 .hentry:nth-child(8), .category-blog .lay1 .hentry:nth-child(10), .category-blog .lay1 .hentry:nth-child(12) {
margin-right: 0px!important;
}

[martian7]

thanks thats seems to look good now.