Quick view on image click, only for one page(+ other questions about quickview )

Hi, i’ve contacted you a couple days ago on envato for a particular request.

I would like to know how to activate the Quickview on image click (not only with the picto) but only for the home page (i want to keep my shop page as it is).

I also have a Z-index problem on homepage : the product description is going under the background of the next div (cf screencapture 1)

On the quickview of a product, the Visual composer shortcodes are not visual (only shortcode) any idea on how to fix this ? (cf screencapture 2)

On the quickview of a product , is it possible to hide the UGS information ? (i want to keep the category visible) – (cf screencapture 3)

Thanks for your help, find in the private content the website URL & Htpassword, let me know if you need back-end access

Attachments:

You must be logged in to view attached files.

edit : files too big, let me know if you need them :/

Hello,

Thank you so much for contacting our support center.

Try to add the following code snippet to the Custom JS on document ready area in Theme Settings

jQuery('.home .product-grid-item .product-image-link').click(function(e) {
	e.preventDefault();
	jQuery(this).parents('.product-grid-item').find('.open-quick-view').click();
});

WPBakery shortcodes are not supported in content loaded with AJAX. We suggest you not to use them for a short description.

As for the z-index problem, you need to edit the row that contains product and turn on “Disable overflow: hidden”.

Kind Regards

Hey, thanks for your quick reply !

“Disable overflow: hidden”. is working great !
Regarding the wuick view on image, it is working, but i was wondering if you can tell me how to add a “loading” animation to it ?

Regarding the WPbakery shortcode, it is a very sad news 🙁 HTML But HTML should work right ?

Thanks !

Loading animation is added to the button only, unfortunately, it is not possible to add it to the image in that situation.

HTML will work in the quick shop.

Hello Thanks for your reply.

One question in my first post hasn’t been answered :

On the quickview of a product , is it possible to hide the UGS information ? (i want to keep the category visible)

And an another question, what CSS class should i target (in the custom typography), to change The typography of the title & content of tabs in the product page ? (cf capture)

Thanks again for your work & your help, you are definitely among the best support team on envato !

Attachments:

You must be logged in to view attached files.

Hello,

Please add this code to the Theme Settings > Custom CSS > Global:

body .product-quick-view .woodmart-scroll-content .product_meta .sku_wrapper{
display:none;
}

Class for the tab title: body .tabs-layout-tabs .tabs li a

Class for the tab content: body .woocommerce-Tabs-panel p

Best Regards

Hi thanks for everything, one last thing, would it be possible to have the quickview displayed when we click one the title off a product ? (in addition of the image , only for the home page)

Best,

Hello,

For now, there is no option. Quick view is called only on icon clicking.

Best Regards

Yes but thanks to the following codes custom JS of one of your coworkers :

jQuery('.home .product-grid-item .product-image-link').click(function(e) {
	e.preventDefault();
	jQuery(this).parents('.product-grid-item').find('.open-quick-view').click();
});

I now have the image that display the quickview on click and wanted to extand to the title of the product also :s

Hello,

Try to replace that code with this one

jQuery('.home .product-grid-item .product-image-link, .home .product-grid-item .product-title').click(function(e) {
	e.preventDefault();
	jQuery(this).parents('.product-grid-item').find('.open-quick-view').click();
});

Working like a charm !

Thanks for your great support !

Best,

Great, you are welcome.

[Author]

Posts