Unlock the full potential of your Shopify store by displaying variants as beautiful color/custom image swatches to enhance your shopper's experience. Let's dive in to learn how to do the same.
Step 1: Access Variant Options Configuration Settings
On the Swatch King dashboard, locate the side navigation bar.
Click on the Shopify Variants
Step 2: Select Display Style & Swatch Image Source
Find the product option you wish to enhance from your store's list of available product options, e.g., Color.
Under
Product page style or Collection page style, choose your preferred swatch display style for variants on the product page or collections page, such asCircular swatch.For Deeper Customization: Explore the Styles
Below style dropdown, there's another dropdown for image source settings. Select
Color/Custom image.
Step 3: Upload Color/Custom swatches
Click on the
Uploadbutton icon which appears when you select color/custom image. Have a look:
A pop-up screen will show up with a list of option values, each accompanied by options for uploading your custom/color swatch.
You must select one of the three upload methods from this list: Add color, Add file, or Add from URL.
Add color: To upload using a Hex code, enter the desired color's Hex code, say
#FFFFFF, into the provided field or select the from the color pallet.Add file: For uploading an image, follow these guidelines:
Ensure the image file is in either PNG, JPG, or JPEG format.
Ensure that the file size does not exceed 512KB.
Click on the upward-pointing arrow symbol next to 'Upload a file,' then select the image file from your device.
Add from URL: For URL-based uploads, adhere to the following guidelines:
The URL should be publicly accessible.
Enter the URL of the color/custom swatch in the designated field.
After entering the color, uploading an image via computer, or adding a URL, click the
Updatebutton.
Conclusion:
You have successfully uploaded custom color swatches to enhance your product variants, creating a visually appealing shopping experience for your customers. You can go ahead and visit your storefront to see the results.
Note: If you still need help with swatches not showing up, contact our support through chat; they will troubleshoot the app instantly.