The templates in the management consist of elements. You can add, edit and remove elements by pressing the element you want in the element menu.
Depending on the type of element, they have different settings but in addition to the specific ones they all share similar basic settings.
You can edit the name of the element under Name. The name of the element is only used to ease working in the editor and it is never shown in the content on the screen.
You can move the element in your preferred position in the template by dragging it. However, if you want to define the location more specifically, use the X and Y fields in the element's settings menu. The X-axis defines the element location horizontally in the template while the Y-axis defines the vertical location. The location is set in pixels so that the upper left corner has a value 0 for both X- and Y-axes. The size of a Full HD template is 1920x1080 pixels for horizontal templates and 1080x1920 pixels for vertical templates.
You can also use the grid next to the fields to position the element in the template.
Define the size of the element in the fields Width and Height in pixels. You can change the size easily also by using the buttons Full size and Half size under the fields, for full template or half the size of the template.
By default, a new element covers the area perfectly, which means that elements lower in the template are not visible through the higher elements. To change this, you can edit the opacity of the elements under Opacity. An element with full opacity has a value 100 (per cent), while a fully transparent one has an opacity value 0. Change the opacity by moving the slider or by typing a value between 0 and 100 in the field.
Rounding the corners
A new element is always created as a rectangle with sharp corners. You can round the corners a little or even reshape the element into an ellipse or a circle by using the Border radius menu. You can define the radius either in pixels or in percentage.
- Define the radius in pixels by typing the value followed by px without a space between, for example 10px.
- Define the radius in percentage by typing the value followed by the per cent sign without a space between, for example 50%.
- Create an ellipse by giving the value 50%. You can create a circle by using the value 50% and making the height and width of the element equal.
A new element is always created horizontally. You can rotate the element under Rotation. Edit the rotation by moving the slider or by writing the degree of rotation in the field.
- Rotate the element clockwise by moving the slider to the right or by typing the degree of rotation as a positive value, for example 45.
- Rotate the element counterclockwise by moving the slider to the left or typing the degree of rotation as a negative value, for example -45.
with 50% radius and 45 degree rotation and
a text element with a -45 degree rotation.
In addition to the basic settings, for the text and rectangle elements you can also define the color that the editors and publishers with lower permissions cannot change.
There are three ways that you can define the color:
- HEX: Define the color by typing in a six-figure HEX-value preceded by the number sign, for example #000000.
- RGB: Define the color by typing in the values for red, green and blue under R, G and B.
- With the sliders: Choose the color, or hue, with the slider on the right by moving it up or down. Then edit the tints, tones and shades by moving the slider freely on the color area on the left.
You can also add custom colors by pressing the field Color.
Settings Specific to Each Element
In addition to the common settings above, each element type has its own features.
You can define the settings for a text element that the slide editors and other editors with similar permissions cannot change. Editors of lower permission can change the text, its size and they can align it.
As a template editor you can also edit the font family and font style. In the editor, there are more than ten different fonts available. Additionally, the editor allows for using the organization's custom font. To start using your organization's font, please contact our support at firstname.lastname@example.org.
You can change the line spacing under Line by typing in the value or by using the arrow keys on the right end of the field. Edit the padding between the borders of the element and the text under Padding by typing in the value.
The features you can edit in an HTML element are the address, presentation and design.
The URL displayed in the element is used to define the webpage shown in the content. In addition to the template editor, other editors and publishers can edit the URL.
If you want to display the webpage as a static image, choose As image. Wait a moment after selecting the option as the editor converts the page into an image.
You can also edit the design of the webpage so that it is better suitable for digital signage displays or to pick parts of the page to show such a menu list by using CSS injections. Add the design under Inject CSS.
In your content, you can display video content directly from YouTube.
Add a YouTube video by using its unique ID. Search for the video you want to display on YouTube and copy the ID visible in the URL address after v=.
Copy and paste the ID in the field ID. Confirm the selection by pressing on the plus sign (+) next the to field or cancel the selection by pressing on the cross (x)
Cloning and removing elements
You can clone the elements in the template and remove elements from it.
Select an element by pressing on it in the template or on its name in the element menu.
If you do not want to edit the element, press on Unselect.
Copy the element with its content and settings by pressing on Clone.
Remove the element from the template by pressing on Remove.
If you want to remove or clone several elements simultaneously, press on Select multiple. After that, press on all the elements you want to edit, or remove the selection for all by pressing on Unselect. After you have selected all the elements you wanted, perform the edit you want.
Saving the template
Finally, save the template by pressing on the check mark on the green background.
Or exit the editor without saving at any time by pressing on the cross on the red background.
The new template appears on the current level on the left under the right resolution and it is immediately available to all the editors and publishers of the level.
Read more about Ordering and hiding elements