Guides / Platforms / Shopify

Install guide

Add a DreamWidget to Shopify

Where it goesCustom Liquid section
What you needWorks on every Shopify plan with an Online Store 2.0 theme.

First, copy your code. In the DreamWidget editor, open Settings and press Copy embed code. It is one iframe and a short script; paste both.

Add a widget to a page

  1. Customize your themeGo to Online Store, then Themes, and press Customize.
  2. Add a Custom Liquid sectionOpen the page template, press "Add section" and choose "Custom Liquid".
  3. Paste and savePaste your DreamWidget code into the Liquid code box and press Save.

A popup, bar or chat buttons on every page

Floating widgets do not need a spot in the layout; they load once per page and float over it.

  1. Edit theme codeIn Online Store, Themes, open the three-dot menu and choose "Edit code".
  2. Paste before the closing body tagOpen layout/theme.liquid, paste the code just above </body> and save.
Worth knowing: Older themes without sections: add the code to a page with the </> "Show HTML" button in the rich text editor.

Check it worked

Open the published page in a private window. The widget draws within a second; if the box is empty, see Checking it worked. Changes you publish in the editor appear on Shopify by themselves; you never paste the code again.

Other platforms