Publisher

Post Reply
FFAdmin
Site Admin
Posts: 12
Joined: Wed Jan 15, 2020 2:21 am

Publisher is Entertain’s very own easy to use built-in content creator that allows you to design attractive content for your screen.

Once you create a “template” (or a design) on Publisher, you can make changes to the same, save the template, and watch those changes go live.


Getting to Publisher


On your Dashboard, click on Publisher in the Menu Bar, and a new tab will open up.


PB 1.JPG
PB 1.JPG (87.14 KiB) Viewed 1741 times


The Publisher Home Page that opens in a new tab will display all the templates created so far (if any). You can navigate this page easily using a different view and opting for Grid or List View, and choose the number of entries (existing templates) you’d like to view per page.

PB 2.PNG
PB 2.PNG (84.42 KiB) Viewed 1741 times


Further, you can use the Search bar to find a template and use the Page numbers below to traverse through the pages.



Creating a new template


Click on the New Template option on the top right of your Publisher home page.

In the pop up, give a name to your template and choose your preferred orientation: Landscape (aspect ratio 16:9) or Portrait (aspect ratio 9:16).

PB 3.PNG
PB 3.PNG (151.7 KiB) Viewed 1741 times

You can now choose a template you would like to use (If you wish to work on a blank template, pick any option here and you can clear the canvas at the next step).
Hit Create. Once you click on Create, this template will automatically get saved to your list of templates.



Template: Type 1
Working with an existing template



Use an existing template when the layout of the design you envision is similar to the template and you could just edit a few simple details to get a good end result.


A. Know your tools

The tool bar contains a range of essential options.

PB 4.PNG
PB 4.PNG (178.38 KiB) Viewed 1741 times

From left to right, these include


Save:
Click on this to save your file.


:!: IMPORTANT: Publisher does not Autosave your work in order to prevent templates from being unintentionally downloaded to your player. Pressing this Save option at regular intervals is essential to make sure you don’t lose the work you have put in to your design.

View Widgets
Clicking on this will display the widget menu (container, text, columns and other media elements) on the right hand side.

Preview
Opens up a Preview window for you to see how your template is looking on the front end

Undo
Undoes your last action. There are ____ actions you can undo.

Redo
Redoes an action that you have undone

Select Container
When you have many elements on your template and cannot access the container of an element easily, this option helps you select the container so you can edit/adjust the container as necessary.

:!: Note: If nothing is selected in your template or if you click on the blank grey area of your screen and then choose Select Container, this will select the entire template. This makes it easy to make changes to the entire template such as changing the background colour, when you have multiple cells (containers) preventing you from accessing the background easily.

Duplicate widget
You can select any widget (text, video, columns or other media type) and hit this button to duplicate the same.

Clear canvas
Clears the canvas completely. Clicking on this will lead to a confirmation prompt to prevent accidental deleting.

PB 5.PNG
PB 5.PNG (228.49 KiB) Viewed 1741 times

Bring to front
Brings selected element to the front of another in case of overlap

Stylise
Clicking on this will present the Styling menu including layout, colours, font, border designs, and more.


More options

PB 6.PNG
PB 6.PNG (111.58 KiB) Viewed 1741 times

  • You can click on the pencil sign next to the template name to rename your template.
  • To display widgets, click on the gridlike icon on the right hand corner.
  • To Zoom in/out of your canvas, use the + and – icons on the bottom left.


B. Adapt your existing template


Changing an existing image/s

> Double click on the template’s existing image or slideshow.

PB 7.PNG
PB 7.PNG (184.33 KiB) Viewed 1741 times

> The resulting pop up window will allow you to upload files from your computer or choose existing files in your Publisher library (if any).
> You can click on existing images to remove them from the slideshow/from the template.
> Choose from Available Images the images you want.
> For slideshows, the default time interval is 2 seconds. You can adjust this to show each image for more/less time before it moves on to the next one.
> Click on Apply Changes.


Changing background colour


Click on a plain portion of the template (not within a cell).

PB 8.PNG
PB 8.PNG (117.02 KiB) Viewed 1741 times

This will select the entire template (note the blue outline in the image) and display the background options on the side.

> Click on the Background colour panel and select a colour.
> You can adjust the colour transparency using the adjustable slider below. By default, transparency is 0%.
> Click on OK.

PB 9.PNG
PB 9.PNG (125.34 KiB) Viewed 1741 times

> You can also have an image as a background. Click on the + sign on the Background panel (below the Background Colour panel).

PB 10.PNG
PB 10.PNG (132.05 KiB) Viewed 1741 times

You can click Images and proceed to select any image of your choice or upload a new one.

PB 11.png
PB 11.png (116.96 KiB) Viewed 1741 times

Click on the image, close the window, and use the controls on the right hand side to determine position.

