Today I was messing around with the new OptimizePress Smart Theme which is a really awesome new theme. I was trying to get the Blog Hero Images to show up on category pages.

After some poking around in the code, I realized that the Smart Theme includes a custom body class for .category and .category-category-slug – so that made it possible to target category pages and even specific category pages to add a hero background image.

OptimizePress will likely add features and settings for this in a future update, but if you don’t want to wait, you can use the code below to accomplish this now. Just be sure to change out the image URL. I would recommend 1280×600 minimum size for the hero images. Smaller images will work if they are high quality.

Also, you can use to help find the rgb color. The “0.5” in rgba(0,0,0,0.5); is the opacity which can be adjusted as well. The lower the opacity number, the lighter the background color will appear.