Text2MySite™

Shopify Integration

Add Text2MySite™ SMS alerts to your Shopify store

Setup time: 5-10 minutes

Embedding code on a Shopify store is a common practice, and Shopify provides excellent tools for it, particularly in its new "Online Store 2.0" themes. There are two primary methods for adding code to a Shopify site.

1
Using the "Custom Liquid" Section
Ideal for adding a widget to a specific page or section
Recommended for specific pages

This method is ideal for adding a widget or code snippet to a specific page or section (e.g., a product page, blog post, or the home page). This is the safest way to add on-page widgets as it doesn't require direct editing of your core theme files.

Step-by-Step Instructions:

  1. Access the Theme Customizer: From your Shopify Admin, go to Online Store → Themes. On your current theme, click the Customize button.
  2. Add a Section: Navigate to the page where you want to add the widget. On the left-hand sidebar, click Add section.
  3. Find "Custom Liquid": Scroll down the list of sections and select Custom Liquid.
  4. Paste Your Code: Click on the new "Custom Liquid" section in the sidebar. A code box will appear on the right. Paste your widget's HTML, CSS, or JavaScript code into this box.
  5. Save: Click the Save button in the top right corner. The widget should now appear on your page.
2
Editing Theme Code (For Site-Wide Scripts)
For adding scripts that need to load on every page of your store
For sitewide scripts

This method is for adding scripts that need to load on every page of your store, such as a tracking pixel, a live chat widget, or a sitewide pop-up.

Step-by-Step Instructions:

  1. Duplicate Your Theme: Before you begin, always create a backup of your theme. From your Shopify Admin, go to Online Store → Themes. Click Actions → Duplicate on your current theme. This is a crucial step to prevent any permanent damage to your live store.
  2. Access the Code Editor: On the duplicated theme, click Actions → Edit code.
  3. Find theme.liquid: In the left-hand file tree, navigate to the Layout folder and select theme.liquid. This file is the core template for your store, and code placed here will appear on every page.
  4. Paste Your Code:
    • Header Code: For tracking scripts or meta tags, paste the code just before the closing </head> tag.
    • Footer Code: For chat widgets or other scripts that don't need to load immediately, paste the code just before the closing </body> tag.
  5. Save: Click the Save button in the top right. Test the widget on your live site. Once you're sure it's working correctly, you can publish the duplicated theme to make it live for all customers.
YouTube Tutorial
Watch a step-by-step video guide for adding HTML code to Shopify

How to Add HTML Code to Shopify (2025) Step by Step Tutorial

Visual guide covering HTML code integration in Shopify stores

From the channel Tech Express • 3 minutes 37 seconds

Watch Tutorial