Email for Rapidweaver

Email for Rapidweaver | Joe Workman | $59.00

Given that Rapidweaver – plus Stacks – provides such a great visual environment for laying out web pages, why shouldn’t you also be able to use it to lay out email newsletters containing text, images, video, links, and all manner of other fancy stuff that can be opened by any major email client? Well, now you can.

Joe (day off, what’s a day off?) Workman has partnered with Zurb to create a Stacks-based version of Foundation for Emails, which provides a rich, visual environment for laying out newsletters and then exporting them for use with a range of popular email services like Mailchimp, MadMimi, Weber, Sendy and more.

It’s important to understand this. Creating an email newsletter is a two step process. First, you create it as a sort of one page, standalone Rapidweaver project and then second, you use a utility stack to generate a whole bunch of code that you can copy and paste into your preferred email service.

Email for Rapidweaver includes 18 stacks, including one to set styles, along with others for columns, text, buttons, callouts and spacer stacks, as well as Markdown, lists, dividers, visibility and HTML. It’s important to understand that you design your newsletters using these stacks – and these stacks only – rather than any others you may have in your library. If you try and mix and match, you’ll end up in a terrible tangle.

If you’re familiar with using the free-form Foundation theme and Stacks to lay out your pages, you’ll feel right at home with Email for Rapidweaver. If not, there are only a couple of things you need to watch out for. First, each email newsletter you create needs the Email Styles stack, because this handles the sizing, style and colour of your text, together with other elements (like buttons) as well as body and background colours, sizing on desktop and mobile and so on.

Second, as soon as you add the Styles stack to the page, you’ll see an Implementation Checklist in the settings panel – there are six checks here that you need to complete in order to produce a newsletter that will output the correct HTML code. They’re all straightforward – things like selecting the included Email theme from the theme drawer and changing some of the project settings – but each one is important so don’t skip them.

Once you’ve completed the checklist, you’re ready to design your newsletter. We’re not going to go into this because you’re essentially designing a layout on a Stacks page and the different elements described above work pretty much exactly as you’d expect them to. Once the email newsletter is finished, you’re ready for stage two.

This involves dragging the Inliner stack onto the page and then clicking Preview. This will display a preview of your newsletter – with a difference, because you’ll also see a pane containing all the code required to display and format your newsletter, along with a plain text version in a second window. Simply click the Copy to Clipboard button, then fire up your web browser and navigate to your email service. Once you’re there you’re going to want to track down the option that lets you define a custom layout for your email (all services provide standard layouts or drag and drop layouts but they all also include the option to paste in your own code – that’s what you want to find); you can also copy and paste the plain text version as well, in case you have subscribers who prefer to receive emails that way. After that you can preview and then send your email shot as you would normally. (Note: you’ll find there’s the odd vendor-specific ‘tick’ – perhaps to do with unsubscribing – that you’ll need to include, but Joe Workman has an excellent set of videos on these on his YouTube channel.)

The Email for Rapidweaver suite of stacks also ships with a selection of templates for you to customise and these are a great way to get started, but since it’s Stacks-based, you’ll quickly be designing and building your own from scratch. Email for Rapidweaver’s workflow is a bit quirky but once you’ve got used to it, you’ll find these stacks incredibly useful and they make the job of styling email newsletters to fit in with the rest of your site easier than anything else around at the moment.