How To Change Category Page Layout

Tagged: category

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

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

Author

Posts
May 1, 2014 at 7:13 am #28351

TheSydneySiders
Member

Hi,

Just wanted to start off by saying that the Catch themes are amazing! I was previously using another theme which didn’t offer much in terms of flexibility and built in theme options. It has been so much easier since changing to Catch themes!

I have set up my website so that categories are listed in the menu bar, and clicking upon a category shows all the posts which have been tagged under that particular category.
I was wondering if there is a way to change how those posts appear? I know that I am able to change between displaying the full post and just a preview. Am I able to change the layout, such that each post appears in a box? Maybe with the thumbnail on the left and the preview text on the right next to it? Where the image and the text appear don’t really matter too much, but I would like each post preview to appear in a box so that each post looks a little more distinct.

I’m not sure if this is a setting/option I need to adjust or a code I need to add in.

Any help is greatly appreciated!
Thank you in advance!

May 1, 2014 at 12:29 pm #28384
Sakin
Keymaster
@TheSydneySiders: Please post in your site URL so that I can help you width exact CSS. For now I am giving you code on the basis of Catch Everest Theme. First, just make the layout as Excerpt mode and add Featured image in those post. Make sure you add small featured image for the left align then add the following css in “Appearance => Theme Options => Custom CSS” box.
```
.archive .site-content article {
    border: 1px solid #e6e6e6;
    display: block;
    padding: 10px 2%;
    height: 1%;
    overflow: hidden;
}
.archive .site-content article .featured-image {
    display: inline-block;
    float: left;
    width: 22%;
}
.archive .site-content article .entry-container {
    display: inline-block;
    float: right;
    width: 75%;
}
```
May 1, 2014 at 6:40 pm #28445

TheSydneySiders
Member

Thank you so so much! That code works perfectly!
Really appreciate it!

May 1, 2014 at 10:55 pm #28473

Sakin
Keymaster

@TheSydneySiders: Thanks for your appreciation.
Author

Posts