PB 12.png
PB 12.png (14.96 KiB) Viewed 1741 times

:!: Note that an image that does not cover the full background size will appear multiple times to cover the entire base. You can also, if you wish, have different background colours for different cells following the same process.



Changing Text

Double click on the text you’d like to change, and the cursor will appear along with some formatting options.

PB 13.png
PB 13.png (219.22 KiB) Viewed 1740 times

Type the desired text and use the mini menu above to make formatting changes.

For more formatting changes, use the menu bar on the right that will appear as soon as you are editing text.

PB 14.png
PB 14.png (157.79 KiB) Viewed 1740 times


Deleting and resizing containers

The light dotted lines on your template indicate the cells, or “containers” that carry elements such as text and media.

You can delete or resize existing containers. Click on the container you wish to adjust. Note: it may be easier to click on the element and hit the Select Container option as discussed above.
Blue borders will appear around your container indicating it has been selected.

PB 15.png
PB 15.png (26.63 KiB) Viewed 1740 times

To delete the container, just hit Delete on your keyboard.
To resize sideways, click on the white rectangle and drag the boundary to the left or right.

PB 16.png
PB 16.png (16.02 KiB) Viewed 1740 times

To resize downwards, hit the base of the container and the rectangle will appear on the bottom.

PB 17.png
PB 17.png (31.09 KiB) Viewed 1740 times

You can now use this to drag the container in a vertical direction.

PB 18.png
PB 18.png (26.45 KiB) Viewed 1740 times


Template: Type 2
Working on a Clear Canvas



Use a clear canvas when you think your envisioned design could be more easily created by flexibly creating your own layout, instead of using an existing template.


A. Know your tools

The tool bar contains a range of essential options.

PB 4.PNG
PB 4.PNG (178.38 KiB) Viewed 1741 times

From left to right, these include


Save:
Click on this to save your file.


:!: IMPORTANT: Publisher does not Autosave your work in order to prevent templates from being unintentionally downloaded to your player. Pressing this Save option at regular intervals is essential to make sure you don’t lose the work you have put in to your design.

View Widgets
Clicking on this will display the widget menu (container, text, columns and other media elements) on the right hand side.

Preview
Opens up a Preview window for you to see how your template is looking on the front end

Undo
Undoes your last action. There are ____ actions you can undo.

Redo
Redoes an action that you have undone

Select Container
When you have many elements on your template and cannot access the container of an element easily, this option helps you select the container so you can edit/adjust the container as necessary.

:!: Note: If nothing is selected in your template or if you click on the blank grey area of your screen and then choose Select Container, this will select the entire template. This makes it easy to make changes to the entire template such as changing the background colour, when you have multiple cells (containers) preventing you from accessing the background easily.

Duplicate widget
You can select any widget (text, video, columns or other media type) and hit this button to duplicate the same.

Clear canvas
Clears the canvas completely. Clicking on this will lead to a confirmation prompt to prevent accidental deleting.

PB 5.PNG
PB 5.PNG (228.49 KiB) Viewed 1741 times

Bring to front
Brings selected element to the front of another in case of overlap

Stylise
Clicking on this will present the Styling menu including layout, colours, font, border designs, and more.


More options

PB 6.PNG
PB 6.PNG (111.58 KiB) Viewed 1741 times

  • You can click on the pencil sign next to the template name to rename your template.
  • To display widgets, click on the gridlike icon on the right hand corner.
  • To Zoom in/out of your canvas, use the + and – icons on the bottom left.


B. Building a template from scratch


First, clear your canvas using the Clear Canvas option shown above.

PB 19.png
PB 19.png (34.56 KiB) Viewed 1738 times


Change background colour

Click on your canvas and Style options will pop up on the right.

PB 20.png
PB 20.png (87.8 KiB) Viewed 1738 times

> Click on the Background colour panel and select a colour.
> You can adjust the colour transparency using the adjustable slider below. By default, transparency is 0%.
> Click on OK.



> You can also have an image as a background. Click on the + sign on the Background panel (below the Background Colour panel).

PB 21.PNG
PB 21.PNG (31.23 KiB) Viewed 1738 times

You can click Images and proceed to select any image of your choice or upload a new one.

PB 22.png
PB 22.png (116.96 KiB) Viewed 1738 times

Click on the image, close the window, and use these controls on the right to determine position.

PB 23.png
PB 23.png (14.96 KiB) Viewed 1738 times


:!: Note that an image that does not cover the full background size will appear multiple times to cover the entire base.

For this example, we will leave the background as white. Click on the grid (WIdget) icon to display widgets again.



Containers and Columns


Containers form the basis of Publisher. These “cells” allow you to layout and resize elements of your template with more flexibility. It is recommended that before using any media widget (text, image, slideshow or video), you first bring a container to the canvas. Then put the desired widget in this container.

