WordPress-Tip: Opt-In-Form

I have to admitt: marketing is my weak spot. If you have some very hot tips, particular for graphic-designers, please let me know! I truely believe, that a graphic-designer has to do his marketing differently than a fruit merchand or a doctor.

Sending a newsletter is a very common form of marketing on the internet. When I first started my business a friend told me: “A newsletter is only useful, if you have something really new to tell.” Ok, so was my first thought, there is never anything new in my business, every day the same stuff. That’s not true.

See I am writing a brandnew article about Opt-In-form, this is something new. Since last week you can subscribe to the newsletter of Helz-Design. You will get it every 2nd week.

Back to topic. You have to subscribe for a newsletter, this is called opt-in. Usually you have to fill a little form, and you will get a link, which you have to confirm. This is called double opt-in. And certainly you have always the chance to unsubscribe easily. I bet, you are familiar with this.

How to do it with my WordPress site?

That was my big question for me last week. I want to send my newsletter via  MailChimp.They allow me to have up to 2,000 subscribers and sending 12,000 emails per month for free. And it is quite easy to send a good newsletter via MailChimp.

To connect my MailChimp account and my WordPress site I need a plug-in. Everything works with plug-ins. I have choosen “Optin Forms“.

And now I would like to show you with some screens how it works. It is quite easy!

I persume that you have installed the plug-in and activated it. Just have a look at your sidebar (backend) and you will see now Optin Forms right underneath Feedback.

Click it and now you can configure your opt-in-form.

Conecting with  MailChimp

Hit:  EmailSolution

MailChimp Optin

At first you have to choose, which newsletter service you are going to use.


You see, I have already choosen MailChimp.

But there is a pulldown menu, where you can see different services.

Pulldownmenü Emailsolution

You can work with AWeber or iContact and some others. But you need a so called “Form action URL” which you will get from your newsletter service.

Where do I find this  Form action URL?

Quite easy, just click on the questionmark next to the word Form and follow the steps:

I did it, just to show you how I did it for MailChimp, but I think every other service will be explained similarly.


Log in to your newsletter service via their website.

Choose your List.

Extratip: always subscribe  your own newletter, so you can alwys check if everything works.


Choose “Signup Forms” on the right side:


Now „Embedded Forms“:

naked form

Here you will get your “Form Action URL” which is highlighted in pink. Will look a bit differently in your form, just copy and paste.


Hey, now we can start with the newsletter!


Let’s configure the form first, to make sure that it looks the way you want it to look like!

So click the tab “Form” after you have saved your changes.

Form configuraion



A you see it in the Pulldown menu, you can choose between 5 different forms. I decided to use form #5, coz it is very close to the color scheme of Helz-Design.

Have a look at the ohther forms:


optin2 optin3 optin4


And now a closer look to #5 – don’t get confused, I have used screens with the German text, but you can change any text!


You can adjust everything to your taste via Style your Form.


  1. Choose your background color, you can add your prefered color everywhere via hex-code,
  2. set up the title,
  3. choose title font
  4. font size of title, – attention: all font sizes in pixel – I always used the default sizes,
  5. color of title
  6. text of subtitle
  7. font of subtitle
  8. fontsize of subtitle
  9. fontcolor of subtitle
  10. styleform2
    input field: you might want to add “please enter your name” or something similar.
  11. email address
  12. font of input field
  13. fontsize of input field
  14. fontcolor of input field – I would suggest to leave it black, the contrast is much better
  15. Button Text – a simple “yes I want to subscribe” would be enough
  16. fonttype of  Button
  17. fontsize of Button
  18. fontcolor of Button
  19. backgroundcolor of   Button, Helz-Design will always go with orange
  20. Styleform 3
  21. Disclaimer: always important to tell your subscriber, that you will treat their addys with respect. They won’t receive any spam from you, and you won’t sell the email-addy, so they won’t get spammails because of that.
  22. fonttype of disclaimer
  23. and its size
  24. and color
  25. What about the Form width? 100%? In this case they will always adjust to the monitor of the user, which is quiet good, if somebody will read your blog via his cell. Or do you prefer a certain fixed width? Just try what works best for you!

Then we got Form Options and Form Functionality. I have left those on default.

form palcement

But Form Placement  was something I took a closer look at.

You can decide where you opt-in form will be placed.

  1. Posts: after the 1st or 2nd paragraph? Or at the end? Maybe to exclude some posts?
  2. Same goes for pages. You can choose the position. I have excluded my homepage (welcome) and the portfolio page. Those pages just depend on the graphics on it and the opt-in form just disturbs the design.

Have fun with the opt-in-form. Tell me about your experiences. Maybe you have found a different way? Just leave a comment.