Back to widget install

Theme code install

Install Harlo on Shopify

Place Harlo in your Shopify theme so it appears on the customer-facing storefront.

Shopify

Custom code area

Ready

Placement

Footer / Body end

Scope

All pages or selected high-intent pages

Publish

Save changes, publish, then test live

Harlo snippet
<script src="https://www.harloai.co/widget.js" data-harlo-organization="YOUR_ORGANIZATION_ID" async></script>

Before you start

Get the install ready

You do not need to write code for this install. Copy the Harlo snippet from your dashboard, paste it exactly where the guide says, then publish your site.

Copy the Harlo install code from Dashboard -> Widget.

Duplicate the live theme before editing, so you have a backup.

Confirm you can edit the active theme's code. Some paid trial themes restrict code changes until purchased.

Step by step

Add Harlo in Shopify

1

Duplicate the current theme

In Shopify admin, go to Online Store, then Themes. Open the menu for the live theme and duplicate it so you have a backup copy.

2

Open Edit code

Open the theme menu again and choose Edit code.

3

Open theme.liquid

In the Layout folder, open theme.liquid. This file controls the main storefront page layout.

4

Paste above the closing body tag

Find the closing body tag near the bottom of the file and paste the full Harlo code directly above it.

Do not paste Harlo inside another script tag.
Do not put the snippet inside a product, section, or cart template unless Harlo should only load there.
Keep the duplicate theme until you have confirmed the widget works.
5

Save, preview, then publish

Save the file, preview the theme, and publish the edited theme only after the chat button works correctly.

Verification

Confirm the widget is live

1

Open the storefront homepage and a product or service page.

2

Confirm the launcher appears and does not cover key purchase controls.

3

Ask a question and confirm Harlo records the conversation.

Troubleshooting

Fix the usual issues

Edit code is unavailable

Confirm the theme is editable and not a paid trial theme that must be purchased before code changes.

The widget appears in preview but not live

Publish the edited theme or repeat the install on the active theme after testing.

Theme updates remove Harlo

Reapply the snippet after major theme updates, or ask support about a theme-app style install path.