In this tutorial I will teach you how to install an Aweber lightbox hover on a wordpress blog.

I can’t stress how important it is to build a list of potential customers using an autoresponder to collect email addresses. This gives you the power to build a relationship with your readers. Having a list means you can get traffic to your blog almost instantly, make an offer for your product or affiliate to someone else’s.

I would also advise using a paid service such as aweber.

Step One

Sign into your aweber account (If you have more than one list make sure the correct one is showing in Current List).

Select Web Forms then select Create Web Form.

Enter a form name I usually use the blog name and lightbox, this tells me where there form is and what type of form it is.

Type – Select Lightbox Hover.

Select how you want the lightbox to appear on the screen, I usually select – fade into current window gradually.(You will get to preview the lightbox when complete, so you can change anything your not happy with).

Dimensions – Next select width and height that you want the hover window to be.

Again this is an option you will most likely change when you view the lightbox, but I find Width 400 Height 250 works quite well.

Background Color – Select the background colour of the hover window, on this demo I have used CCCCFF which is a light blue colour.

Delay – the delay is the amount of time before the lightbox appears, the default is 5 seconds which is fine for me.

Pop-up Recurrence – Next you have a choice when the visitor will see the lightbox, I usually leave the default once per visitor. There are 2 reasons I do this one because pop/ hover windows can annoy people and two I will have a fixed optin box elsewhere on the blog so the visitor still has chance to opt in.

Thank You Page – This option gives you the choice of where to send the visitor once they have filled out the web form. I always send them to a thank you page on the blog giving the visitor instructions of how to confirm their email address, this really helps with conversion especially in non internet savvy markets.

The last 5 options (forward variables to subscriber chicklet) I generally leave alone.

You should now have something like this:

Click the Next button at the bottom of the page.

Now you need to decide what you want on your web form. I always have at least First Name, Last Name and email address.

When you are happy with your form click save.

Now your aweber lightbox is complete you can preview what it will look like. If you are not happy click on the form name and you can go and change any options you wish.

Click on Get HTML to get the aweber code for your blog.

Copy all of the aweber javascript in the javasript snippet screen it will look like this:

Step Two

Log into your wordpress blog admin panel.

Click on the Appearance tab then click Widgets.

Find the text widget and drag it into your sidebar. (It may say sidebar or sidebar right/ left depending on your theme.)

Click the drop down arrow and paste your aweber code into the empty box (Leave Title empty).

Click save at the bottom of the text widget.

Step Three

Now go to your blog and see what the aweber hover lightbox looks like. If it doesn’t show you may need to clear the cookies in your browser.

If you aren’t happy with the way it looks any changes you make at aweber will change on your blog.

Remember you will need to clear the cookies in your browser if you want to keep checking it everytime you make a change.

Congratulations you have successfully installed an aweber lightbox hover on a wordpress blog.