Most frequently asked HTML questions
- How do I remove an underline from a hyperlink?
- How do I change my font color?
- How do I align my images in a row?
- What do I need to know about using my own, custom HTML email?
- How do I personalize my email to display my contact’s first name using HTML?
- How do I add custom fields in the body of my email using HTML?
- How do I make a custom field a hyperlink using its URL that’s also a custom field?
- How do I send the same email with unique content for each recipient?
- How do I change the color of my bulletpoints?
- Why am I experiencing formatting issues?
- How do I remove the margin Gmail adds to my email?
How do I remove an underline from a hyperlink?
- Click the Pencil icon for the section you’d like to insert your hyperlink
- Insert the text or URL
- Highlight the text
- Select the Link icon
- Enter in the URL (be sure to copy over the pre-populated http:// if you’ve already copied that portion
- Click Update
- Select the blue HTML button at the bottom right of the floating toolbar
- Locate the URL associated to the text. In the example below, https://www.benchmarkemail.com/ExtPricing.
<a href="https://www.benchmarkemail.com/ExtPricing">Benchmark Email Pricing Plans</a>
- Immediately following the closing quote, enter in the following code
style="text-decoration:none;"
like so:
<a href="https://www.benchmarkemail.com/ExtPricing" style="text-decoration:none!important;">Benchmark Email Pricing Plans</a>
- Click Save & Close
How do I change my font color?
- Click the Pencil icon in the section containing the text you’d like to change the color of
- Click on the blue HTML button located at the bottom right of the floating toolbar
- Locate the first word of the respective line and edit the color number prior to it
In the below example, I would replace #fc6462 with my desired color number or name to change the text color to “What extra features does Benchmark Email offer?”
<span style="color:#fc6462;">What extra features does Benchmark Email offer?</span>
How do I align my images in a row?
- Click on the Pencil icon of the section you’d like to place your images
- Click on the blue HTML button located on the bottom right of the floating toolbar
- Copy the code below and paste it over the existing code in the HTML window (Please note that this action will replace all existing content within the section):
<table width="100%">
<tr>
<td> image 1 </td>
<td> image 2 </td>
<td> image 3 </td>
</tr>
</table>
You should have as many rows of <td> image # </td>
as you do images. Since there are 3 lines of this code above, what has been provided is preparing you to insert 3 images. Add and remove accordingly.
- Click Save & Close
- You should see, the text Image 1, Image 2 and Image 3 in the section
- Highlight Image 1
- Click on the Image icon under Insert Additional Elements
- Select your desired image within the Image Gallery window
- Click Insert
- Resize the image as needed (Important note: Template width maximum is 600 pixels)
- Repeat steps 7 through 11 for Image 2 and Image 3
- Select each image and select the Align center button from the floating toolbar
- Click Save
What do I need to know about using my own, custom HTML email?
- If you’d like to insert content in a tabular format, this should be done in tables rather than spacing in between 2 columns.
- Many email clients will ignore CSS unless it’s used Inline. Because of this, we recommend that you code your emails using in-line CSS only.
- Avoid copying text and/or images from an external source such as MS Word and pasting it directly into Benchmark Email’s Editor. Instead, paste it into Notepad first, and then transfer it from Notepad into Editor.
- Your email content should consist of 60% text and 40% images (best practices).
- Avoid nesting unwanted duplicate tags to the content.
- Avoid using scripting in the code.
- Avoid the use of <p> tags. Instead, use <br> tags as <p> tags may result in spacing issues when viewing from various email clients.
- Avoid using background images in your email as most email clients block them for security purposes.
- Design your emails to meet the 600 x 800 standard.
How do I personalize my email to display my contact’s first name using HTML?
If you’re experiencing difficulties personalizing your email using our Tools (https://blog.benchmarkemail.com//detail/benchmark-email-new-feature-add-personal-greetings), an alternative solution would be via HTML:
- Click the Pencil icon in the section you’d like to start your greeting
- Highlight and delete the placeholder text
- Insert your greeting: “Hi,” “Dear,” “Greetings,” etc.
- Click on the blue HTML button located at the bottom right of the floating toolbar
- Locate your greeting
- Copy and paste the following code one space after your greeting:
[contact_attribute:firstname]
- Click Save & Close
- The code will be visible within the section but will display accordingly (send yourself a Test Email to confirm)
- Place a comma, “,” after
[contact_attribute:firstname]
- Enter the remaining text for that paragraph
- Click Save
How do I add custom fields in the body of my email using HTML?
If you’re experiencing difficulties personalizing/adding custom fields to your email using our Personalize Tool , an alternative solution would be via HTML:
- Click the Pencil icon in the section you’re planning on inserting the custom field
- Highlight and delete the placeholder text
- Insert your desired text
- Click on the blue HTML button located at the bottom right of the floating toolbar
- Locate the text prior to where you’d like the custom field to be entered into
- Copy and paste the following code one space after this text (the red text is the variable):
[contact_attribute:FIELDLABEL]
- Replace “FIELDLABEL” in
[contact_attribute:FIELDLABEL]
with your desired field label (i.e. “Job title”,” “Business Phone,””Extra5,” etc.)
- Click Save & Close
- The code will be visible within the section but will display accordingly (send yourself a Test Email to confirm)
- Place a comma after
[contact_attribute:firstname]
- Enter the remaining text for that paragraph
- Click Save
How do I make a custom field a hyperlink using its URL that’s also a custom field?
- Click the Pencil icon in the section you’ve inserted the custom field
- Enter in desired text preceding the custom field
- Click on the blue HTML button located at the bottom right of the floating toolbar
- Locate the last word in the text you inserted
- Put one space in between this last word and the following code (the red text are the variables):
<a href="[contact_attribute:field name]" target="_blank"> [contact_attribute:field name] </a>
- Replace the first “field name” in
<a href="[contact_attribute:field name]"
with the field name in which the custom URL resides
- Replace the second “field name” in
[contact_attribute:field name]</a>
with the field name in which the custom text resides.
How do I send the same email with unique content for each recipient?
Let’s say you wanted to send an email to all of your subscribers to communicate a meeting location that varies depending on their city. Conditional Formatting allows you to do just this.
Using the code below, you can email a subscriber from Los Angeles to meet at the LA Convention Center while a subscriber from Tucson to meet at the Tucson Convention Center, all within the same email.
Insert the codes below right into Editor (red text are the variables):
[if:fieldname=value]
This will evaluate the value of the field and proceed if there is a match. The field refers to the name of the column.
[elseif:fieldname=value]
This will provide the alternative content if the given condition is satisfied.
[else]
This will provide an alternative content, in case the above conditions fail.
[endif]
This is to mark the end of the conditional statements.
*The following examples build off one another
Below are instructions on how to insert a unique message for recipients from California (“CA” in the State column in their contact list). However, you’re able to apply the codes to any one of the 27 fields.
- In Step 4 Editor, click on the Pencil icon for the section you’d like to insert the unique content
- Enter in the following code: [if:State=CA]
- In the next line, enter in your desired message. For example: We have a meeting on February 24th
- In the next line, enter in the following code: [endif]
Here’s how it should appear in the section:
Here’s how it should appear in the HTML window:
Let’s say you want to add a different message for contacts from Texas in addition to the message to California recipients. Then, you would follow the instructions below (steps 4 and 5 are new):
- In Step 4 Editor, click on the Pencil icon for the section you’d like to insert the unique content
- Enter in the following code: [if:State=CA]
- In the next line, enter in your desired message. For example: We have a meeting on February 24th
- In the next line, enter in the following code: [elseif:State=TX]
- In the next line, enter in your desired message. For example: We have a meeting on February 28th
- In the next line, enter in the following code: [endif]
Here’s how it should appear in the section:
Here’s how it should appear in the HTML window:
If you want to add an additional message for recipients who are from California (based on the State column in their contact list) and another, different message for all others, follow the instructions below:
- In Step 4 Editor, click on the Pencil icon for the section you’d like to insert the unique content
- Enter in the following code: [if:State=CA]
- In the next line, enter in your desired message. For example: We have a meeting on February 24th
- In the next line, enter in the following code: [else]
- In the next line, enter in your desired message. For example: We have a meeting on February 28th
- In the next line, enter in the following code: [endif]
Here’s how it should appear in the section:
Here’s how it should appear in the HTML window:
If you want to add an additional message for recipients who are from California, a separate one for contacts from Texas (based on the State column in their contact list) and a separate one for all others, follow the instructions below:
- In Step 4 Editor, click on the Pencil icon for the section you’d like to insert the unique content
- Enter in the following code: [if:State=CA]
- In the next line, enter in your desired message. For example: We have a meeting on February 24th
- In the next line, enter in the following code: [elseif:State=TX]
- In the next line, enter in your desired message. For example: We have a meeting on February 28th
- In the next line, enter in the following code: [else]
- In the next line, enter in your desired message. For example: We have no meetings this month
- In the next line, enter in the following code: [endif]
Here’s how it should appear in the section:
Here’s how it should appear in the HTML window:
How do I change the color of my bulletpoints?
- Click the Pencil icon in the section you’d like to add your bulletpointed lines
- Enter in your desired text including the lines you’ll be adding bulletpoints to
- Highlight the lines of text you’d like to add bulletpoints to
- From the floating toolbar, click the Bulletpoint icon
- Click the blue HTML button at the bottom right of the floating toolbar
- Place your cursor one space after the first line beginning with <li and copy and paste the following code (the red text are the variables):
style="color:color# or name;"
- Replace “color # or name” in
style="color:color# or name;"
with your desired color # or name (remove the “#” sign, in this case)
- Repeat Step 6 for each line beginning with
<li
- Click Save & Close
Why am I experiencing formatting issues?
If you’re finding that there’s extra line breaks, not enough, or extra space in between text, it is most likely because you have copied and pasted text from another source, such as Word.
If you’re reading this before having transferred over your text, visit the following page to learn how to properly copy and paste text from any source: https://kb.benchmarkemail.com/en/how-do-i-copy-and-paste-text-from-microsoft-word
If you have already copied and pasted, you can still follow the instructions above but only after you’ve selected the Clear Style button .
If you prefer to rectify the disparities using HTML, follow the instructions below:
- Click the Pencil icon for the section you’ve transferred the text. As you can see in the example below, there is excess space between paragraphs:
- Select the blue HTML button located at the bottom right of the floating toolbar
- You’ll most likely find <p> tags if you’ve copied and pasted from Word:
Remove the <p> tag in the beginning of each line and replace the closing </p> tag with <br /> for a single space and <br /><br /> for double space. The example below illustrates a double-space between each line:
Now, the excess space has been removed and each paragraph is double-spaced accordingly:
How do I remove the margin Gmail adds to my email?
- In your Benchmark Email account, locate the section that Gmail is adding the margin to
- Click the Pencil icon
- Click on the blue HTML button located at the bottom right of the floating toolbar
- Locate the image URL
- Place the following code in the <img tag (preceding the image URL): style=”display: block;”
- Click Save & Close