Copy the Harlo install code from Dashboard -> Widget.
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
Placement
Footer / Body end
Scope
All pages or selected high-intent pages
Publish
Save changes, publish, then test live
<script src="https://www.harloai.co/widget.js" data-harlo-organization="YOUR_ORGANIZATION_ID" async></script>Before you start
Get the install ready
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
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.
Open Edit code
Open the theme menu again and choose Edit code.
Open theme.liquid
In the Layout folder, open theme.liquid. This file controls the main storefront page layout.
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.
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
Open the storefront homepage and a product or service page.
Confirm the launcher appears and does not cover key purchase controls.
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.