Return to previous page

FIlter – styling and several other questions

This topic has 4 replies, 2 voices, and was last updated 1 years, 1 months ago ago by Rose Tyler

gewoonbovenaan

Participant

November 6, 2023 at 14:36

Hi i have some questions regarding a new webshop (staging site).
1). i would like to have the filter collapsed by default, how to do that? https://gyazo.com/9fc7439dee207b051a8d39aeddf2d7be
2). Now the shop overview look like this: https://gyazo.com/30b5ffe1ae78651ebdf875630ba6faf0
but the white in the box should not be connected with eachother so the box should look like this: https://gyazo.com/f4bb62fb1defe5a1fe3f7c9c6dffdab2
3). There is this weird bug: on the first page everything is fine. https://gyazo.com/258a425f4f2556b8e1252cb6403f3a71 but on the second page the layout is crashed: https://gyazo.com/0b1ec1af67fde045b3227582247680f3
4). Where can i change the color of the heart icon from the wishlist: https://gyazo.com/94985c44026929ac76b4b8878afb02f5
5). Where can i change the color of the off grid cart? https://gyazo.com/e38d8e3f4a9fa494cb09d229af24cd31

Please, contact administrator
for this information.

#372722 Copied Theme version: 9.22

3 Answers
Rose Tyler

Support staff

November 6, 2023 at 16:55
Hello, Gewoonbovenaan,

Thank you for contacting us and for using XStore.

1/ Ho you mean this https://prnt.sc/9qSXNaa-NCRF ?

2/ Please try to use the next custom CSS code:
```
.products-bordered-layout .product-image-wrapper, .products-bordered-layout.products-list .content-product {
    margin-top: 0px;
}
.main-products-loop .product, .products-loop .product, .carousel-area .product-slide .product {
    padding: 15px;
}
```
3/ Please go to Theme Options > WooCommerce (Shop) > Shop > Products style > Show Excerpt In Content Product > Off.
It is because your excerpt contains tags, and when a part of the excerpt is taken to show on the Shop page, some unclosed tags cause the problem. Keep the option disabled or edit the description of products. You can add a few words in the Short description area, without tags, then the content will be displayed just fine.

4/ Please provide URL of page with the icon.

5/ Header Builder > Cart > Dropdown setings.

Kindly proceed to the following location: Elementor > Settings > Integrations > WooCommerce. Once there, please select the option to disable the Mini Cart Template.

Kind Regards,
8theme team
#372741 Copied
gewoonbovenaan

Participant

November 6, 2023 at 20:02

1) i mean that now you have to scroll down to use the filter but it would be good when its expanded already so you dont have to scroll: https://gyazo.com/3b252de198cd920e94b32503d5e0b625
2)thanks! i would like to have a small shadow like in the scrn shot i showed.
3) thanks
4) it is on every shoppage on the right up corner but u cant see it as the heart is black and the image too. on a white background u see it. https://peaceful-panini.185-57-8-199.plesk.page/shop/page/3/
5) cant find the dropdown settings..
thanks!

#372753 Copied
Rose Tyler

Support staff

November 7, 2023 at 09:01
Hello, Gewoonbovenaan,

We appreciate your prompt response.

1/ To disable the scroll, please go to Theme Options > WooCommerce > Shop > Shop page filters > Scrollable Widgets > Off.

2/ The next custom CSS code can be used:
```
.content-product {
    box-shadow: 10px 10px 5px 0px rgba(0,0,0,0.75);
    -webkit-box-shadow: 5px 5px 5px 0px rgba(0,0,0,0.75);
    -moz-box-shadow: 10px 10px 5px 0px rgba(0,0,0,0.75);
}
```
Here is a link to box shadow css generator – https://cssgenerator.org/box-shadow-css-generator.html https://prnt.sc/u8iJeJzbq1Ke

3/ You’re welcome!

4/ Custom CSS code to change the color of the icon:
```
.et-heart:before {
    color: red;
}
```
5/ Header Builder > Cart > https://prnt.sc/h9jQ2bZ-kZ7P

Kind Regards,
8theme team
#372800 Copied
Tagged: advanced wordpress filters, woocommerce filters, woocommerce questions, woocommerce styling guide, woocommerce template solutions, wordpress customization, wordpress templates styling
Viewing 4 results - 1 through 4 (of 4 total)