This documentation is for the latest versions of Streamline that support Online Store 2.0 features. If you're on a version before 4.0.0 view the documentation here.
You can add color swatches to your product and collection pages using these settings found in Theme settings > Product Tiles
You can enable color swatches for filtering on collection pages using the settings found in the Collection template > Collection filter > Enable color swatches
How does it work?
Once you have enabled the color swatch settings, Streamline will look for any variant category with the name "Color" or "Colour".
To change the word to something other than "Color/Colour" you can do so in your languages area under Products > General > Color swatch trigger.
Note: If you're using a theme trial in your online store, Shopify restricts access to your language settings until a theme purchase has been made. For testing, we recommend using the default 'Color' variant name.
The theme will then look at the variant names you've used (in this case Heather grey and Green) and look for either an HTML color name with the exact same name or a .png image file in Settings > Files with a filename-friendly version of your variant name.
Naming your swatch files:
- Green swatches would need to be named green.png (capitals become lowercase)
- Heather grey swatches would need to be named heather-grey.png (capitals become lowercase, spaces and other special characters become hyphens)
Note: .jpg files will not be shown, you must use .png
How does it look?
Where is the 'Files' option in the Shopify admin?
First, open up the Shopify admin:
Go to Settings, then select the Files option and open it. Click Upload files to begin uploading your .png swatch files.