Home Forums Themes Support Claue Image SWATCHES

Topic Resolution: Resolved

This topic contains 20 replies, has 2 voices, and was last updated by  bestfitbybrazil 6 months, 2 weeks ago.

Viewing 15 posts - 1 through 15 (of 21 total)
  • Author
    Posts
  • #28187

    The product page in Claue uses dropdowns for size and color.  How can I integrate images for “Color” instead of dropdown.  When ever I have more than one color for a product, i create a separate product for each additional color.  How can i make it so if someone clicks on a color swatch image, it jumps to the product detail page of the selected color product?  I tried “CleverSwatches – WooCommerce Color or Image Variation Swatches‎” and it was disabling the ability to put products in cart, plus it never worked.  I could not see images on product detail page.  Then I tried “WooSwatches – Woocommerce Color or Image Variation Swatches” and it didn’t change product detail page.  I can only see text, not image swatches.  I have not tried free version of Woocommerce Variation Swatches, but first wanted to see if you knew what i might be missing so that the template will allow images swatches on product detail page.

    This is what i want to be able to accomplish:

    Notice that this product detail page has 2 colors options swatches, and if you click one it takes you right to the other product detail page with that color.

    This how i want it to work…

    https://www.carbon38.com/product/velvet-puffer-rose/

    This is how my detail page looks now

    ALO Yoga Velvet Puffer (rosewood)

    #28189

    Hi,

    Please install plugin WooCommerce Variation Swatch from WP Addon integrated with our theme. And after that go to Products > Attributes > Color and change to color type to color

    http://janstudio.net/claue/document/#create-attributes

    Kind regards

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

    #28191

    ok i set this up on one product. https://bestfitbybrazil.com/product/alo-yoga-velvet-puffer-rosewood/

    but it does not select the color option image on mobile, so can’t put in cart.

    #28192

    also i want to make sure this is the right plugin.  https://getwooplugins.com/plugins/woocommerce-variation-swatches/?utm_source=wp-admin-plugins&utm_medium=style-tab&utm_campaign=woo-variation-swatches&utm_term=claue

    seems like to get more features like links i need to pay for this plugin ?

    #28193

    Hi,

    Could you give me your site admin account to check.

    I see you use more plugins they cause conflict style.

    Just use plugin WooCommerce Variation Swatch.

    Kind regards

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

    #28219

    I tried account you sent but can’t access. Please reply on this topic and check in “Set as private reply”

    Thanks

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

    #28226

    I help you install plugin Variation Swatch. Please follow our document at http://janstudio.net/claue/document/#create-attributes to setup your product.

    Kind regards

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

    #28228

    Ok that works.  But one thing does not.  How can i get the individual swatches to by size 60px and square, and how to make image swatches link to the product detail page for each individual color?

    this is where the original product is:

    ALO Yoga Velvet Puffer (rosewood)

    when i click the black color image of the coat i want it to go here and vice versa

    ALO Yoga Velvet Puffer (black)

    #28230

    Hi,

    Please add below code

    .is-color .swatch__value {
    	width: 60px;
    	height: 60px;
    	line-height: 60px;
    	border-radius: 0;
    }
    .is-color .swatch__list--item {
    	border-radius: 0;
    }

    Please upload gallery image for color on the right column. http://prntscr.com/m7bqxz

    This plugin only support change color and doesn’t support link to new page.

    Your support expired, could you please pay renew support at https://themeforest.net/item/claue-clean-minimal-woocommerce-theme/18929281

    Thanks

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

    #28255

    thanks that works.  so when i click on the image swatches, it changes the product photo to the other one full size on computer, but on mobile device it displays a thumbnail in the product area “smaller”.  How to fix this problem on mobile?

    #28256
    This reply has been marked as private.
    #28261

    Hi,

    The issue because plugin Magic Zoom Plus. so color gallery doesn’t work. I deactivate and it work now.

    Kind regards

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

    #28262

    when you mouse over the image it will zoom, please check on desktop.

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

    #28264

    Yes, the zoom function only on the image not pop out

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

    #28268

    Please reply on this topic.

    Thanks

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

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

You must be logged in to reply to this topic.