The template editor is a powerful feature of Adacado which lets you make adjustments to existing ad themes, or create your own!
Understanding Ad Structure
Before jumping in to the editor, it is helpful to understand how ads are structured in Adacado. The components that make up your ads are Themes, Storyboards, and Templates.
Templates
Templates define the creative look of an ad and what information will be used. A template has a certain size and can include various text and images. The way your ads look is defined by the templates used in your theme.
Some common sizes are 300×250, 300×600, 160×600 and 728×90 (width x height in pixels).
This 300×250 template is used in the “Sienna” theme. It displays the following information:
- Company logo
- Product Image
- Product Title
- Price
- Sale Price
- CTA Button
Storyboards
A storyboard is essentially a single ad of any particular size, and contains one or more templates. The size of the template(s) in a storyboard defines the size of that ad/storyboard.
Template Timing
When multiple templates are used in a storyboard, the result will be an ad whose content changes after a certain number of seconds. You can adjust how long each template will be shown before transitioning to the next, by adjusting the settings found below each template in the Storyboard View.
Each template will be shown for the set number of seconds before transitioning to the next, for a maximum of 30 seconds, at which point the ad will stop rotating the templates. If the ad has been displayed for less than 30 seconds when the final template in the storyboard is shown, then the first template will be shown again, and so on, until 30 seconds has elapsed.
Product Data
If an ad is using product data, then each dynamic template in its storyboard will display a different product.
In the above example, the same template has been added multiple times to the storyboard. When using product data, each dynamic template will display a different product, but elements like the logo and CTA appear in the same position.
It is possible to add a mix of different templates into a storyboard. For example, you could use one template that only contains static widgets, and one that uses product data to create something like the example below. A storyboard like this would first show the static promotional template before transitioning to the product template(s).
Themes
A theme is the collection of all of your ads/storyboards of different sizes. A theme contains one or more storyboards, and each storyboard contains one or more templates.
When you choose a theme from the theme gallery it will contain a number of storyboards with templates, all set up and ready to use.
Note: Not all themes are editable with the template editor. Templates which display multiple products (called multiview) are not editable.
Accessing The Template Editor
There are two ways you can get to the template editor:
1) Through your campaign’s Storyboard View
2) Through the My Templates page
If you want to…
Edit an existing template to be used in a single campaign:
- Edit templates through the Storyboard View. This is the simplest method, however templates created or modified this way will not be accessible outside of the campaign they exist in.
Create or edit a template to be used in multiple campaigns or themes:
- Create your template(s) from the My Templates page. This method is slightly more complex, but it is the only way to re-use the same custom templates in multiple themes or campaigns.
The Storyboard View
In your campaign editor, above your ads you will see a line of icons for each storyboard in your theme. You can view the storyboard for any ad by clicking its icon.
The Storyboard View displays the templates in the current ad, lets you add or remove templates, and adjust the timing and transition settings for each template.
If you don’t need to use your custom templates in other campaigns/themes then you can edit existing templates from this screen. However, if you want to be able to re-use them elsewhere then you will need to create the templates through the My Templates page instead.
Edit an Existing Template
Simply click the “Edit Template” button below the template you want to edit.
In the case where your storyboard contains multiple copies of the same template, editing one template will update the rest.
Add Template(s) to a Storyboard
You can add a new template to a storyboard by clicking an “Add Template” button in the Storyboard View.
A popup will appear which shows you all the available templates belonging to our pre-built themes, as well as any which you have created through the My Templates page. Use the search box if you know the name of the template you want to add. Click a thumbnail to add that template to your storyboard.
Create New Templates Through the Storyboard View
Creating new templates through the Storyboard View is generally not recommended. If you only want to create one template per storyboard then this method may be used. Only a single template will be created, and it will not be available to be added again to this or any other storyboard.
My Templates Page
When you want to use custom templates in multiple campaigns/themes, you can create or edit templates through the My Templates page, which can be found under your account menu, click “My Templates”.
On the My Templates page you will see two sections of templates, “My Templates” contains templates created by you, and “Template Store” shows you all of the templates used in Adacados pre-built themes.
Editing Templates Through the My Templates Page
From the My Templates page you can duplicate and edit any template. Hover over a template thumbnail and press the green “Duplicate” icon to create your copy of a template.
Create New Templates Through the My Templates Page
To create a new template press the blue “Create New Template” button at the top of the My Templates page.
In the popup which appears, first select the “Create” option. Then, enter a name for your template, the business type the template will be used for, and the ad size (format) you want to create. Click the “Save” button to proceed.
Using the Template Editor
The template editor lets you create and customize your own templates, giving you full control over how your ads look.
The center of the Template Editor, with the grid background, is called the canvas. If you are creating a template from scratch then you will start with an empty canvas. If you are editing an existing template then you will see the current components (called widgets) which make up the appearance of the template.
Template Settings
On the upper left part of the screen you will see some general options for the template such as the name, background color, border color, and border width.
If you are editing an existing template, then you will see the text “Copy” at the end of the template name. You can adjust the template name to anything you like, to make it easier to find later on.
Note: We always suggest using a border color that is not white or black for your templates. This helps the ad be easily distinguished from the background of any webpage where they are displayed. People can feel tricked if they click on your ad thinking that it’s part of the webpage and are then redirected from the site they were on. Avoid creating deceptive ads, and therefore increase trust in your brand easily by choosing a border color that is not white or black, we find that a light grey color works well for most ads.
Widgets
Widgets are the individual elements that make up the content of your templates and ads. If you are editing a template then the canvas will already contain widgets in use, otherwise you will need to add the widgets you want to use.
There are three basic types of widgets:
- Text
- Image
- Navigation
Note: If you want to use a widget to display product data, then you will need to set up your campaign’s product data accordingly. Dynamic widgets correspond to the data fields available for mapping when setting up your data feed. For example, if you want to display the price of your product you will need to map the Product Price data field to your data feed as well as use the Product Price widget in your template(s).
Using the Toolbox to Add Widgets
On the left hand side of the template editor is where you will see the toolbox, which allows you to add text and image widgets. Most of the widgets allow you to dynamically display different data fields from your product data. For this reason, you will see different widgets depending on which business type the template is configured for.
Auto
Real Estate
Retail
To add widgets to the template, simply drag it from the toolbox to the canvas.
The following widgets do not come from product data, so you can safely use them whether you are creating static or dynamic ads:
- Text
- Image
- Navigation
- Company Logo
- CTA Button
- CTA Image Button
- Promotion Text
All other widgets not listed above rely on product data, and therefore should only be used when creating dynamic ads.
Move & Resize Widgets
Click on a widget on the canvas to select it. When selected, a dashed box appears, showing the edges of the widget.
Click and drag the widget to move it elsewhere on the canvas. Click any of the little squares shown on the dashed box to resize the widget.
Right click (Control-click on Mac) on a widget to move a widget in front or behind other widgets.
Adjust Widget Settings
When you select a widget on the canvas you will see the settings for that widget appear as a panel on the right side of the screen. You can adjust the widget settings in this panel until you are satisfied with their appearance.
It’s worth noting that you will not see actual data from your campaign in the template editor. For dynamic widgets, which require product data, the values entered in the template editor will be replaced in your campaign. However, in the case that your product data is missing any values, those values entered in the template may be used.
Remove Widgets
Simply click to select a widget, and press the circular red trash button on the top of the settings panel shown on the right side of the screen.
Alignment of Images & Text
Text and image widgets have a number of alignment settings to choose from which change how text and images fill up space. These settings are particularly important when designing templates which display dynamic product data.
Image widgets can be filled with images of different sizes and orientations. When an image doesn’t fit perfectly in the widget space defined in the template, there will be extra white space around the image. The alignment settings let you choose how images fill the available space.
In the screenshot below you can see the alignment controls for a widget; the first group lets you choose the horizontal (left-right) alignment and the second one controls the vertical (up-down) alignment. These settings are found on both text and image widgets.
Example:
With alignment set to left and top, images with a portrait orientation (meaning they are taller than they are wide) will take up the full height and be positioned all the way to the left of the widget area, as shown below.
When images with a landscape orientation (meaning they are wider than they are tall) fill this widget, they will take up the full width and be positioned all the way to the top of the widget area, as shown below.
Maximum Characters For Text
The value you set for Max Chars determines the point at which text will be truncated. Because many of these widgets are meant to display dynamic text from your product data, you can’t always predict how long each text value will be. This can cause some undesired effects, as shown in the image below.
When you set the Max Chars value, then any text which contains more characters than that number, will be truncated and the text will end with three dots (ellipses), to avoid the issue shown in the image above. If you notice that text is being cut off in your ads, lower the value for Max Chars.
Note: Currently, the Max Chars value is not applied within the Template Editor, when you are editing the template the sample text will not be truncated. View the template in your ad to see that the truncation is working.
Saving Templates
Click the “Save” button at the top left of the screen to apply the changes to the template.
You will then be asked to “Proceed” the previous screen (either Storyboard View or My Templates) or to “Continue Editing”.
Updating the Templates in Your Campaign
If you have modified or created templates through the Storyboard View, then you will see that the changes are already applied when you save and return to the storyboard.
In all other scenarios, you will need to re-add the template(s) to your storyboard in order to use the newest version.
In your storyboard, delete any old templates by pressing the “X” icon in the top right corner of the template. Then click the “Add Template” button and find the template you have been working on, as per the instructions listed above in the “Add Template(s) to a Storyboard” section of this support page.
If you’re still having trouble or have questions, feel free to reach out to us anytime at support@adacado.com
