How to Install the Signup Form on Shopify

Installing the Prefinery JavaScript Snippet

1

Login to your Shopify admin dashboard and in the Sales Channels section navigate to Online Store >  Themes

2

Under your Current theme, click on Actions and in the dropdown select Edit code to go to the Theme Code Editor. 

See the Editing Theme Code guide by Shopify for complete details. 

3

In your Prefinery project dashboard, navigate to Installation then copy the JavaScript Snippet. 

4

Back in the Shopify theme code editor you have the directory of theme files on the left, and a space to view and edit the files on the right. 

In the  Layout directory find and open the theme.liquid file. Scroll down the file until you see the closing </head> tag (or use your browser's find functionality) and right above that add a new line to paste in your Prefinery JavaScript Snippet. Save your changes when done. 

Embedding the Signup Form on a Page

Now that you've installed the JavaScript Snippet, the next step is to display the signup form where you want it to. Here's how: 

1

In the  Sales Channels section of your Shopify admin dashboard navigate to Online Store > Pages. You can either add a new page or edit an existing one where you'd like to embed your signup form. This will bring you to the Shopify Page Editor. 

2

In the Installation page of your Prefinery project dashboard, copy the Embedded Form code. 

3

Back in your Shopify page editor, click on the <> Show HTML button then in the Content add a new line to paste in your embed code. 

That's it! When you view the page on the frontend, you'll find that your Prefinery form is now embedded on your Shopify store page. 

Embedding the Prefinery Signup Form on the Password Page

Shopify allows you to restrict customer access to your online store by enabling the password page. This can be useful as a landing page while you're still setting up your store before launch, or if you simply just want to gate access to the store, only allowing those who are exclusively invited. 

Shopify by default places a newsletter or email collection form on this page which you can replace with a Prefinery-powered signup form to better suit your intended user experience. Here's an example: 

  • A visitor lands on your store and see the password page with the Prefinery signup form. 
  • They fill out the form, submit it, and are shown the referral page telling them to refer friends in order to get access to the store. 
  • Once the user hits your minimum number of referrals to gain access to the store, you can invite them which triggers the invitation email that contains the password to your store. 
  • Additionally, if you also want to automatically add each user that applies through your Prefinery form as a new customer to your Shopify store, you can use Zapier to setup that integration. 

Here's how you can embed the Prefinery signup form on your password page: 

1

Login to your Shopify admin dashboard and in the Sales Channels section navigate to Online Store >  Themes

2

Under your Current theme, click on Actions and in the dropdown select Edit code to go to the Theme Code Editor. 

See the Editing Theme Code guide by Shopify for complete details. 

3

In your Prefinery project dashboard, navigate to Installation then copy the JavaScript Snippet. 

4

Back in the Shopify theme code editor you have the directory of theme files on the left, and a space to view and edit the files on the right. 

In the Layout directory find and open the password.liquid file to edit it. Scroll down the file until you see the closing </head> tag (or use your browser's find functionality) and right above that add a new line to paste in your Prefinery JavaScript Snippet. 

Save your changes when done. 

5

In the Installation page of your Prefinery project dashboard, copy the Embedded Form code. 

6

Back in your Shopify theme code editor, open the  Sections directory and select password-content.liquid. Find the default newsletter form's opening tag {% form ... } and right above that insert a new line to paste in your copied embed code. 

At this point after saving your changes your Password Page will display both Shopify's and Prefinery's forms. To disable Shopify's by commenting out the whole form code, right before the form's opening {% form ... } tag insert an opening {% comment %} tag. 

Scroll further down the file and and right after the form's ending {% endform %} tag insert the closing {% endcomment %} tag. Save your changes when done. 

That's about it. Below is an example of a simple Prefinery signup form embedded on a Shopify Password page.

Delivering discount codes to users as referral reward

With Prefinery, you can run a referral campaign for your Shopify store where you reward users with a unique, one-time-use discount code for referring others. Here's how you can set that up: 

1

Create your discount codes in Shopify following their guide here or use one of the many Shopify apps that allow you to generate discount codes in bulk. 

2

Following our guide on delivering dynamic codes from an uploaded list to setup the referral campaign at Prefinery's end. 

Still need help? How can we help? How can we help?