Columns are also a type of container. You need not put columns inside containers; instead use columns and then place elements you want inside them.

To bring anything from your widget panel to your canvas, click on the desired item and drag it.

PB 24.png
PB 24.png (38.59 KiB) Viewed 1738 times


Writing Text


Drag a text box into your container and it will look something like the below. Formatting options will reflect on the right.

PB 25.png
PB 25.png (47.17 KiB) Viewed 1738 times

You can double click on “Write your text here” and start to type your text and format as desired.


PB 26.png
PB 26.png (5.6 KiB) Viewed 1738 times


Using Borders


You can stylise your cells by giving them borders. Click on the container you wish to give a border to, and review the styling options on the right.

PB 27.png
PB 27.png (14.72 KiB) Viewed 1738 times

Adjust these options to create your border.

PB 28.png
PB 28.png (46 KiB) Viewed 1738 times


Deleting and resizing containers


You can delete or resize containers. Click on the container you wish to adjust. Note: it may be easier to click on the element inside and hit the Select Container option. Blue borders will appear around your container indicating it has been selected.

To delete a container, just hit Delete on your keyboard.

To resize downwards, hit the base of the container and the rectangle will appear on the bottom.

PB 29.png
PB 29.png (3.66 KiB) Viewed 1738 times

You can now use this to drag the container in a vertical direction.

You can resize sideways IF you have multiple containers placed horizontally next to each other. A single container will take the entire width of the canvas, but elements inside it can be scaled and positioned as desired.

Below is an example of adjusting container width (there are two columns here using the 2 Columns widget).

PB 30.png
PB 30.png (1.91 KiB) Viewed 1738 times

Click on the side of the container and the white rectangle will appear on the side border. You can now use this to drag the container left or right.



Columns

Columns are a type of container that allow you to have multiple containers next to each other.

Drag 2 Columns or 3 Columns from the widget panel and place on canvas. You can then add different elements inside each column.

PB 31.png
PB 31.png (8.71 KiB) Viewed 1738 times


Adjust background colour of a cell

You know how to change the background colour of your entire template. However, each cell can also have its individual background colour.

Click on the cell of your choice (let’s take the left column from the above image) and styling options will appear on the right. Pick the colour and transparency and hit OK. You can also choose a background image as shown above.

PB 32.png
PB 32.png (109.15 KiB) Viewed 1738 times


Adding an image

Drag the Image widget from your widget panel and place it inside your desired cell. This pop up dialog box will prompt you to select an image from your Publisher library or upload an image from your computer.

PB 33.png
PB 33.png (116.96 KiB) Viewed 1738 times

Choose the image you want and hit OK.

PB 34.png
PB 34.png (82.4 KiB) Viewed 1738 times

Clicking on the image will show you the border controls all around it. Now you may scale or reposition it, and you also can use any of the options in the right hand menu to stylise and position this image the way you want.


You can do anything with the second cell including showing another image, video, slideshow, or text. Below is an example where the text widget has been dragged to the cell to write text, and the background colour has been changed.


PB 35.png
PB 35.png (45.56 KiB) Viewed 1738 times


Slideshow


A slideshow will play a sequence of images on a loop. This is very good to have some dynamism in your video without uploading a video, and it is a great way to display an array of different products/messages in limited space.

Drag a container/columns to the canvas and the Slideshow widget to your desired cell. In the dialog box that pops up, you can upload images from your computer or use existing library images.

PB 36.png
PB 36.png (173.61 KiB) Viewed 1738 times

All available images, once available, will appear in the “Available images” section.

Click on the images you want in your slideshow and they will appear in “Slideshow images” If you change your mind about an image, click on the image in “slideshow images” and it will be removed from the slideshow.

Use the Interval option under Slideshow Settings to determine how much of a time interval you want between each image. The default time interval is 2 seconds. Adjust this as necessary and hit Apply Changes.


The slideshow will appear on your canvas.

PB 37.png
PB 37.png (117.16 KiB) Viewed 1738 times

Adjust and stylise as desired.

PB 38.png
PB 38.png (222.07 KiB) Viewed 1738 times

Adding a Video

Videos can be played on Publisher templates just like any other media.

Place your container in your canvas and the Video widget inside it. From the dialog box that pops up, choose a video from your existing media files or upload one from your computer. Double click on the desired video and it will appear on your canvas.


PB 39.PNG
PB 39.PNG (78.37 KiB) Viewed 1736 times


Position and stylise this as desired.


PB 40.PNG
PB 40.PNG (178.17 KiB) Viewed 1736 times


The best way to familiarise yourself with Publisher is to learn by doing. Write to the Entertain team in the Ask a Question topic for any issues that persist!
Post Reply