ResolvedCSS Name for Category Page?
- This topic has 4 replies, 2 voices, and was last updated 3 years ago by
kimagine.
- AuthorPosts
- October 30, 2020 at 5:23 pm #26812
kimagine
ParticipantI apologize in advance if I’m not wording things correctly. 🙂
I used the custom CSS snippet from another forum post to change the background image for my Blog Post and Product Pages:
body.single-product .zass_title_holder {
background-image: url(https://kimagine.com/webstore/wp-content/uploads/2020/10/rose-overlay-BACK-10.jpg);
background-size: cover;
background-repeat:none;
}
body.single-product .zass_title_holder h1.heading-title, body.single-product .zass_title_holder .breadcrumb, body.single-product .zass_title_holder .breadcrumb a {
color: #ffffff !important;
}I would like to do the same for the Category pages, but I can’t figure out what they are called, CSS-wise. And by Category pages, I mean the pages that come up when you’ve clicked on one of the categories in the slider, that show all of the products in that selected category.
Thanks!
November 2, 2020 at 12:41 pm #26862Althemist
KeymasterHello Kimagine,
Yes, it can be done with CSS, but especially for the product categories it’s not really needed. We have a custom option for this and you can assign image background for each individual category in it’s settings.
November 8, 2020 at 4:40 am #27027kimagine
ParticipantThanks for the reply!
I tried that, and while it did work I noticed that the image area between the torn paper effect was larger than the pages that I used the CSS – even though I used the same image. I like the smaller strip.
Here’s a single post page that has the smaller image area: https://kimagine.com/webstore/product/enameled-spoon-pendant/
And here’s what happens when I add that same background in the category section: https://kimagine.com/webstore/product-category/unique-unusual/
Would you be able to tell me how to do it with CSS?
November 8, 2020 at 1:30 pm #27039Althemist
KeymasterYes, when there is an image background, the title become slightly taller, in order to show more of the image.
You can do it with CSS, but if it’s the same image on all categories may be the CSS approach to assign the image would be better as you’d only need to do it once.
CSS to make the title on categories smaller:
body.tax-product_cat .zass_title_holder.title_has_image .inner { padding-top: 10px !important; padding-bottom: 10px !important; }
November 9, 2020 at 3:56 am #27047kimagine
ParticipantThanks so much, that did the trick!
And thank you for making such a lovely theme, I’m very pleased with my website. 🙂
- AuthorPosts
You must be logged in and have valid license to reply to this topic.