Last month, AWeber released its official WordPress plugin, so their customers can now install web forms on WordPress websites without copying-and-pasting bits of code. In short, adding a sign-up form to your sidebar just got a lot easier.

As a big fan of both WordPress and AWeber, I’m delighted to see the two working together like this. And AWeber has announced that more applications are being developed — I, for one, would love to see seamless integration with E-Junkie.

But let’s get back to WordPress.

In the illustrated steps below, I’ll show you how easy it is to use this plugin on your own WordPress site — as well as describe a couple of limitations you should be aware of.

Step 1: Install the plugin in the usual way

If you need a refresher, go check out my post on how to install a WordPress plugin, or grab your copy of my free WordPress Essentials Toolkit by subscribing to my Weekly Web Tips (if you’re already subscribed, thank you! Your download link should be over there on the right).

If you’re using the search function inside WordPress, type the phrase “AWeber Web Form” (yes, with the quotes). You’ll find this handy plugin right away. Go ahead and install and activate it.

As soon as you activate the plugin, you’ll see a red-bordered message at the top of your screen (shown in Figure 1), telling you to update your settings to start using the plugin.

Click on the red “settings” link or navigate to Settings –> AWeber Web Form to proceed.

Step 2: Connect your AWeber account to your WordPress Dashboard

On the Settings page, as shown in Figure 2, you’ll see the two steps you need to complete to link your AWeber account with your WordPress Dashboard.

Step 1 is to get an authorization code from AWeber. See where it says “Click here to get your authorization code”? Do exactly that, and you’re shown a mini-login form for AWeber, shown in Figure 3.

Enter your AWeber login name and password (not your WordPress login and password — they should be different for better security!) into the form and click “Allow Access.”

Once you’ve confirmed that you are the owner of the account in question by entering the correct login name and password, you’ll see a Success! message, followed by a verrrrry long string of random letters, numbers, and characters. This is your activation code.

The screen is shown in Figure 4. Although I grayed out the actual code for security purposes (because that code is unique to my account), I wanted you to see how long the code is so you know that’s normal.

Now, you’ll need to select this entire piece of code and copy it.

Next, go to the AWeber Web Form settings page (the same page shown in Figure 2). Where it says “Step 2: Paste in your authorization code,” paste that long string of characters. The field where you’re pasting it does not look long enough to hold it, but it will. You won’t be able to see the entire string once you’ve pasted it — just the end.

Now click the blue “Make Connection” button.

If you copied and pasted the entire code correctly, you’ll get a success message as shown in Figure 5.

That whole make-a-connection step is the hardest part of using this widget, but fortunately it’s a one-time process — and whew, now it’s over!

The plugin helpfully tells you exactly what the next step is, and provides a link straight to your Widgets area so you can install a web form right away.

Step 3: Make sure you have a web form to use

This WordPress plugin doesn’t let you create or edit web forms — it lets you pick, preview, and use web forms you’ve already created inside your AWeber account. So if you don’t have any created, now would be the time to go and do that.

If you need instructions on this process, login to AWeber and follow their prompts, or check out the section on web forms in my Love Your List AWeber guidebook (until Friday, you can get a Personal Office Hour as an add-on to your Love Your List purchase — you can use your hour anytime before the end of February 2011).

Step 4: Set up your form widget

Inside your WordPress Dashboard, navigate to Appearance –> Widgets.

You’ll see a list of available widgets in the large left pane of this screen, and a list of widget areas in a column on the right.

Depending on your theme, you might see only one widget area, probably labeled “Sidebar,” or there might be many (the Atahualpa theme that I recommend comes with four different default sidebars, and you can add new widget areas, so make sure you’re adding your widget to the correct widget area!). In Figure 6, you can see that I created some extra widget areas for my header, and I’m adding this widget to an area called Header Widget 2.

As shown in Figure 6, click on the available widget labeled AWeber Web Form, and drag it over to one of your widget areas. When you see a dotted rectangle appear, you can let go and drop it.

You can reorder your widgets (or drag them to different widget areas) by simply clicking and dragging. Once you’re satisfied with the location of the Web Form widget, click on the tiny gray triangle on the right side of the widget title, to open the widget settings.

The widget itself helpfully guides you through the process. Clicking the drop-down triangle next to “Step 1: Select A List,” as shown in Figure 7, gives you a list of your lists (if you have only one list, this step is super-easy — but it won’t be auto-selected).

After you select one of your lists, you should see a second drop-down area appear automatically, titled “Step 2: Select a Web Form.” Pick the web form you want to use — again, if you only have one form, there’s only one choice, but you still have to select it. It won’t be selected by default.

If you don’t see Step 2 appear automatically, or you see the wrong forms listed in Step 2 (both of these happened to me when I first set up this widget), you’ll need to clear your browser cache and cookies. Here’s how to clear your cache, and here’s how to clear your cookies.

When I first installed this plugin I found that I had to clear my cookies each time I changed the widget settings, which was annoying and counter-intuitive, but today when I played around with the plugin, I found I could change the settings without having to clear my cookies. So perhaps there was an issue that was fixed, or maybe the Internet was broken when I first installed the plugin.

Once you have both a list and a web form selected, a link labeled “preview form” appears below the dropdowns. This lets you see how the form will appear, so you don’t have to log into your AWeber account just to remind yourself what it looks like.

If you need to make any changes to the form, however, you will have to go to your AWeber account to make those changes. Anytime you change the form inside AWeber, the changes will instantly and automatically be reflected in your widget.

When you’re happy with your form’s appearance and placement, click “Save.”

And that’s it! You might want to go visit your website to make sure it’s showing up correctly (and isn’t too wide for your sidebar, or displaying any other formatting weirdness). Remember, if you need to resize the form, you’ll need to do that from inside your AWeber account.

Limitations of the AWeber Web Form plugin

This plugin is a great step forward for WordPress and AWeber users. I’m happily using it myself, in the header of my site (I edited the form to include a picture of the WordPress Essentials Toolkit cover, a customized Subscribe button, and text inviting people to get my free PDF by subscribing).

There are a couple of important limitations you should be aware of:

1. You can only use one instance of the widget. Most of us will only need one, but this limitation could get frustrating if you want to place two different forms in two different places in your sidebar, or into two different sidebars.You can still use the old-fashioned way (copying and pasting AWeber’s form code) to add multiple forms to multiple places, but it would be nice if you could use this widget in more than one place.
2. This plugin only works inside a widget. This means that you can’t use it to put a web form on a page or inside a post. And you can only place a web form into your header or footer if your theme has (or lets you add) widget areas into those sections of your site.
   So, for instance, I used the old-fashioned copy-and-paste method to place my newsletter sign-up form on my Subscribe page, and if I write a blog post inviting readers to sign up for a future teleclass, I won’t be able to use this plugin to insert the sign-up form.

I can still give this plugin a hearty thumbs-up, because what it does, it does well and seamlessly, and I love the way AWeber has built it to guide new users clearly and quickly through the process of installing, connecting, and setting it up. Many thanks to the AWeber team for developing this plugin!

Are you using this plugin on your site? Got a question about it? Leave me a comment!

And remember: You can call me for free during Thursday’s Office Happy Hour, or get your own Personal Office Hour if you need a helping hand with anything web-tech-related. The Personal Office Hour is a one-week experiment — I’m only selling them until December 24, but you have until the end of February 2011 to schedule and use your hour.