Return to previous page

Category Slider – New, Sale, All Category – Image

This topic has 6 replies, 3 voices, and was last updated 3 months, 1 weeks ago ago by Andrew Mitchell

Vijith

Participant

August 9, 2024 at 22:00

Hi,
Is there an option to add category image to the “Sale, New & All” category items. – Please see attached.

Files is visible for topic creator and
support staff only.

#409706 Copied Theme version: 9.3.17

5 Answers
Luca Rossi

Support staff

August 10, 2024 at 15:00
Hi @Vijith,

Right now, you can only change by add the custom CSS codes. This codes should be put under XStore > Theme Options > Theme Custom CSS > Global CSS:
```
.swiper-wrapper .swiper-slide:nth-child(1) .etheme-category-grid-image a {
    display: block;
    background: url(https://awtextil.pl/wp-content/uploads/2024/08/2.jpg) no-repeat center center;
    color: #fff; 
}

.swiper-wrapper .swiper-slide:nth-child(2) .etheme-category-grid-image a {
    display: block;
    background: url(https://awtextil.pl/wp-content/uploads/2024/08/2.jpg) no-repeat center center;
    color: #fff; 
}

.swiper-wrapper .swiper-slide:nth-child(3) .etheme-category-grid-image a {
    display: block;
    background: url(https://awtextil.pl/wp-content/uploads/2024/08/2.jpg) no-repeat center center;
    color: #fff; 
}
```
https://prnt.sc/_eSu0TBBVgdU

Hope it helps!
#409765 Copied
Vijith

Participant

August 12, 2024 at 19:10

Dear Rossi,

Thanks for the support.

I added the css code and images to a custom location. However, the category images not fit into it as cover image (Same as other category images). Refer to the screenshot.

Further, can we remove the text “All, Sale, New” ?

Files is visible for topic creator and
support staff only.

#409992 Copied
Luca Rossi

Support staff

August 13, 2024 at 05:51
Hi @Vijith,

In this case, please update the previous CSS codes to this:
```
.swiper-wrapper .swiper-slide:nth-child(1) .etheme-category-grid-image a {
    display: block;
    background: url(https://modami.lk/wp-content/uploads/custom-categories/all-category.png) no-repeat center center;
    background-size: contain;
    text-indent: -9999px;
}

.swiper-wrapper .swiper-slide:nth-child(2) .etheme-category-grid-image a {
    display: block;
    background: url(https://modami.lk/wp-content/uploads/custom-categories/newarrival.webp) no-repeat center center;
    background-size: contain;
    text-indent: -9999px;
}

.swiper-wrapper .swiper-slide:nth-child(3) .etheme-category-grid-image a {
    display: block;
    background: url(https://modami.lk/wp-content/uploads/custom-categories/sale.webp) no-repeat center center;
    background-size: contain;
    text-indent: -9999px;
}
```
https://prnt.sc/RcBNVuL4ak34

Let us know how it goes!
#410017 Copied
Vijith

Participant

August 13, 2024 at 10:01

Dear Rossi,

EXCELLENT – It is working great – Thanks a lot again..

You guys are really rocking!

#410054 Copied

Andrew Mitchell

Support staff

August 13, 2024 at 10:01

Dear Vijith,

We hope you’re reveling in the experience our theme brings! Your enthusiasm is what fuels our passion. Would you be so kind as to channel that energy into a 5-star rating on ThemeForest? Your feedback is the spark that lights our way!

Click here to spread the love: https://themeforest.net/downloads

Thank you for being an integral part of our journey!

Best Regards,
The 8Theme Team

#410055 Copied
Tagged: all category themes, category slider, image-slider, new sale themes, woocommerce themes, wordpress themes
Viewing 6 results - 1 through 6 (of 6 total)

The issue related to '‘Category Slider – New, Sale, All Category – Image’' has been successfully resolved, and the topic is now closed for further responses

Category Slider – New, Sale, All Category – Image

Recent Topics

Helpful Topics

Useful links WooCommerce & WordPress

Browse by popular tags:

Explore our best WordPress WooCommerce Themes collection