¶ Configuring Frontend
Tips:
- a valid URL starts with http:// or https://
- For the default web frontend the configuration shall be named “default”;
- For the default mobile frontend, the configuration shall be named “mobile”.
- Click the “Frontend Settings” tab in the navigation menu (left of the screen);
- In the content toolbar click the “Create” button (top right corner of the screen) to create a new frontend setting;
- In the “GENERAL” tab fill in the required information (Name);
- Name: enter the name of frontend settings;
- Page title: enter the name that will appear on the frontend page (highlighted in the figure below);
- Logo (URL): enter the URL for the logo image (highlighted in the figure below);
- Favicon (URL): enter the URL for the Favicon image (highlighted in the figure below).
- [OPTIONAL] In the "COLORS" tab choose the colors for the frontend elements;
- Background: choose the color for the background;
- Title: choose the color for the title (highlighted in the figure below, section d);
- Primary text: choose the color for the primary text (highlighted in the figure below, section d);
- Secondary text: choose the color for the secondary text (highlighted in the figure below);
- Active action: choose the color for the active action. They are the colors of the edges of the buttons and their background when hovering over the mouse (example below);
- Inactive Action: choose the color for the inactive action. They are the text colors of the management functions for the customer who is logged in to the front end (example below).
Note: clicking on any field will show a color picker (figure below) for choosing the intended color. One can choose by clicking on a color or by entering the value corresponding to the color in Hexadecimal, RGB or HSL (more information about colors can be found here).
- [OPTIONAL] In the “CSS” tab you can override the entire look and feel of web frontends with CSS;
- CSS: write/paste here the CSS document content. For more information on CSS click here.
- [OPTIONAL] In the “JSS” tab you can override the entire look and feel of mobile frontends with JSS;
- JSS: write/paste here the JSS document content. For more information on JSS click here.
- In the “HOME PAGE” tab you can configure the elements that will be displayed in the frontend homepage and their behavior;
- Components:
- Highlight carousel: shows videos highlighted on the home page of the frontend with the default poster as background (figure below);
- Content sliders: shows the available videos in a carousel with the default thumbnail as background (figure below).
- Style:
- Pure on-demand: highlight carousel is set to auto swipe to the next item every 5 seconds;
- Sequential play: highlight carousel is set to automatically play each video until it ends and then moves to the next item.
- Components:
- [OPTIONAL] in the "ITEM PAGE" tab you can configure the elements that will be displayed in the frontend Item page and their behavior
- Use default poster: when selected, it will use the default poster of the video;
- Poster index: when the "Use default Poster" field is unchecked you can enter which of the posters, configured in the item (VOD or Live Stream), will be shown as the background of that item page on the frontend. Enter the index number of the poster to use (integer starting at 1);
- Show related content: when selected, will allow the configuration of related content to be displayed on the frontend, in a line below the selected video;
- Content in the same collection: will show as related content the videos inserted in the same collection as the selected item;
- Content with matching categories: will show as related content videos that feature at least one of the categories of the selected item.
- [OPTIONAL] in the “AUDIENCES” tab you can target the frontend settings to specific audiences;
- Target audiences: select previously configured "AUDIENCES" to whom the frontend settings will be targeted to.
Note: by default customers will be presented with the frontend setting named "default", unless they match an audience that is defined as a target audience of a specific frontend setting in which case they will be presented with that specific frontend setting instead.
- Target audiences: select previously configured "AUDIENCES" to whom the frontend settings will be targeted to.
- Click "SAVE AND SHOW" to save and go to the preview of the created item, or "SAVE AND ADD" to save and continue adding more items.