Return to previous page

What steps can be taken to add the icon?

This topic has 16 replies, 3 voices, and was last updated 1 years, 6 months ago ago by Rose Tyler

Catholicans

Participant

April 19, 2023 at 07:53

There is currently no ‘Add to cart’ icon visible when hovering over this section. What steps can be taken to add the icon?

Screenshot of the section:
https://snipboard.io/A9T5Uz.jpg

I want this section like:
https://snipboard.io/dCc1MW.jpg

#353702 Copied Theme version: 0.0.1 WooCommerce version: Version 7.5.1

15 Answers

Tony Rodriguez

Support staff

April 19, 2023 at 09:20

Hello, Catholicans,

We are pleased to inform you that your issue has been resolved. Please clear your browser cache and check your site again. The issue was caused by custom CSS added to the home page, which we have now commented out. Please refer to the screenshots below for further information:

https://postimg.cc/m1Qdq84w
https://postimg.cc/F7rq8Xfk

Best Regards,
8Theme’s Team

#353730 Copied

Catholicans

Participant

April 20, 2023 at 08:49

The product box is missing a comparison option. Is it possible for me to add a compare icon right below the wishlist icon?

Screenshot:
https://snipboard.io/PQ3JRv.jpg

Additionally, is it possible to make the “Add to Cart” button in the home page product slider sections look the same as the one on the shop page, as shown in the provided screenshots?
screenshot of shop page:
https://snipboard.io/2nI3bZ.jpg

One of the Screenshot of the section where I want this ‘Add to cart’ button:
https://snipboard.io/eUY2lg.jpg

#353910 Copied

Tony Rodriguez

Support staff

April 20, 2023 at 09:26

Hello, Catholicans,

1) In order to resolve your issue, please navigate to Xstore > Theme options > Woocommerce (Shop) > Shop > Product Design > Design Type > Button on hover right and publish the changes.
We hope this helps.

Please refer to the image provided at the following link for further reference: https://postimg.cc/QKZKLvgf

2) In order to ensure that the “Add to Cart” button in the home page product slider sections is consistent with the one on the shop page, please select the same Product design type as the shop page.

We kindly request that you edit the home page using the WP-Bakery back-end editor mode. Specifically, please edit the product widget and select the “Product design type Button on hover right” option before saving the settings.

For further reference, please refer to the image provided at the link below. https://postimg.cc/SXsgj12S and https://postimg.cc/jw8w2vfb

If you have any additional questions or concerns, please do not hesitate to reach out to us. Our support team is always available to assist you.

Best Regards,
8Theme’s Team

#353919 Copied

Catholicans

Participant

April 20, 2023 at 13:22

Is it possible to place three icons in the middle, along with an ‘Add to Cart’ button that is identical to the one on the shop page when hovering? I want this change for entire website.

Button in the shop page:
https://snipboard.io/l7vBGp.jpg

#353954 Copied
Rose Tyler

Support staff

April 20, 2023 at 14:44
Hello, Catholicans,

1/ There is no such option, but custom CSS code can be used. For example:
```
.product_list_widget li:not(:hover) .quantity-wrapper {
    -webkit-transform: translateY(0px) !important;
    transform: translateY(0px);
    opacity: 1;
    visibility: visible;
    background-color: transparent !important;
}
```
2/ Theme Options > WooCommerce > Shop > Products design > Design Type; Edit Home page > Products element > Product design type.

Kind Regards,
8theme team
#353968 Copied
Catholicans

Participant

April 21, 2023 at 04:46

My aim is to bring the 3 icons on the middle while hovering and there should be the add to cart button on the bottom.
https://snipboard.io/k9eBF0.jpg

#354002 Copied

Tony Rodriguez

Support staff

April 21, 2023 at 06:02

Hello, Catholicans,

We have resolved your issue. Please clear your browser cache and revisit your site. Additionally, we have added CSS code under XStore > Theme Options > Theme Custom CSS > Global.

CSS: https://postimg.cc/LhpJRy6H
Home Page: https://postimg.cc/bZDy1bNC
Shop Page: https://postimg.cc/zbfPRwq3

Best Regards,
8Theme’s Team

#354006 Copied

Catholicans

Participant

April 21, 2023 at 09:04

How can I remove ‘Add to cart’ icon from product sliders?
Screenshot:
https://snipboard.io/nxv4Tb.jpg

#354034 Copied

Tony Rodriguez

Support staff

April 21, 2023 at 09:45

Hello, Catholicans,

In order to assist you with your issue, we have created a video for you to watch and follow the steps shown. https://www.veed.io/view/a04d38f3-e85c-459e-aea1-bad5c8020715?sharingWidget=true&panel=share

If you have any additional questions or concerns, please do not hesitate to reach out to us. Our support team is always available to assist you.

Best Regards,
8Theme’s Team

#354041 Copied

Catholicans

Participant

April 21, 2023 at 10:49

Without altering the design of the product in any other way, my objective is to eliminate the icon that I have highlighted in the screenshot.

Screenshot: https://snipboard.io/nxv4Tb.jpg

#354050 Copied
Rose Tyler

Support staff

April 21, 2023 at 11:44
Hello, Catholicans,

In this instance, you may utilize the following custom CSS code:
```
.product-view-mask3 .content-product .footer-product .add_to_cart_button {
    display: none;
}
```
We hope this information is helpful.

Best Regards,
8Theme’s Team
#354062 Copied
Catholicans

Participant

April 21, 2023 at 12:56

Unfortunately, this was not working for me.

#354081 Copied
Rose Tyler

Support staff

April 21, 2023 at 13:00
Hello, Catholicans,

Thank you for your response.
Please check the code to:
```
.product-view-mask3 .content-product .footer-product .add_to_cart_button {
        display: none !important;
}
```
Best Regards,
8Theme’s Team
#354083 Copied
Catholicans

Participant

May 3, 2023 at 06:44

.product_list_widget li:not(:hover) .quantity-wrapper {
-webkit-transform: translateY(0px) !important;
transform: translateY(0px);
opacity: 1;
visibility: visible;
background-color: transparent !important;
}

This code not working now

#355220 Copied

Rose Tyler

Support staff

May 3, 2023 at 08:50

Hello, Catholicans,

Thank you for your response.

You may add !important; – https://prnt.sc/SD51WoWDdjoG

We hope this information is helpful.

Best Regards,
8Theme’s Team

#355241 Copied
Tagged: addition, icons, persuasive, steps, templates, woocommerce, wordpress
Viewing 16 results - 1 through 16 (of 16 total)