Adding iContact To Storenvy

Hello!

I’ve been spending a lot of time in Storenvy Community Groups on Facebook lately, and have had a few people ask me the same questions repeatedly. So, I thought to myself, “Self, you should just write this all down somewhere and maybe add some pictures for people.”

Guess who’s starting a mini-series of SE customization tips? The Rambler, that’s who. Some of what I plan to include: email signup forms, four product images across when viewing a category, adding a Disqus commenting system, making your menu vertical /to the left, and some fun CSS tips.

Today we’re adding an iContact email subscription form to your page. Clearly, I’m assuming you’ve already got these accounts set up, as I don’t plan to walk you through sign up. This also assumes you’ve got a mailing list set up, even if it’s empty. If you want to see a finished product, check out our shop, at the very bottom.

If you have Mailchimp instead of iContact, see my post: Add An Email Signup Form To Your Storenvy

Get Where You’re Going

Log in to your iContact dashboard. Choose “Contacts” from the top menu, then “Sign-up Forms” below. The same link is also the last option under the “Add Contacts” box, and both bring you to the same screen. On the following page will be a big ol’ button that says “Create HTML Form” that you want to select.

iContact Menu

Make It Up

Pick your colors.

New Sign-up Form

Hit Next and you’ll get to a page for selecting your fields and choosing which mailing list you’ll have them signing up for.

Choose Fields

Lots of options, right? Try to keep it to a minimum, as most people don’t want to sit there typing all day. There’s clearly other good stuff for them to do in your shop! 😉

Got it all prettied up? Awesome. Don’t worry if it’s not exactly how you want it because you can tweak appearances with CSS once it’s on your site.

Hitting Save here will bring you back to the Sign-up Forms menu, where you can add a confirmation message, or view the HTML. Or delete it if you’ve mucked it up in some way… You want to click View HTML, though.

View HTMLFrom there, you can pick one of two options to select and copy. They recommend the Automatic Sign-up Form, and I do too if you don’t know a lick of coding. You’ll also notice there’s some CSS built right into what you’re copying – feel free to play with that later! If you mess up, just copy and paste the original back in.

Publish Code

Like my super-original title?

Drop It In

Now, select all that lovely gibberish in the box of your choice and copy it. Toddle on over to Storenvy and log in. From your dashboard, select Design, then choose “Pages” or “Edit HTML” as either one brings you to the same place.

SE Design Tab

From your Page Templates list, select the type of page you want it on. Layout will add the form to every page in your shop, like I’ve done. Home will add it to only the home page. Contact or FAQ are also good places for a signup form. Once you’ve selected the template you want, choose “Using Custom HTML” on the right to show the page code. If you don’t know HTML don’t get too scared – even if you mess up there’s a reset button in the upper right so you can set it back. Yay for undo!

Place your code where you feel it will work best. Most sections have little notes about what they are (thank you, SE team!). If you look at the picture, I’ve pasted my code immediately after the <–! end #main –> indicator so that my form is at the very bottom of each page.

iContact HTML

Hit Save

That’s it. Really. Okay, so you could go to the CSS and add some fancy stuff there. You don’t need to, though. 😀

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s