Skip to main content

Embed an Experience by Jebbit in Shopify

Updated this week

Integrate Experiences by Jebbit into your Shopify storefront to enhance customer engagement with interactive product recommendations and quizzes directly on your site. This guide outlines two methods for adding Experiences by Jebbit using the Onsite Embed app or the Custom Liquid block.


Before you begin

  • Ensure you have an experience built and ready to be embedded.

  • Confirm that your Shopify theme supports theme extensions. If not, the Custom Liquid method will be applicable.


Add an Experience by Jebbit via the Onsite Embed App

  1. Log into your Shopify admin.

  2. Navigate Online Store > Themes and click Customize on your current theme.

  3. In the theme editor, find the section where you want to add the experience.

  4. Click Add block, select Apps, and choose Jebbit Onsite Embed.

  5. In the settings panel, paste the Launch Link from the Experiences by Jebbit Launch page.

  6. For Lightbox or Companion experiences, copy the Global Code Snippet from Settings > Onsite Deployment settings and paste it into the theme extension

  7. Click Save to apply the changes.


Use a Custom Liquid Block

If your theme does not support theme extensions, follow these steps.

  1. Go to the Experience Library and select the desired experience.

  2. Click Launch, then choose Website > Embed On Site, and select Create Embed Code to generate the iframe snippet.

  3. Copy the generated embed code.

  4. In your Shopify admin, go to Online Store > Themes, and click Customize on your current theme.

  5. In the theme editor, click Add section and choose Custom Liquid.

  6. Paste the copied embed code into the Custom Liquid field.

  7. Click Save to add the experience to your storefront.

Note: Some steps in the Shopify platform may look slightly different than what we outline below. If you are unable to follow along, try checking out this resource from the Shopify help center.


Next steps

  • Test the experience on your storefront to ensure it functions as intended.


FAQ

Why isn’t my experience displaying correctly?

  • Ensure the embed code is correctly pasted and that the experience is published.

Did this answer your question?