Craft Professional Emails with Custom HTML in zkipster
Please Note: Creating and sending custom HTML emails requires a technical understanding of HTML code so if you are unsure, please involve your technical staff or design team.
zkipster does not support the building of custom HTML code in any way. If you lack the skills to fully understand HTML, and don’t have anyone within the team with that knowledge, zkipster strongly encourages the use one of the predefined templates.
Tips when Preparing your HTML Code
Any image assets that are embedded in the code should point to public domain URLs.
Any relative local links to files in your hard-drive will show as broken when uploaded. If this happens, it's still possible to replace the image by uploading them in zkipster after you have uploaded the HTML file. zkipster then adds a public reference to the email code (See the "Replacing Broken Pictures" section below).
To capture RSVPs, you should create a standalone Response Form and embed the link into the HTML code after it is uploaded. Design a placeholder for the form into the code to be replaced with the live link (See the "Linking Response Forms to your Email" section below).
Any image you will upload needs to be under 3200x3200 in dimension to avoid errors.
Please note: The file size upload limit for your custom HTML invitations is 1MB.
Setting up the Custom HTML Email
When you have your HTML code file written or sent from your design team, it is very easy to upload into zkipster:
Create a new Campaign and select the HTML Email/Message template.
After selecting your Template, go to Settings > Send To > and select the 'HTML Email - Upload HTML file' option. A popup window will come up asking for your permission to change to HTML Format.
Upload the HTML custom code file
Edit your 'Email Setup' as needed
Adding Dynamic Tags from Guest List Data to your Email
When preparing the HTML code, it is possible to link dynamic tags from zkipster into your code to personalise the email using the data from your guest list. You need to know where in the code to place these tags once the file is uploaded so be sure to add placeholders for dynamic content that will get replaced by the actual guest values when the email is sent.
For example, you can address the guest by their name:
Dear :guest_firstname :guest_lastname
:guest_firstname and :guest_lastname will be replaced by the real guest names when they actually receive the email.
These are the tags currently available for use within emails:
EVENT TAGS
GUEST TAGS
*Custom fields will also be available as tags with :guest_<name_of_your_custom_field>
Replacing Broken or Missing Images in your Email
After successfully uploading an HTML file the zkipster system provides a preview of the email content.
If some images are missing or broken, this is commonly due to a local file reference being used from your hard-drive or a non-public link was used to reference the image.
In this case, it's possible to replace the image by uploading it to zkipster which will publicly host the image once the steps below are done:
Click on the image to be replaced
Select the image from files
Or place the URL where the image is hosted
Click Save
Linking Registration Forms to Your Email
To attach a zkipster form to a custom code HTML email, you need to create a response form separately (depending on your requirements, you can also use the consent form for this). To do this, please select the Response Form template.
This article additionally explains how you are able to customize the design of your form further.
Once you are ready with your form, you can link it into the code after the HTML code has been uploaded. This will provide the guest with a clickable link to RSVP for the event into zkipster:
For example:
<a href=”:form_1”>Please RSVP here!</a>
The ":form_1" tag above will be replaced by the real Response Form link that you select (see choosing forms section below). If you need to link more than one Form in an email, keep using :form_1, :form_2, etc. It will then be possible to pick which form each of these links to.
Place the cursor in the HTML code where you wish to link the Form
Go to the 'Form Links' Tab
Select which forms will be linked from the drop down
Add additional forms if needed
For guidance on where to place the Form in the code, make sure your design team has placed the Form automated tags in your HTML file before uploading
Review and Send
Once everything is set, the last page allows zkipster users to review everything before clicking send.
Click the box to confirm the email is ready to send and then click 'Send Emails Now', or schedule your email to go out at a later date.