Add to cart button in product listing page

[kapil7]

How to add ‘Add to cart’ button in product listing page?

[Harry]

Hi,

Thank you for purchase.

We will release the update have this option on tomorrow. (You can enable in Claue > Theme Option > WooCommerce > Product Listing > Enable Add To cart > On)

Best regards

Harry
Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio

[kapil7]

Thanks for the update.

[kapil7]

Any updates..?

[Harry]

Hi we release update yesterday. Please update to latest version to have this feature

Best regards

Harry
Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio

[kapil7]

This reply has been marked as private.

[Harry]

Hi,

You can follow our topic for update theme.

and the changelog included in latest package you download from ThemeForest

==v1.2.0== 08/07/2017
* Fix – Optimize Ajax Add To cart function in product detail
* Fix – Fix bug websafe font loader
* Fix – Fix issue add link to slider doesn’t work
* Fix – Fix product listing responsive
* Fix – Fix bug sale badge for product variable
* Fix – Fix error mesage when enable product attribute on up-sells, cross-sells product
* Fix – Fix single blog post layout without sidebar
* Tweak – Add option to enable add to cart button on product listing
* Tweak – Add option to disable quick shop button
* Tweak – SImprove style for WC Vendors
* Tweak – Improve Apple Pay style
* Tweak – Update ClaueAddon to 1.0.7
* Tweak – Add options to control display of icons on header
* Tweak – Add option to choose the Instagram image size
* Tweak – Add option to add extra content below add to cart button on product detail page, mini cart, shopping cart, checkout page

Best regards

Harry
Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio

[kapil7]

This reply has been marked as private.

[kapil7]

This reply has been marked as private.

[kapil7]

Please help

[Harry]

Hi,

You can add custom css in Claue > Theme Option > General Layout > Custom CSS

.product-btn {
left: auto;
right: 5%;
top: auto;
transform: translate(0px, 0px);
}

.product-image:hover .product-btn {
bottom: 5%;
}

Best regards

Harry
Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio

[kapil7]

This reply has been marked as private.

[Foster]

Hi,

Our theme does not support the icon for those positions but I can custom for you. Would you mind provide me the icon you want to use? and also give me your website URL and a temporary admin account.

Thank you

[kapil7]

This reply has been marked as private.

[kapil7]

This reply has been marked as private.

[Harry]

Hi,

you can add below code in Claue > Theme Option > General Layout > Custom CSS

Best regards

Harry
Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio

[kapil7]

This reply has been marked as private.

[kapil7]

This reply has been marked as private.

[Harry]

Thank you for your rating.

You can change prev code to

Have a great day!

Harry
Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio

[kapil7]

This reply has been marked as private.

[Harry]

You also remove these code use the last one.

Best regards

Harry
Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio

[kapil7]

This reply has been marked as private.

[kapil7]

How to put add to cart action/effect like http://atelier.swiftideas.com ?

[kapil7]

This reply has been marked as private.

[kapil7]

This reply has been marked as private.

[Foster]

Hi,

I’m sorry, our theme does not support this function, you can hire Freelancer to do this task.

Hope you understand our situation.

Best regards,

Foster

[kapil7]

This reply has been marked as private.

[Foster]

Hi,
Please provide me a temporary admin account, I will do it for you.

[kapil7]

This reply has been marked as private.

[Foster]

Hi,
I see you did it by yourself?

[kapil7]

This reply has been marked as private.

[Harry]

I saw you override code of product listing page.

You can add below code under the code of image thumbnail

We recommend do override on child theme.

Best regards

Harry
Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio

[kapil7]

With this code, desktop view is proper but there is problem in mobile view.

[kapil7]

This reply has been marked as private.

[kapil7]

This reply has been marked as private.

[Harry]

Hi,

1. You can add custom css in Claue> Theme Option > General Layout > Custom CSS

@media only screen and (max-width: 736px) {
.btn-quickview { text-indent: 0; font-size: 14px !important;}
}

2. Sorry the add to cart effect need more change. We are so busy can’t help you do it. You can hire some freelancer to help you do it https://studio.envato.com/

Best regards

Harry
Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio

[kapil7]

Ok Thanks for the help. But still there is icon beside wishlist icon.

[kapil7]

This reply has been marked as private.

[kapil7]

This reply has been marked as private.

[Harry]

Hi,

1. You can change prev code to

@media only screen and (max-width: 736px) {
.btn-quickview { text-indent: 0; font-size: 14px !important;}
.btn-quickview::after {display: none;}
}

2. The space because your original image have more white space around http://www.unityinfoway.net/techa/wp-content/uploads/2017/07/organic-darjeeling-oolong-570×760.jpg

3. The issue because you set the height of slider row is full height On our demo it is an background image set as cover. The slider is responsive can’t set as cover height.

You can fix by follow this screen shot https://monosnap.com/file/txtMCzieGqSJaehmwlDUgGfViDhiSD#

Best regards

Harry
Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio

[kapil7]

1. Done
2. If we remove that white space from image, will it look good?
3. So what should we have to do to achieve same UI as in demo?

[kapil7]

In 3rd step we have unchecked Full height row as https://monosnap.com/file/txtMCzieGqSJaehmwlDUgGfViDhiSD#

but still same issue.

[Harry]

2. Yes, when you remove white space around the image you product listing will be better.

3. I checked your site it now better, it doesn’t have more white space on mobile, please clear cache and check again.

Harry
Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio

[kapil7]

This reply has been marked as private.

[Harry]

Hi,

I’m not sure because our theme and these plugins override default WooCommerce.

You can disable Ajax Add To Cart integrate with our theme in WooCommerce > Settings > Products > Display > Add to cart behaviour > And uncheck all

Best regards

Harry
Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio

[kapil7]

This reply has been marked as private.

[Harry]

Could you send us admin account as private reply, we need more close look before give you suggest.

Thanks

Harry
Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio

[kapil7]

How to hide Add To Cart icon button (beside Wishlist icon) from Menu bar?

[kapil7]

This reply has been marked as private.

[Harry]

Hi,

You can hide cart icon on menu bar by add custom css in Claue > theme options > general layout > custom CSS

.jas-icon-cart { display: none;}

Best regards

Harry
Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio

[Author]

Posts