Building An After Post Subscribe Box Step by Step

This tutorial is one of a series created for users who have Kolakube skins installed on the Thesis framework.

One of the greatest advantages of owning a Kolakube skin is, you don’t need any knowledge of css or php coding.

If you do, their forum simply gives it to you, but its nice to customize your site DIY style.

I’ll show you how easy it is to add your “cleaned up” email subscription code inside a custom made opt in box that you will make using your WordPress editor.

Step 1 – Grab Your Email Opt In Code

You can use code from any email service like Get Response, Aweber, MailChimp or even Feedburner code.

Don’t want to mess around with code? Simply grab 7 free email opt in forms which have already been made for you by the owner of Kolakube, Alex Magnini.

Step 2 – Create Your Opt In Box Using Your WordPress Editor

Paste the email code into your HTML editor
Add a Heading 3 and a couple of lines of real compelling content
Centre all the text as well as the opt in code

Step 3 – Add Some Pre Made Code

I lied! There is some coding involved but its already made so you simply copy & paste.

Wrap all the code using the HTML editor in a div:

Obviously your code block will be far larger than the above example. Here’s screenshot of mine which you could use if you could copy and paste it.

Ever tried pasting code into your visual editor for tutorials?

Create New Widget Area After Single Posts

Here’s the PHP code that creates a new widget area in Thesis.

Please copy the code from the view raw link and paste it at the end of your child themes custom_functions.php file using a text editor like Notepad++

Step 4 – Paste The HTML Code Into The Post Footer Content

If you aren’t using a Kolakube skin, you can use the Thesis hook plugin and paste the code into any location there’s a Thesis hook.

Next, add this css code to your Thesis custom CSS editor

#after_post .optin {
background: #464646;
text-align: center;
padding: 15px 15px;
}

You can easily change the hex code and padding to your own situation.

After Post Opt In Box Finished – Any Feedback?

Got any tips to share or get stuck anywhere, fire away in the comments below!