How to Embed Knightlab Juxtapose JS on Shopify: The Easy Way

Want to show impressive before-and-after comparisons on your Shopify store? Knightlab Juxtapose JS is perfect for creating interactive image sliders that let customers compare two images by sliding left and right. Here’s how to add this engaging content to your Shopify store without any coding skills.

What is Knightlab Juxtapose JS?

Knightlab Juxtapose JS is a tool that creates interactive side-by-side image comparisons. It’s brilliant for:

• Product transformations (before/after)
• Showing colour variations
• Demonstrating product effects
• Highlighting renovations or makeovers

Step-by-Step Guide to Embedding Juxtapose JS on Shopify

Step 1: Install EmbedAny on your Shopify store

1. Visit EmbedAny in the Shopify App Store
2. Click “Add app” and follow the installation process
3. Activate the app on your store

Step 2: Create your Juxtapose comparison

1. Go to Juxtapose by Knight Lab
2. Upload your before and after images
3. Adjust settings as needed
4. Click “Publish” and copy the link to your comparison

Step 3: Add the comparison to your Shopify store

1. Go to the page or product where you want to add the comparison
2. Paste the Juxtapose link in the text editor
3. Italicise the link by selecting it and pressing the italic button (or using Ctrl+I)
4. Save your changes

That’s it! EmbedAny will automatically transform the italicised link into an interactive before-and-after comparison slider.

Where to Use Juxtapose Comparisons in Your Shop

• Product descriptions: Show how your product transforms or works
• Collection pages: Compare different product options
• Blog posts: Add visual interest to your content
• Custom pages: Create dedicated before-and-after galleries

Tips for Great Juxtapose Comparisons

• Use high-quality images with the same dimensions
• Ensure the images align properly for the best sliding effect
• Add a descriptive caption to explain what customers are seeing
• Choose images that clearly demonstrate the difference or transformation

Why This Works

When you italicise a link with EmbedAny installed, the app recognises the Juxtapose link and automatically converts it into an interactive element. Your customers can interact with the slider without leaving your store, creating a more engaging shopping experience.

Adding visual comparisons can help customers better understand your products and make more confident purchasing decisions, potentially boosting your conversion rates.

Now you can easily show off product transformations, colour options, or other visual comparisons that will make your Shopify store stand out!