Adding Form Code to Your Shopify Website HTML

Adding Form Code to Your Shopify Website HTML


Adding Form Code to Your Shopify Website HTML

For store owners who know almost nothing about coding

I'll show you how to insert form code into the HTML code of your Shopify store.


Opening the theme editor

  1. Log in to your Shopify store. 
  2. Go to the admin dashboard. In the left-hand menu, click Online Store.
  3. Select Themes.
  4. Find the Actions drop-down for the current theme and select Edit Code. The code editor opens.

open editor on Shopify store

In the code editor, locate the file where you want to insert the form code. This is often the theme.liquid file (depending on the theme).

locate the theme.liquid file

Highlight and copy the code and then save a backup before making changes. Copy the code in the editor and paste it into a text document.

In the code editor, find the appropriate place to insert your form code. This is typically between the <body></body> tags.

place code between the body tags



Inserting your form code

This code is usually provided by your email marketing service or form provider. It includes HTML and possibly JavaScript code.

For example:

edit Shopify code

After inserting the code, save your changes in the code editor.

  1. Go back to the Shopify admin dashboard.
  2. Under Online Store, select Themes.
  3. Click Customize to preview your store. Make sure the form appears as intended.
  4. Submit a test through the form to confirm it works properly.
  5. If everything looks good, go back to the code editor and click Save. The form is now live on your Shopify site.

Enhance your Shopify site seamlessly! Elevate engagement with a stylish form—code it in, test it out, and let your audience connect effortlessly. Your website, your rules, your success! 🚀 #tinyEmailMagic #ShopifyMagic.


    • Related Articles

    • Customize and Install a Form

      Customize and Install a Form Go live and start list buidling Recently, I've been talking a lot about tinyEmail tools that can help you build a list. In three different articles, I showed you how to start building a form (Embedded, Popup, and Flyout) ...
    • Use Form Templates

      Use Form Templates Save time with prebuilt forms Time saver alert! tinyEmail has a (growing) library of prebuilt forms you can use on your favorite websites. We've got oodles of options for embedded, popup, and flyout forms. They're all ready to use ...
    • How to Upload Your Own Code or Template

      How to Upload Your Own Code or Template Import a template or paste in code Just as tinyEmail gives you the world's most powerful and yet convenient Drag & Drop email editor, we also provide you with a flexible and unique custom code editor for your ...
    • Integrate Shopify with tinyEmail (Zapier Method)

      Integrate Shopify with tinyEmail (Zapier Method) Connect your Shopify store with tinyEmail using the Zapier method. It's possible to connect tinyEmail to your Shopify store using Zapier, but I have a better idea. Use our native Shopify app instead. ...
    • Why Choose tinyEmail for Your Shopify Store?

      Why Choose tinyEmail for Your Shopify Store? Its time-to-value ratio is unbeatable Looking for the best email marketing app for your Shopify store? With over a dozen options available, let's take a closer look at tinyEmail and how it stacks up ...