Photo Thumbnail grid for category archives page

[CJWheels]

I'm using NewsPro theme: http://creating.howtorockyourblog.com

I need the category archives to display as a photo grid: http://creating.howtorockyourblog.com/category-3/

My problem is that I would like to keep the sidebar and I do not want the feature images in the footer to shrink as the are doing on the category archive page. I used the bottom of this tutorial to get where I am now.

http://sridharkatakam.com/category-images-grid-template-genesis/

Just using steps 5 and 6.

What I'd really like, is something more like this: http://demo.thepixelista.com/innovative/category/appetizer/

I did try adding this category archive page, and css, but it did not work.

As usual, I know this is easy...just can't figure out what I'm missing.

Cynthia

http://creating.howtorockyourblog.com/category-3/

[Brad Dalton]

There's many different ways you can do this.

Using templates.
PHP code
CSS

---

Tutorials for StudioPress Themes & WooCommerce.

[CJWheels]

I'm comfortable using the php and css. I just want all category archives to show as a photo grid, while still inheriting the sidebar and not affecting the footer. Can't find the right tutorial that does that.

[CJWheels]

I found this: http://wpsites.net/web-design/archive-page-grid-style-columns-using-css/

Which I love the idea of just doing this with CSS.

I have it now on the site, but it's affecting the footer, which is using the feature posts widget.

I tried doing this:

.footer-widgets .archive .post {
display: inline-block;
padding: 2%;
width: 100%;
}

but it didn't work. Thoughts on correcting the footer?

[CJWheels]

OMG...super easy fix!

.footer-widgets .archive, .footer-widgets .post {
display: inline;
padding: 2%;
width: 100%;
}

And we're done! http://creating.howtorockyourblog.com/uncategorized/

[Brad Dalton]

Yes. That's the easiest way to do it.

---

Tutorials for StudioPress Themes & WooCommerce.

[Author]

Posts