How to add an email signup form to your Facebook page

In the instructions below, we assume that you have a dotMailer account, a Facebook account, and a Facebook page.

Your Facebook page can be linked directly to your dotMailer address book  - so your fans can signup to your newsletter right from Facebook. Better still, you can customise the fields you show on the signup form.

There are two ways to do this:

Using our signup form to create a Facebook signup form

1. Create your signup form using signup form generator

Create an email signup form as you would any other website using our HTML signup form builder.

Test your form to make sure this writes data to the correct data fields and address books.

Add any styling and validation as appropriate.

2. Add an HTML app to your Facebook page

Add an HTML Facebook app to your page that will hold the dotSurvey iFrame. You can do a search for suitable apps on Facebook ; to build this example we used Static HTML plus to create the custom tab (dotMailer does not endorse any particular app; be sure to check out the developers and that you're happy to accept the required permissions before installing any apps).

  • Set the name of the custom tab to 'Newsletters' or 'Email signup' or similar
  • Set the icon of the custom tab to something appropriate (we used an envelope)

fb_page.png

3. Insert the sign up form into your HTML app

Paste into your HTML into the app.

Note that:

  • The redirect will not work, so your form will need to indicate to the user that the action is complete
  • You will need to change the page that the form posts to from http://dmtrk.net/signup.ashx to https://rX-t.trackedlink.net/signup.ashx (depending upon which region your account belongs to, rX will be r1, r2, etc.)

Don't forget to test the signup form once you're all done.

And here's one we made earlier.

newsletter_signup_example.png

Using the dotMailer Facebook app to create a signup form

1. Install Facebook app

Login to your Facebook account and visit the following URL: https://apps.facebook.com/dmcontactsignup/ (you may then also be asked to log in to dotMailer).

You will need to allow the app to manage your pages.

dotMailer_Contact_Signup_wants_permission.png

You will then be taken to the 'dotMailer Contact Signup' application profile page.  To add this to your Facebook account click on the ‘Go to App’ button.

2. Configure signup form

To configure the signup form you will be asked to choose:

  • Which page to add the signup form to
  • The address book contacts should be written to
  • What fields should be added to the signup form (in the example below, just name has been added)
  • What thank you message should be displayed - if you are using double opt-in on the address book, consider an appropriate message for that

signup_form_settings.png

Click the 'Add to my page button' and the signup form will be added to your page. A message will be shown next to the button to show that the changes have been saved.

fb_changes_saved.png

A tab will be added to your page called "Email signup" using the dotMailer logo - these can be changed by editing the Facebook page settings.

fb_page_with_dotMailer_fb_signup.png

Return to the app (https://apps.facebook.com/dmcontactsignup) at any time to edit the settings.

Have more questions? Submit a request

Comments

  • Avatar

    Steps 1-10 I don't have any problem with at all. I love those steps. As far as steps go, they are among the best.

    Step 11 though. Now that's not a good step. Clicking the 'dotmailer contact signup' app logo from the search box does precisely.... nothing. Can't get to step 12 (and I hear it's lovely there).

    Any thoughts?

  • Avatar

    Hi Richard,

    I'm glad you like our steps ;)

    I can see the problem you're having. It's unclear whether this is down to us or Facebook at the moment, but you can overcome the problem by entering the app URL (http://www.facebook.com/apps/application.php?id=168883523163212) manually at Step 10, then selecting ‘Add to My Page’ and continuing from there.

  • Avatar

    Hi Michael,

    I followed you step (and fix above) however I don't get the option to add it to my page.

  • Avatar

    Although it says 'Remove app' it still doesn't seem to have been added to my page.

  • Avatar
  • Avatar

    Great feature, just added it to my FB page.

    One little thing though... I'm not sure 'email signup' is the best name for the feature? If I was a user it would turn my mind to being bombarded with emails (not that I would ever do that of course!) if I was to fill it out?

    I'm not sure if there is a better name for it but perhaps something like 'info signup' or similar would be better?

  • Avatar

    Hi Louise,

    You can rename the 'email signup' tab by editing your page and selecting the 'Apps' link on the left hand side of the edit page. You should see a list of things associated with your page, one of which will be the dotMailer Contact Signup application. Under that is the 'Edit settings' link, click that and you should see a field allowing you to change the title. I've attached a screenshot with the link highlighted.

    Hope the helps!

  • Avatar

    We are using dotmailer through CTT, not sure if that is what has caused this strage thing to happen.  At step 3 I sign into my account and instead of a window asking me to give permission to continue, I get a screen dump of our CTT overview page and cannot continue.  I am very confused.

  • Avatar

    Hi Sharon,

    Thanks for the screenshot, we're aware of this issue and are currently working on a fix. It is, as you've pointed out, because you're using dotMailer through CTT. We'll keep you posted with any news!

  • Avatar

    Many thanks.  Look forward to using it when it's up and running.

  • Avatar

    Hi Sharon,

    We've made a few changes this afternoon, see how you get on now.

    Thanks

  • Avatar

    It was going well, completed all the information on the 'signup form settings' but there is no SAVE button to click!

  • Avatar

    Hi Sharon,

    We've added in some scroll bars which should allow you to see the save button whilst we investigate.

    Thanks

  • Avatar

    All done, tested and working.  Many thanks!

  • Avatar

    Hi there,

    If I have two pages under one account, do the App settings I choose apply to both instances of the sign up form on both my pages? i.e. will the same address book be used for multiple forms on my different pages.

  • Avatar

    Hi,

    The application settings will apply to the Facebook page you've selected to edit in the 'Choose a page to edit' section of the settings page, they won't carry across to other pages. You'll need to apply new settings for each Facebook page you wish to append the signup form to.

    Hope that helps.

  • Avatar

    How can I add a DPA statement on teh signup page and how do I make fields mandatory, please?

  • Avatar

    Hi Karolina - Unfortunately there's no option to make fields mandatory or to add a DPA statement. These are good ideas, would you please add them to our feature requests forum.

    Thanks

  • Avatar

    Can I add images to the email sign up form page?

    Is it possible to change the email sign up icon on the left hand side navigation?

  • Avatar

    Hi Natalie,

    Unfortunately it isn't possible to add images to the signup form currently, this is a good idea though so please feel free to add it to our feature requests forum.

    As for the image on the left hand side navigation, it is also not possible to change this but I believe Facebook will allow you to change the text. You can do this by taking the following steps:

    • Edit the page that has the email signup application on it
    • On the left hand side select the 'Apps' link
    • Locate the 'dotMailer Contact Signup' application section
    • Select the 'Edit settings'

    Hope that helps.

  • Avatar

    Well don't know what i have done but added the App to 3 of our Pages (all linked but separately added) but your icon does not appear? Also check that the app is not blocked etc? LOST!

  • Avatar

    Hi Andrew,

    Thanks for contacting us regarding this issue.

    Can I ask do you have a URL for your Facebook page please so I can look into this for you?

    Kind regards,

    Mark Taylor

  • Avatar

    Need a white label version of this feature!

  • Avatar

    Hi, I hope you can help me. I have added your app to our page and my colleague has completed the form as a test, however, he hasn't received a confirmation email and it isn't showing in my address book?

    Thanks,

  • Avatar

    Hi Laura - we'll do our best :)  Can you provide the link to your Facebook page?

  • Avatar

    HI Michael.

    http://www.facebook.com/pages/AH-International-Referee-Kit-Suppliers-to-the-Premier-League/261123359265

    I've followed all steps but the "Email signup" link just goes to a blank page.....:(

  • Avatar

    @Victoria - did you get this working? I followed your link and got an email sign-up form.  Or is it still a problem for you?

  • Avatar

    hi, i've added the app and followed all the steps, including adding it to my pages likes but the 'email sign up form' is not showing as a tab. not really sure what to do next?

  • Avatar

    Hi Craig,

    Sorry you've been having trouble with adding the signup to the page; there have been some changes to Facebook and we've not quite managed to catch up with them yet yet. We'll let you know, and update the instructions as soon as we've got it working again. 

  • Avatar

    This looks great - shame Facebook can't go longer than 5 minutes without changing their entire app and breaking everyone else's... Any ETA for the fixes?

Powered by Zendesk