Get the FREE Freelancer’s ToolkitGet the free toolkit!

How to Add an Opt-in After Your Blog Posts (& Why it’s Important!)

Think about the last time you visited a new-to-you website, and what brought you there. If you’re like me, you probably saw an interesting link on Twitter or Facebook to a blog post you wanted to read.

In fact, I can’t remember the last time that a home page was the very first introduction I had to a new-to-me website. My first impression usually comes from the first blog post I read. If I love that post, I’m more willing to take the next step that’s offered to me.

If you want to turn your blog post visitors into freelance clients, you've got to make sure they're opting into your email list. Here's how!

That’s why it’s so important to include an opt-in after your blog posts if you’re serious about growing your email list. When a new visitor loves your blog post, they are excited to learn more about your brand. You’ve provided value, and they want to know what else you have to offer.

Signing up for your email list is a natural next step, and people are more likely to take that step if you make it clear and easy for them. From there, you can send them through a welcome sequence that builds trust and brings them back to your website for more. Without that next step, the reader is at a dead end, and they may simply close the tab and forget your site after they go through the ten other tabs they have open.

So are you ready to add an opt-in after your blog posts? I’m going to show you how to make it happen in WordPress!

Step 1: Install PopupAlly

LisaButler1

In this tutorial, we’re going to use the free PopupAlly plugin.

Go to Plugins > Add New and search for PopupAlly. Then install and activate.

The free version allows you to add two opt-ins to your site, and you can choose from a popup or embedded forms before or after your posts or at the bottom of your site. The Pro version allows you to add unlimited opt-ins anywhere on your site and gives you more control over the look and feel of your opt-in.

Step 2: Enable the embedded signup for your posts

LisaButler2

Next, go to the PopupAlly section in your WordPress admin area and visit the Display Settings. Check the option for the embedded sign-up, and show it at the end of your post content. Then show for all posts.

Step 3: Setup your form

LisaButler3

What’s tricky about styling opt-ins is that every email list provider has different form code, so the CSS that works for my form may not work for yours. PopupAlly takes the guesswork out by extracting the information from your form and putting it into their own code.

So to set up your form, you’ll need to pull embedded form code from your email list provider and paste it into PopupAlly. PopupAlly will figure out the fields that correspond to the name and email address from there. Above is what the embed code from MailChimp looks like. Below you’ll see what happens after you add the code to PopupAlly.

LisaButler4

Step 4: Style your form

LisaButler5

Styling your form is pretty straightforward in PopupAlly. Just fill out the information on the left, and it will show you a preview on the right. Below you’ll see the opt-in form on my live site, and it looks exactly like the preview in the plugin.

LisaButler6

Bonus points: Add more style!

PopupAlly looks pretty decent out of the box, but you probably want the fonts to match your site so it blends a bit more seamlessly. The Pro version has Google fonts built in, so if you’re not comfortable with code at all, it’s a great option for customization. But if you don’t mind dabbling in a bit of CSS, you can match the fonts to your site with a little coding magic.

LisaButler7

To add CSS to your site, we’re going to use the Jetpack plugin by WordPress.com. Once you install and activate, go to settings and activate the Custom CSS module.

LisaButler8

This will add a new Edit CSS tab under appearance, which allows you to easily add a little bit of CSS to your site without digging into theme files.

For this code, using Google Chrome as my web browser, I right-clicked on the title of my opt-in box, chose Inspect, and copied the CSS from the section on the right. Then I added a rule for font-family to match the font used on the rest of my site. I repeated the process for the subtitle text.

LisaButler9

Hit save and reload your page. This is what my new opt-in box looks like!

Don’t let this little bit of code scare you. Ultimately, it doesn’t have to look perfect to be functional, and you can always tweak the form later as you learn and play more with code. The most important thing is to install and setup the plugin options so you can start sending new visitors to your email list!

Lisa Butler Lisa M. Butler wants to live in a world with no alarm clocks (that’s why she works for herself!). As a web developer, she’s coded over 100 websites on WordPress. When she’s not knee-deep in CSS, HTML, and PHP, you can find her podcasting with her boyfriend, chasing their dogs around the house, or packing her bags for her next flight. Her latest project, Creative Code Club, teaches people how to code for WordPress in short, monthly video lessons. Say hello on Twitter or her website, where you can download her free guide to WordPress plugins.

SIGN UP
+ get the FREE Freelancer’s Toolkit including:
✓ From Last Corporate Day to a Month of 5k
✓ How to Get to Steady
✓ 4 Steps to your First (or next!) Passive Income Stream Workbook
✓ Daily advice, tips & inspiration

Yes, please!

{ 0 comments… add one }

Leave a Comment