App Installation: Add to Shopify Store & Enable Theme Scripts
Welcome to Product Variant Options! First impressions are everything in e-commerce. By replacing standard dropdown menus with high-quality visual swatches, you are making it easier for your customers to browse, select, and buy your products.
This guide will walk you through the two-minute setup process to get the app running smoothly on your Shopify store.
Step 1: Install the App
The first step is adding the Kefi Swatches Options app to your Shopify environment.
Log in to your Shopify Admin dashboard.
Navigate to the Shopify App Store or use the search bar at the top of your admin page.
Type "Kefi Swatches Options" into the search bar.
Select the app from the results and click the Install button.
Review the app permissions and click Install App again to confirm.
Once installed, you will be redirected to the app dashboard where you can begin styling your variants.
Step 2: Enable the App Embed Script
For your new swatches to appear on your storefront, you must enable the app's script in your Shopify Theme Editor. This is a "no-code" process that ensures the app works perfectly with your theme's layout.
Open Theme Settings: From the app dashboard, look for the "Enable App Embed" button or the notification banner. Clicking this will automatically open your Shopify Theme Editor in a new window.
Toggle the Embed: In the left-hand sidebar under the App Embeds tab, find Kefi Swatches - Product Variant Options.
Switch to ON: Click the toggle switch so it appears blue (ON).
Save Changes: Click the Save button in the top-right corner of the theme editor.
Note: Your swatches will not be visible to customers until this step is completed and saved.
Step 3: Initial Sync & Activation
Once the script is enabled, return to the app dashboard. The app will automatically perform an initial scan of your product catalog:
Fetching Options: The app identifies every "Option Name" in your store (e.g., Color, Size, Material).
Default Styles: It will assign a default "Button" style to all options so you can see them live immediately.
Go Live: Ensure the App Status toggle inside the dashboard is set to Live.
Next Steps: Making it Your Own
Now that the app is installed and active, you can begin the creative work:
Assign Styles: Choose between Circular Swatches, Polaroid views, or Buttons.
Customize Colors: Map your specific brand HEX codes to your variant names.
Sync Collections: Enable swatches on your collection grid for faster browsing.
Need Help?
Our support team is dedicated to helping you build a beautiful storefront:
Live Chat: Available directly within the app dashboard.
Email Support: wecare@keficommerce.com