Install Yaplet on a Shopify store

Shopify lets you edit your theme's code directly, so you can add Yaplet to every page by inserting the embed script into your theme's main layout file. No app installation is required — just a copy-and-paste into the theme editor.

1. Get your embed code

Log in to your Yaplet dashboard, click Widgets in the sidebar, click your widget, then click the Embed button in the top-right. Copy the full embed script from the modal. Your Widget ID is already filled in.

If you haven't set up a widget yet, start with Install Yaplet with the JavaScript snippet to understand what the code does.

2. Open the theme code editor

In your Shopify admin, go to Online Store → Themes. Find your active theme, click the three-dot menu (…) next to it, and choose Edit code.

3. Open theme.liquid

In the code editor's left sidebar, open the Layout folder and click theme.liquid. This is the master template that wraps every page on your store.

4. Paste the embed script

Scroll to the bottom of theme.liquid and find the closing </body> tag. Paste your Yaplet embed code just above that tag, then click Save.

5. Verify the widget appears

Open your Shopify store in a new browser tab and reload any page. You should see the Yaplet launcher button in the bottom-right corner. Click it to confirm the widget opens.

For a more thorough check, see Verify your installation.

Troubleshooting

• Widget doesn't appear after saving — Shopify caches pages aggressively. Open your store in an incognito window, or append ?nocache=1 to the URL to bypass caching.
• Script is inside a comment block — Check that the code isn't inside a {%- comment -%} block or after the closing </body> tag.
• Multiple layout files — Some themes use additional layout files (e.g. customers/account.liquid). Add the snippet there too if you want the widget on account pages.
• Content Security Policy errors — If your browser console shows CSP errors, you may need to whitelist yaplet.com and embed.yaplet.com in your store's CSP configuration.

Identify logged-in customers

If your store has customer accounts, you can pass Shopify customer data to Yaplet so your team sees real names instead of "Visitor 1234". Add an identify call inside a Liquid conditional:

{% if customer %}
<script>
  Yaplet.identify("{{ customer.id }}", {
    name: "{{ customer.name }}",
    email: "{{ customer.email }}",
  });
</script>
{% endif %}

Place this block directly after the main Yaplet embed script, still before </body>.