How to Use Genesis eNews Extended with Constant Contact

Why You Want the Genesis eNews Widget Extended for Constant Contact

The more I have to work with Constant Contact, the less I like it, but it’s the email service provider of choice for many of my clients.

Unfortunately, its WordPress integration options are a bit unfriendly. The official Constant Contact plugin hasn’t been updated since June 2013. It’s a hugely heavyweight plugin that loads your whole list of contacts into your WordPress admin interface and sucks up a lot of time syncing it. Plus the form designer creates sign-up forms of sufficient hideousness that the only people I know who have it installed gave up and just used a text widget with a subscribe button.

Speaking of subscribe buttons, I think there was a time when you could actually embed Constant Contact sign-up forms on your site, but not any longer. You have the option of creating buttons or embedding links. Or you can create QR codes. The basic buttons are exceedingly plain and ugly. This is about as attractive as you can manage to make one, and it required some custom CSS, because the only things you can adjust in the button designer are the colors and shape of the button.

And, as you notice, you’re stuck with that “For email marketing you can trust” tagline at the bottom, which is nonsensical when applied to the client company as opposed to Constant Contact itself. They should have at least included their name with it.

As if this weren’t all annoying enough, Constant Contact makes it difficult to use alternative methods of signing up. They don’t provide a guide to the information you’re going to need to include in a third-party form. And, as I discovered recently when someone complained about the CAPTCHA on the form on a client site, that information has changed in the past year or so, since the time the Constant Contact tutorial was provided in the WordPress.org support forum for the Genesis eNews plugin.

Figuring Out the New Formula for Constant Contact and Genesis eNews Extended

My client sent me the new button code and I had to piece things out from there, based on the information that had been filled out in the existing Genesis eNews Extended widget, which had been filled out in accordance with the tutorial mentioned above. That worked fine–but the sign-up form it led to included a CAPTCHA form that one person had complained bitterly about. When my client queried Constant Contact, they explained that this was the old form; on the new form the CAPTCHA was hidden and humans didn’t have to deal with it. This was obviously to be preferred. (I detest CAPTCHA.)

I certainly didn’t want to regress from the existing eNews Extended widget to a basic Constant Contact button, so I needed to figure out how to update the information in the widget. It was not immediately apparent how to do that. I took a look at the source code for the actual sign-up form, trying to spot hidden fields, but in fact there were numerous hidden fields for each input field, and none of them resembled the hidden fields of the former widget.

Finally I noticed a correspondence between part of the URL in the button code and the existing hidden fields. I speculated that the other variables in the URL might be additional hidden fields, and decided to test this theory by adding each of them to the “hidden fields” box of the widget, following the same formula:

<input type="hidden" name="p" value="oi">

The process was a bit finicky, but it worked. I tried it later on a second website, where I had been unhappy with the way the admittedly lightweight CC widget displayed, and it worked there, too. It’s actually a bit easier if you copy just the link and not the button code.

Step-by-Step Guide to Setting Up Genesis eNews Extended for Constant Contact

1. Go to Constant Contact and copy the “Share Sign-Up Form” link

If you don’t have direct access to the Constant Contact account (I didn’t in the case of the first client), copy the link from whatever code the client sends you, or ask the client to send you this link.

The full link for this particular form looks like this:

http://visitor.r20.constantcontact.com/d.jsp?llr=mykivsmab&p=oi&m=1113022802700&sit=4zd479xhb&f=e189675b-6db2-4f5e-a1a5-bf39db3d4399

2. Paste this URL into a text editor

Using a text editor will save you hassle vs. using something like Word. If the URL is not hyperlinked it will be easier to copy different sections.

3. Copy the first part of the URL into the ACTION box of the Genesis eNews Extended Widget

Note also that your E-Mail Field should have “ea” in it, to transfer the content across. I haven’t yet figured out what to put in the First Name and Last Name fields. I’ll work on that. But those fields appear on the CC form later anyway.

 4. Break down each of the remaining elements of the URL into hidden fields, as follows:

<input type="hidden" name="llr" value="mykivsmab">
<input type="hidden" name="p" value="oi">
<input type="hidden" name="m" value="1113022802700">
<input type="hidden" name="sit" value="4zd479xhb">
<input type="hidden" name="f" value="e189675b-6db2-4f5e-a1a5-bf39db3d4399">

5. Enter these in the “Hidden Fields” box in the Genesis eNews Extended Widget.

6. Save the widget.

Here are two different Genesis eNews Extended widgets connected to Constant Contact on two different themes:

 

Neither of these is a miracle of original design, but both fit better with the themes of their respective sites than the default Constant Contact button is, and allows for a more customized message.

But give me MailChimp any day.