Help

How to install the App

To install the App, you simply need to go to https://apps.shopify.com/product-colors, and click on the Add App button. Accept the app permissions as well as the monthly charge to complete the installation. You then need to click on the Activate App Embed button to turn on the app on your theme. The app should work fine and requires no coding. (If you have issues, please contact us and we'll solve the problem for you)
No programming or coding skills are necessary to install or to use the App.

Make sure to click on the save button in your theme customizer after you activate the app embed.

Demonstration

You can find a demonstration store showing how this app can be used: https://product-colors.myshopify.com/products/red-bagpack

Frequently Asked Questions

How to use the App?

Open the app and click on the green plus button under the Product Group heading. Use the search tool to add products to the group. Assign a swatch for each product in the group. You can create single color, two colors or even pattern/image swatches. The App was made to be very simple to use but still have a lot of advanced features. The way the app works is that you have to link your products of different colors by creating product groups. If you sell a backpack in different colors, you'll have to link the different "products" under the same product group.

Once you'll hit save, the swatches will appear on the selected products!

For further customization, you can go to the settings tab and select a swatch style as well as some other options that affect the tooltip, swatch size...

Here is a demo of how the app works:

My swatches are not updating.

Modifications made through the app take a dozen minutes before they propagate to the live store.

I want to use variants for the colors / I can only add one color to the product group

The Product Colors app works if your colors are setup as separate products (one different product page for each color). The app links those products through swatches when you create product groups.
If you want to uses variants for your colors, you should instead use this other app:
Swatches

I would like to change the styling of the label

To change the styling of the label, you need to add CSS code to your theme's stylesheet in the assets folder (the file is usually called styles.scss.liquid). The CSS code that you need to add should look something like:
.webyzeProductColorsLabel { font-weight: normal !important; }

The color swatches are not showing at the right location

The app automatically detects where is the product form and adds the product colors there. If you want to manually add the product colors at a specific location in your product page form, you need to open your theme customizer and in the Product Template, you need to add an app-block "Product Colors" at the location where you want the swatches to show up, usually right above the variant picker block.

Alternatively, you can also add this line of code at that specific location: where you want the swatches to show up:

The swatches are leading to 404 pages

If you product is no longer available (out of stock) or has been deleted, you must also manually remove the color from the product group it belongs to since the product's URL is invalid.
If you the URL of the product has changed, you simply need to open the product group it belongs to and click on the Save button. This will force our app to update the product url to the new one.

I have two color fields now

The Product Colors app adds a color field to your product pages. If you have a Color option as well in your product, then you will end up with two fields. We recommend removing the color option from your product so that you only have one color field in your product page.
Remove an variant option from a product

I want swatches to display on collection pages

At this time, the Product Colors app doesn't support displaying swatches on collection pages since it requires implementing custom coding to your theme. We offer an installation service (for most themes) where we integrate the swatches on collection pages (under the product images) for a $120 one-time fee. If you are interested in this, you can contact us at: contactuser@domainwebyze.extcom
Make sure to specify that you are refering to the Product Colors app and provide details such as a URL of a product page that already uses the Product Colorss app.

Feedback & Support

Feel free to leave a review for our App on the Shopify App Store. You can give us feedback and contact us at: contactuser@domainwebyze.extcom