Last Updated: 10/8/2018.
In this article, we'll show you how to create an Invite Banner using custom HTML in the template builder and how to place your Partner Merge Tags using the HTML.
Before you start
Before building your Invite Banner in Feathr you will need either the image file (.png or .jpeg) or a URL link to where the image of your banner is hosted.
Create a banner template
Create a new template to edit. See this article for the exact step-by-step process of creating a new template.
Set the banner size
Select the banner template that is your desired size from the Default Folder. You can set your banner as any accepted ad size found here.
Navigating to the HTML code editor
- Click on the HTML box to open the code editor on the right. It will be located where you selected the 'HTML' content type.
Customize the HTML
Once you found the editor, you'll need to customize the HTML to make your banner look just right. You can find a breakdown of each of the elements in the code here.
Add your banner image file
If you have the URL where the banner image is hosted skip ahead to 'Add your banner image URL'. If you have the image file of your banner ad follow these steps below:
- Add an 'Image' content type
- Upload the image to the File Manager or select an image you've previously imported.
Find your banner image URL
- Click the Image to open the image editor on the right
- Scroll to find the image URL. Copy the URL
Add your banner image URL
- Click into the HTML content to re-open the code editor
- Find the line
background-image: url('URL here');
- Highlight the text URL here and replace with the image URL you just copied
- Adjust the size in the HTML to reflect the final size of you banner (the dimensions you set at the top of the template). The width and height are found in the first line of the code block
- You can move the Partner merge variable by adjusting the values for
- You can also just the merge variable @[email protected] to any other text that is appropriate for your banner
Remove the 'Image' content section
- Click the image you added through the image content type
- Delete the image by clicking the little trashcan icon
Don't forget to save your template! You're now ready to add it to an Invite Campaign.
Why should I create my Invite Banner with HTML instead of using the template builder?
We recommend creating your Invite Banner with HTML because we have found that it is easier to customize than with the template editor itself. The template editor was not originally built for building banners so some aspects of the display reflect that.