The Artlogic email 'Compose' tool lets you design beautiful HTML emails. This guide will give you a basic understanding of how to use it.
1. Creating and Uploading Content
How to Create a New Email
- Go to Marketing > Email Marketing Campaigns > Compose/Edit emails.
- Click the 'New record' button at the bottom of the page. The new email will open in a new tab.
When you start a new email, you will be asked to choose a template or start with a blank one. Once you’ve made a choice you have to save the record (the page is disabled until then).
Adding content to the page
Add content to the page by dragging 'objects' within the 'objects' section in the main panel. Just drag an object from the panel onto the page.
Adding Text and Images
Text:
For a simple block of text, drag the 'Text block' object onto the page. Empty text fields display some placeholder text - just click inside the text area and it will disappear. Now you can type your own text.
Text Settings:
To change the appearance of a small portion of text, use the text toolbar that appears when you highlight some text. The text toolbar provides the following options:
- Bold (makes the selected text bold)
- Italic (makes the selected text italic)
-
Strikethrough(draws a line through the selected text) - Underline (draws a line under the selected text)
- Hyperlink (makes the selected text clickable)
- Colour (changes the colour of the selected text)
To add a clickable link, highlight the text that you want to make clickable, then click on the 'link' icon in the text toolbar. This will show a text input for you to enter the URL that you want the text to link to. When you've entered the URL, hit the 'enter' key.
Tip: if you wish to enter the link to the recipient's 'Email Preferences' page so they can update their mailing settings, enter exactly this as the URL - https://app.artlogic.net/#site#/public/email_preferences/#uid# (this link appears automatically in your email footer as well)
Images:
There are a number of objects that contain images, like the grids. Empty images are displayed as grey boxes.
- To add a simple image, drag the 'Full-width image' object onto the page.
- To add an image, click on the image upload button that appears when you move your cursor over the image box.
- Now you can select an image from your device and upload it.
- Once the upload is complete, the image will appear in the image box.
Using Layout Options
Adding space between objects:
To adjust the space between objects, go to the object settings - select an object and use the 'Space above' and/or 'Space below' sliders under 'Layout settings'.
Changing the width of a page:
To change the width of the page, go to 'Page settings' in the main panel and use the slider labelled 'Container width'.
Saving your email:
To save the changes you make to your email, click on 'Save page' at the bottom of the main panel. The button turns blue when there are unsaved changes on the page.
It's best to save your changes frequently to make sure you don't lose any work!
2. Personalise Emails with Merge Tags
What are Merge Tags?
Using merge tags allows you to personalise your bulk emails so that each email is addressed to the correct recipient automatically.
Merge Tags List
The following merge tags can be used within the content of an email:
{firstname}
{lastname}
{fullname}
{email}
{organisation}
{salutation}
These tags will be replaced by the corresponding value in each contact record.
Testing Merge Tags
Test your merge tag: We encourage you to test your merge tags (and your campaign in general) by sending a test email to a new recipient list that includes only internal "test" email addresses. Merge tags will not work when sending just to one email address - although your contact (your email) might be in the database, the only information provided to this test email is the email address, not the rest of the information for the contact record. To test your merge fields, choose to 'send to a test mailing list' - where we've provided the additional information for the merge tags for the email to reference.
3. Design Layout and Adjustments
Moving and Aligning Objects
Drag each object onto the page and place them in the correct layout for your campaign. To move an object, click on the drag handle that appears when you move the cursor over an object, and drag it above or below other objects. A blue line indicates where the object will appear when you let go.
Grouping Objects
Using the 'Group' tool, you can select a bunch of objects and group them into a single object. You can now save them for use in another email, or move them as a single item.
Select one of your objects to show the object panel. Then click on 'Group objects' at the bottom of the panel. This will activate the grouping mode. Now you can select all the other objects that you want to include in your group. The selected objects will have a blue border. Once you've selected all the objects, just click on 'Confirm group' in the grouping panel.
Your objects have now been packed into a group. Now when you move the group you will be moving all of the objects within it. When you save the group it will be saved with all of the objects it contains.
Grouped objects may be saved in the same way as any other object - simply click on it and click 'Save object' at the bottom right of the window.
Customising Object Settings
The object settings panel is where you find all the controls for each object. These can differ between different types of objects - for example, an object containing images might give you some image specific controls, while a button will give you controls to change the appearance of the button.
Items with Objects:
Some objects can contain multiple items. For example, a three-column grid will contain an items spread across the rows and columns. These items can be administered from within the object settings, where they are listed in the 'Items' section. From here you can add new items, reorder items with drag and drop, remove items and in some cases modify some of the properties of each item (for example you can make items in a grid clickable).
Saving an Object:
Similarly to the page settings, you may want to re-use an object that you have made with all of it's settings. Click on the object to open the object panel, then click on 'Save object' at the bottom of the panel.
You should see the saving options, including a text input to name your saved object. Saved objects will show in the main panel in the 'Saved objects' section, unless you save an object as a header or footer, in which case it will show in the 'headers/footers' section.
Unpacking a group
Grouping objects gives you the benefit of moving multiple objects at once, as well as being able to re-use a group of objects. However, you lose the ability to modify the settings for individual objects within the group. If you need to change the settings for an object within a group, you can simply unpack the group by selecting the group to show the group panel and clicking on 'Unpack group'.
4. Saving and Previewing Your Work
Saving Changes
If you send out regular emails with a consistent design, consider saving your page settings. This way you'll save time because you don't have to set everything up from scratch every time. To save the page settings, go to the main panel and click on 'Save page settings...' at the bottom of the panel. You can save the page settings for yourself so that only you can see the saved settings, or for everyone. When making a new mailing to use your saved settings, go to 'Page settings' in the main panel, and select your settings from the dropdown menu in the 'Saved settings' section.
Previewing Your Email
While the compose screen gives you a good indication of what your email will look like, there are things like placeholders that won't show in the actual email you send out. Thats's why it's good to check your email in the preview mode while you're making changes. You can activate the preview mode by clicking on Preview at the bottom of the main panel.
Preview mode also allows you to test what your email will look like on a mobile device.
5. Replicating and Deleting Emails
Duplicating Emails
If you want to create an email that is very similar to an email you've already made, you can duplicate it with the 'duplicate record' button in the record edit panel. To get to the record panel, click on the pencil button at the top right of the panel.
Deleting Emails
To delete the entire email record, click on the pencil button at the top right of the panel to open the record edit panel. Then click on the 'Delete this record' button. A duplicate record will be created and opens in a new tab.
6. Headers and Footers
Setting Up Headers/Footers
Headers & footers are a great example of objects that you would want to save to reuse in lots of different emails. There are a number of objects that cover the basic layouts for headers and footers. Here's an example:
Let's say we want a footer with our logo on the left and some social media icons on the right.
In order to make this, we'll need the 'Image + icons' object. We'll start by dragging it out onto the bottom of the page.
Now that it's on the page, let's upload a logo by clicking on the image upload button that appears when we hover over the grey area on the left. You can adjust the size of the image using the 'Image size' slider in the object settings.
To add the icons, click on the grey icon placeholders to open the icon panel.
From here you can set the icon to one of the built-in icons, or upload your own. Further down in the icon panel you can add a link to your icon, for example to link to your Instagram page.
For our example, we've used Instagram, Pinterest and Twitter icons. Once you've selected an icon, click on the next empty icon on the page to select the icon for that one until you've set all of the icons.
In our example, we want the icons to be white on a red circle background. Rather than doing this in the icon settings for each individual icon, we'll do it in the icon settings within the object settings. This way we just have to make changes in one place.
First, click on the object to open the object settings. Change the icon colour by clicking on the colour selector. You can choose a colour in the colour picker or type in a HEX colour value.
Then use the next colour picker to change the background colour.
To make a circle, drag the 'Roundness' slider all the way to the right.
Now we can adjust the padding and the size to get the right style. When you increase the padding the icons will appear smaller - you can compensate this by increasing the size.
Using Pre-Designed Layouts
When your footer looks the way you want it to, it's time to save it so that you use it for future emails. Select the object to reveal the object settings, and click on 'Save object'.
Type in the name of your footer and select 'Footer' in the dropdown menu next to 'Save as'. This will ensure that your saved object appears in the 'Headers & Footers' section in the main panel. When you make your next mailing and want to apply the header/footer, from there you can simply drag it out onto the page.
7. Final Touches and Sending
Before you send your mailing in a campaign, you'll need to make sure your newly composed mailing is 'Live'. Click the pencil edit icon in the top-right hand corner of the mailing compose screen to access this options.
This is also where you can add your email's 'Preview text'. Read more about this and why it's important here.