Home Forums Themes Support Claue Quick Shop and Select Options Buttons Remove or Rename

This topic contains 16 replies, has 2 voices, and was last updated by  Sgmonster 1 month ago.

Viewing 15 posts - 1 through 15 (of 17 total)
  • Author
    Posts
  • #34926
    Sgmonster
    Support Expired

    Hello:

    I think the Quick Shop button and the Select Options button are confusing and annoying.

    1. They cover up the entire hover image.  How can we fix this? Maybe the opacity needs to be changed.  Or we don’t need the buttons.  There should be an eyeball image for Quick Shop.
    2.   Quick Shop should be renamed Quick View.   I don’t think Quick Shop is easily understood and confusing.
    3.  ‘Select Options’ is also confusing.  It should be “Buy Now” don’t you think?

    I believe these are very important changes that need to be made.  This is probably what it should look like: https://shoes.oceanwp.org/

    thank you,

    Tom

    #34927

    Hi Tom,

    1. If you want hide button, please go to Claue > Theme Option > WooCommerce > Product Listing Setting to Turn Off button

    2. If you want change text, please install Loco Translate plugin http://support.janstudio.net/forums/topic/theme-translation/ and change text in Loco > Themes > Claue > create new language English-US > find the string “Quick Shop”

    If your product is simple product it show the text “Add to cart” and if your product is variable product it will show the text “Select Option”. And if you want change text please go to Loco > Plugin > WooCommerce > Create new language > English-US find string to change.

    Kind regards

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

    #34928
    Sgmonster
    Support Expired

    Thank you Harry.

    The format on this sample site seems to be the latest way to have quick view and Add to cart.  https://shoes.oceanwp.org/
    Do you think this will ever be changed to this format?   It is a lot cleaner look.

     

    #34929

    Hi,

    I think Add To Cart button is clear for user but quickview not clear, the user don’t know what button mean.

    Kind regards

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

    #34968
    Sgmonster
    Support Expired

    test

    #34969
    Sgmonster
    Support Expired

    Hello Harry:

    Thanks.  Removing the “Select Options” is a good option, but doesn’t solve everything.

    1.  The “Quick Shop” is too big and covers most of the hover product image.
    2. There are two methods to display the “quick Shop” button so that it does not cover the hover image:
      1. Create the button at the bottom of the product image.  See: https://www.express.com/mens-clothing/shirts/cat410008   or https://www.sunglasswarehouse.com/mens-aviator-sunglasses.html
      2. Use an ‘eyeball’ icon.  This is quite common now: https://shoes.oceanwp.org/

        So, is it possible to change how you display the “Quick Shop” button.

    3.  One thing that is not good about the quick shop button is the fact that videos do not show up in the Quick Shop window.

    Also, is there  a way to remove the the ‘variations’ text on the bottom of the product image?  See attached image.

    Thank you.  I look forward to your reply

    Tom

    Attachments:
    You must be logged in to view attached files.
    #34971

    Hi Sgmonter,

    2. Please add below code to Claue > Theme Option > General Layout > Custom CSS to change quick shop button to eye icon

    .quickview-button {top: 30px; left: 10px;}
    .quickview-button a i {font-size: 24px; color: #878787;}
    .quickview-button a:hover {background: none;}
    .product-image .yith-wcwl-add-button a {
    	opacity: 1;
    	visibility: visible;
    	color: #878787;
    }
    .product-btn .btn-quickview {
    	display: none;
    }
    .btn-quickview  {
    	background: none;
    	margin: 0;
    	padding: 0;
    }

    and download attach file, extract and put in claue-child > woocommerce

    3. Please go to Claue > Theme Option > WooCommerce > Product Listing Settings > Enable Products Attribute On Product List and uncheck all variations.

    Kind regards

    Attachments:
    You must be logged in to view attached files.

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

    #34985
    Sgmonster
    Support Expired

    Hello: we followed the instructions, and unfortunately, the eye ball is not showing up. Is it possible to change the Quick Shop (which we will rename Quick View) button to the bottom of the product image? This is also a very clean way to display the button, and easier to click for customer. See example: https://www.express.com/mens-clothing/shirts/cat410008

    #34989

    Hi,

    Did you activate child theme? Could you please send me login credentials and check in “Set as private reply” to check.

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

    #34992
    Sgmonster
    Support Expired
    This reply has been marked as private.
    #34993
    Sgmonster
    Support Expired

    So, are you able to put the Quick View at the bottom of the product image as a rectangle instead?  I noticed this on the Gecko, but its Quick Shop which is a bit different.

    I also noticed these features on Gecko that I like.  Can these be added to Claue?
    – timers
    – Who bought recently pop in at bottom
    – badges on checkout.
    -% to free shipping
    – # of visitors on site

    thanks,

    Tom

    #34994

    Hi Tom,

    I see the version of theme on your site outdated. Please follow this topic to update theme http://support.janstudio.net/forums/topic/updating-the-theme/

    1. Please download new attach file and put in claue-child > woocommerce

    And add new code to Claue > Theme Option > General Layout > Custom CSS not use old code

    .quickview-button {bottom: -10px; left: 0; width: 100%; opacity: 0; visibility: hidden; transition: all 0.1s;}
    .product-image:hover .quickview-button {bottom: 0; opacity: 1; visibility: visible;}
    .quickview-button a { background: #f2f2f2; transition: all 0.3s}
    .product-btn .btn-quickview {
    	display: none;
    }
    .btn-quickview  {
    	margin: 0;
    	padding: 0;
    }

    2. The features you said in Shopify version not on WooCommerce.

    Kind regards

    Attachments:
    You must be logged in to view attached files.

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

    #34996
    Sgmonster
    Support Expired

    Hi, I followed the instruction,

    activated claue child

    Put the contents into woocommerce (am i doing this correctly ?)

    and paste the code you gave me but it still does not apply properly.

    The child theme is 1.00 and claue is 1.6.3 (current version?)

    do I need to update the child theme also ?

    #34997

    Hi,

    You don’t need to update child theme. I clear cache on your site and it now working https://prnt.sc/qoufri

    Kind regards

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

    #35008
    Sgmonster
    Support Expired

    Hi Harry,

    I see the button but when you click on it, it would almost always going to the product page. I rarely get the small popup like quick shop supposed to be. I tried to purge the cache again and delete cache on my browser too. Could you take a look again ?

    Thank you.

Viewing 15 posts - 1 through 15 (of 17 total)

You must be logged in to reply to this topic.