Add Signup Form to Tumblr Using Chimplr

This feature requires Admin user level or higher.

With Chimplr, your Tumblr visitors can sign up to your MailChimp list right from your Tumblr. Chimplr adds a Newsletter button next to the rest of your Tumblr controls, and launches a pop-up signup form when clicked.

In this article, you'll learn how to use Chimplr to add a signup form to your Tumblr blog.

Get Your API Key

To add a form to your site, you'll need to provide Chimplr with an API key from your MailChimp account. To get an API key from your MailChimp account, follow these steps.

  1. Click your profile name to expand the Account Panel, and choose Account.
  2. Click the Extras drop-down menu, and choose API keys.
  3. Click Create A Key to generate a new API key. If you've created an API key for Chimplr before, copy it from this page.

Create a Newsletter Button with Chimplr

After you have your API key, you can use it to connect your MailChimp account to Chimplr. To create a Newsletter button with Chimplr, follow these steps.

  1. Navigate to chimplr.herokuapp.com and click Get Started.
  2. Paste your API key in the field provided and click Next Step.
  3. Click the drop-down menu to choose the list where you want to add your Tumblr visitors, and click Go to the next step!
  4. Chimplr will display the code for your newsletter button. Highlight all of the code, and use your preferred method to copy it.

The directions on the Chimplr site are not up to date, so follow the steps in the next section to add the Newsletter button to your Tumblr.

Add Your Button to Tumblr

After you have the code, you can add it to your Tumblr blog. To add the code for the Newsletter button to your Tumblr, follow these steps.

  1. Log in to Tumblr, if you haven't already.
  2. From the Tumblr dashboard, click the Person icon in the top navigation bar, and choose Edit appearance from the drop-down menu.
  3. In the Website Theme section, click Edit theme.
  4. Paste the newsletter button code in the Description section.
    Paste code in Description section in Tumblr
  5. After you're finished, click Save.

If the Newsletter button doesn't appear or doesn't work, you may need to replace a line of code. To do that, follow these steps.

  1. Find jquery in the code you pasted into the Description field. Usually, the line of code will look something like this.
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js"></script>
  2. Delete the full line, including the <script> and </script> tags, and replace with the following code .
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>
  3. Click Save.

Was this article helpful?
What can we do to improve articles like this?

Technical Support