You can customize your signatures with HTML code, enabling you to add a second banner, awards, logos, badges, and more. Adding custom HTML code to your signature opens up many new possibilities.
To add custom HTML code to your signature, follow these simple steps:
Step 1.
In the Signature editor, go to the Add-ons tab.
Step 2.
Choose the Custom HTML from the list of available add-ons.
Step 3.
Copy your custom HTML code and paste it into the Custom HTML box.
Here are some ideas that you can use:
1. Second banner:
To add a second banner image, you only have to host an image anywhere on the web and get a direct URL to the image. For example:
https://i.imgur.com/yhSqZKQ.png
Now we need to include the link into the line of HTML code. Here is how to add an image with HTML code:
<img src="Your_Image_URL"/>
For example:
<img src="https://i.imgur.com/yhSqZKQ.png">
You can also set the size of the image for it to meet your design requirements:
<img src="https://i.imgur.com/yhSqZKQ.png" width="300" />
It is also possible to add a hyperlink to the image. Here is how to add a hyperlink:
<a href="Hyperlink_URL" target="_blank"><img src="Your_Image_URL" width="300" /></a>
For example:
<a href="https://mysignature.io/" target="_blank"><img src="https://i.imgur.com/yhSqZKQ.png" width="300" /></a>
2. Include multiple images on one line (awards, badges, etc.)
This approach has multiple use cases:
- You can include multiple badges or awards at the bottom of your signature and link them to the awards page.
- Request to rate your services by adding "stars" or "emoji" images.
You will also need to use the same approach from the first paragraph for this approach if you don't mind. The only difference is that you will have multiple images added by a code. So, we take the example of the hyperlinked image from the previous paragraph and combine them into one section with <p> tag.
You can replace "dummy" URLs with your own and modify the "margin-left" parameter to increase or decrease the margin between the images and the "width" parameter to increase or decrease image sizes.
Three images example:
<p><a href="Hyperlink_URL" target="_blank"><img src="Your_Image_URL" width="100" /></a><a href="Hyperlink_URL" target="_blank"><img style="; margin-left: 10px;" src="Your_Image_URL" width="100" /></a><a href="Hyperlink_URL" target="_blank"><img style="margin-left: 10px;" src="Your_Image_URL" width="100" /></a></p>
If you need any help setting up custom HTML code, please contact our Support Team via live chat or email. We are happy to help!