Dashboard

Embedding in Shopify

Add FavForm to your Shopify store using theme customization or the Online Store editor.

Using the Theme Editor (easiest)

1

Open the Theme Editor

Go to Online Store → Themes → Customize.

2

Add a Custom Liquid section

Click "Add section" and select "Custom Liquid" (or "Custom HTML" depending on your theme).

3

Paste the embed code

In the Custom Liquid field, paste:

HTML
<div style="max-width: 700px; margin: 0 auto; padding: 20px;">
  <fav-form data-embedId="your-form-id"></fav-form>
</div>
<script src="https://favform.com/embed/v1.js" async></script>
4

Save

Click Save. The form will appear on your page.

Adding to a specific page

To add a form to a specific page (like Contact):

  1. Go to Online Store → Pages
  2. Edit the page (or create a new one)
  3. Click the HTML button <> in the editor toolbar
  4. Paste your embed code
  5. Save the page
Some themes may strip the script tag. If the form doesn't appear, use the theme.liquid method below.

Site-wide widgets

Add a feedback widget to every page by editing your theme:

  1. Go to Online Store → Themes
  2. Click Actions → Edit code
  3. Open Layout → theme.liquid
  4. Find the closing </body> tag
  5. Paste the widget code just before it
  6. Save
HTML
<fav-form data-embedId="your-widget-id"></fav-form>
<script src="https://favform.com/embed/v1.js" async></script>

Product page forms

Add a form to all product pages (e.g., for custom orders):

  1. Go to Online Store → Themes → Edit code
  2. Open Sections → main-product.liquid (or similar)
  3. Find where you want the form to appear
  4. Add the embed code
Editing theme files directly can break your store. Consider duplicating your theme first as a backup.

Using iframe

If the script method doesn't work, use an iframe:

HTML
<iframe 
  src="https://favform.com/f/your-form-id" 
  width="100%" 
  height="700" 
  frameborder="0" 
  style="border: none; max-width: 700px; display: block; margin: 0 auto;">
</iframe>

Common use cases

Contact form

Replace Shopify's default contact form with a customized FavForm

Custom order requests

Collect custom product requirements with file uploads

Wholesale inquiries

Gather business information for B2B customers

Product feedback

Add a feedback widget to collect reviews and suggestions

Pre-order forms

Collect interest and deposits for upcoming products

Troubleshooting

Form not appearing

Shopify's rich text editor may strip scripts. Use the HTML view or edit theme.liquid directly.

Script blocked by CSP

Some Shopify apps add strict Content Security Policies. Try the iframe method instead.

Form looks different than preview

Your theme's CSS may affect the form. Add the form inside a container with all: initial to reset styles.

Widget conflicts with chat apps

If you have a chat widget, position FavForm on the opposite corner (bottom-left vs bottom-right).

← BubbleReact / Next.js →