HTML code editor
Build your email content from scratch with HTML
Last updated
Build your email content from scratch with HTML
Last updated
If you are proficient in HTML and prefer to write your own code, you can create emails using the Pushwoosh HTML code editor.
Don't have coding skills? Use the Drag & drop editor to effortlessly create email content, zero coding skills required. Learn more
Before you start creating email content, it's essential to properly set up your email within the email editor you choose. This involves configuring languages, specifying the subject line, providing sender information, and more. Learn how to do it
To begin creating email content, paste your HTML code into the HTML tab. The editor provides real-time email previews as you are working on them.
Alternatively, you can upload an HTML file by clicking on Upload HTML File located in the bottom panel.
To add a personalized touch to your emails, use custom tags. For this:
Click on the Tag icon located at the bottom of the editor.
Select the desired Tag, and its modifier, and provide a default value if needed.
Click Insert to include the custom tag in your email content.
To include an emoji in your email, click the Emoji icon located at the bottom of the editor.
Localization empowers you to deliver personalized experiences to users in different languages.
In the HTML code editor, you can use localization by defining a default language and adding multiple language options. For instance, you can set a default message in English and then include translations in German and Spanish, ensuring that your email content adapts to each user's language preferences.
Below is an example of how to structure your localization data with English as the Default language and German and Spanish translations.
Once your localization data is structured and added in the Localization Tab of the editor, incorporate it into your HTML content using placeholders. The placeholders dynamically insert localized text into your content, based on the user's language preference. Here's how to implement it in your HTML
Consider this scenario: you're advertising a limited-time discount on coffee blends. By using the localization structure mentioned above, you can communicate your promotional message effectively to users speaking different languages. Your HTML code for the promotion might look like this:
With this setup, if a user's language is German, they'll see the email in German; users who opted to receive emails in English will see it in English, and those who opted to receive it in Spanish will receive it in Spanish. This ensures that all recipients get your message in their preferred language.
Pushwoosh allows you to combine email content by inserting one piece of email content into another. This makes it easy to reuse elements like headers, footers, or specific content blocks across different emails.
For example, if you have Email content A (a header) and Email content B (a newsletter), you can insert Email content A into Email content B without manually copying content each time.
To insert one piece of content into another, use the following syntax:
{% email_content "AAAAA-BBBBB" %}
Where "AAAAA-BBBBB" is the ID of the email content you want to insert. You can find the ID located beneath the content name in your list of email content.
Important:
You can insert content recursively, meaning one content block can include another, up to a maximum depth of 3 levels. For example:
Content A can insert Content B.
Content B can insert Content C.
However, Content C cannot insert another block.
Cyclical insertions (e.g., where Content A inserts Content B and Content B tries to insert Content A) are not allowed and will result in an error.
Let’s say you have two pieces of content:
Header content (ID: "AAAAA-BBBBB") with a predefined header design.
Newsletter content, where you want to include the header.
To insert the header into the newsletter, you would use the following:
{% email_content "AAAAA-BBBBB" %}
This allows you to easily reuse a predefined header in multiple email campaigns, saving time and ensuring consistency across your emails.
Be sure to include an unsubscribe link in your email to provide recipients with an option to easily opt out of future communications, in compliance with regulations, and to respect their preferences regarding receiving emails.
Add the Unsubscribe link to your email as follows:
The attribute value %%PW_EMAIL_UNSUBSCRIBE%% will be replaced with the Pushwoosh Unsubscribe link at the moment you send the email message. When recipients follow the link, they opt out from your emails and are accounted in unsubscribe rate for that particular email message in Message History.
Please be aware that if you use your own Unsubscribe link instead of the Pushwoosh one, users opted out by your own method are not accounted in the unsubscribe rate presented in Message History. That means the number of unsubscribed users you'll see in stats of a particular email in your Message History will include only those users who followed the Pushwoosh default link and not those who were unsubscribed by your custom link.
To let you deliver important emails to your customers, we don't delete the unsubscribed users from your user base. For users who followed the Unsubscribed link from your emails, the Unsubscribed Emails default tag is set with the 'true' value.
Please consider creating a Segment for users who did not unsubscribe (the ones with the 'false' value of the Unsubscribed Emails tag) to continue messaging them. To avoid complaints, do not email users who unsubscribed from your messages.
After you have finished creating your email, click on the Save button located at the top of the editor.
In the new window that appears, give your email a clear name, which could be the same as your Subject line. Also, create a label to help you easily find it in your list of emails.
If you haven't set up sender details yet, make sure to do that as well. Then, click Save.
Now that your email content is ready, it can be used in email campaigns. Learn more
Before sending your email campaign, you can send a test email to preview how the content will appear in recipients' inboxes. This allows you to review the layout, content, and any personalized elements to ensure accuracy before finalizing the campaign. If needed, adjust the content based on the test results.
Note: If KYC (Know Your Customer) is not completed, you can still send test emails by verifying a test email address. To do this, go to the Test Devices section, add the email address you want to use for testing, and complete the verification process.
To send a test email, click Test email in the email editor.
In the window that opens:
In the Email address field, enter the email address where you want to receive the test email.
If KYC has not been completed, you will need to select a verified email address from the list of test addresses instead of entering an email.
If your email contains dynamic content (placeholders for personalized data), add sample values for testing purposes.
For example:
Age (integer): Enter a number to represent the age placeholder (e.g., 21).
FirstName (string): Enter a sample first name (e.g., David).
These values will replace actual recipient data in the test email, allowing you to verify how the dynamic content appears.
Once you've filled in the necessary details, click Send test email to send the test message to the provided email address.
