You can collect your customers' contact information by allowing them to sign up with their email to your lists automatically. This is useful for scenarios like newsletters, deals, keeping them updated on your business.


There are two ways in which you can accomplish embedding a form into your website:

  1. You can directly add the form code into your website (Embedded Form Approach)
  2. Embed the form using an iframe. (Embed form through iframe Approach)


The first option gives you more customization flexibility but requires that you have access to your website's code. The second option gives you less customization but allows you to use iframes to embed a form (less technical knowledge required).


You can go with either of these options and switch from one to the other as you desire.


Embedded Form Approach


Step 1: Locate the list you wish to use

  • Open up your Studiorific Campaign Dashboard
  • Click on "Lists" from the top navigation menu
  • From the list of Lists, click on the list you wish to add subscribers to via the embedded form.
  • Click on the Embedded Form option from the Forms / Pages menu, as shown in Screenshot #1 below.

    Screenshot #1: "Embedded form" option




Step 2: Customize the embedded form

  • The embedded form page allows you to customize the settings of your sign up form.
  • To change the title, update the "Form title" input field
  • To customize the CSS of the form, use the "Custom CSS" box on the right side, shown below, to accomplish that.
  • As you customize the form, the changes you make will live update in the "Preview" section on the bottom right.

    Screenshot #2: Embedded form customization screen


Step 3: Copy and paste the form code into your site

  • Copy the entire code within the "Copy/paste onto your site" section. You do not need to copy anything else besides this code.
  • Paste this code into the location of your website where you would like to present it to your customers.


Step 4: Verify that it works

  • Verify that your website has embedded this sign up form correctly by going to the page on your website where you added this form and submit a test customer (you can delete this test customer later on from the Subscribers list).
  • If all is good, the submitted subscriber will immediately appear inside your list, under the Subscribers area.




Embed form through iframe Approach

The iframe approach allows you to embed a form that we host on our website on your behalf into your website through iframes. In order to do that, follow the steps shown below:

Step 1: Locate the list you wish to use

  • Open up your Studiorific Campaign Dashboard
  • Click on "Lists" from the top navigation menu
  • From the list of Lists, click on the list you wish to add subscribers to via the embedded form.
  • Click on the Sign-up form option from the Forms / Pages menu, as shown in Screenshot #3 below.

    Screenshot #3: Hosted sign-up form option



Step 2: Embed the form into your website through an iframe

  • The link highlighted in Screenshot #4 below shows the URL for the hosted sign up form associated with this list.

    Screenshot #4: URL of hosted sign-up form

  • Copy this link and embed it using an iframe on your website.
  • In screenshot #5 below, I embedded the sign up form into a blank page on my website.

    Screenshot #5: Hosted sign-up form embedded within iframe



Step 3: Verify that it works

  • Verify that your website has embedded this sign up form correctly by going to the page on your website where you added this iframe and submit a test customer (you can delete this test customer later on from the Subscribers list).
  • If all is good, the submitted subscriber will immediately appear inside your list, under the Subscribers area.


That's all you need to do in order to embed forms into your website.