Adding the Subscription for the Floating bar

If you would like to have a subscription form on the Floating bar, like as on the demo:

subsription-form-floating-bar

We will set up for the Mailchimp for WP plugin to make the form work,  this is one of plugins required for Olivia theme, so it’s already installed on your blog if you followed step by step to the installation article.

If this is the first time you use this plugin, you will receive the message “MailChimp for WordPress error: There is no form with….” on the Floating bar, but don’t worry about that.


1- Get the API Key

  • Go to your dashboard, navigate to Mailchimp for WP, click the “Get your API key here” link.
  • At the Mailchimp.com page, you sign up an account and get the API key, if you can’t find the API key, take a look to this article tutorial

Note: Mailchimp for WP is a plugin that help to integrate the service at Mailchimp.com to your wordpress blog. You have to sign up an account, then create a List to manage the subsribers, create email template and create a weekly newsletter Campaign at mailchimp.com.

mailchimp-api-key

2- Create a List on Mailchimp.com

When you are in the Mailchimp.com, you have to create a List (that is used to store the subscribers information). The subscribe box on your blog will not working if you don’t create a List

3 – Customize the Form:

Navigate to Mailchimp for WP –> Forms –> Clear default form code in the big text box, then replace by the following code instead:

Note: If you’d like to change the text from “Join the Family!” to something else, you can do so on the 1st line of the above code, but it should be a short text. If you would like to remove the First Name and Last Name, just remove the 2st and 3st line of the above code.

customize-form-mailchimp

Be sure to save changes to the form when finished.


If you don’t want to use this feature, you go to your dashboard, navigate to Appearance –> Customize –> Floating Bar Settings –> check the box “Hide Subscription Form

hide-subscription-form

Note: If you would like to remove the Floating bar, just check all the boxes.