OKAST offers a simple tool to organize and customize the layout of your platform’s homepage: the smart components editor.

Smart components are the elements that will appear on your homepage. How to set them up and manage them? We explain everything below.

 

On your back office, go to Platform > Layout > Homepage: from there you can manage the layout of your platform’s homepage.

 

Organizing the homepage by device

You can organize this homepage according to the devices on which your platform has been deployed: Web, Android Application, iOs Application.

If you want to manage the layout for different devices in the same way, leave only the web tab.

If you now want to manage the layout across devices independently, you can choose to duplicate the layout of the homepage of another device:

Duplicate homepage by device

If you want to manage the layout by device independently, you can add a device and not check the box “Duplicate an existing page?”

From now on, with this organization by device, when you create a smart component in a device, it will be done independently from the others. You can therefore have a content strategy that is specific to each device on which your platform has been deployed.

 

Managing the homepage

Once your different devices are set up, you can manage from here the organization of the homepage of your platform.

You have the list of the smart components of your homepage with different useful information.

  • The name of the smart component, which will only be visible on the back office side.
  • The smartlist to which the smart component is attached.  If no smartlist is indicated, it means that the component is attached to a dynamic list.
  • The status of the smart component and/or the smartlist: a green icon means that the smart component and/or the smartlist is active on the homepage, a red icon means that the component and/or the smartlist is inactive, therefore not visible on the platform.
  • The image format that the smart component displays (ex: 16:6, 3:4, etc.)
  • The type of display of the smart component: carousel or mosaic (more details on the type of display below).
  • A possible icon indicating that the smart component is attached to a dynamic list:

My list , Resume Watching , Content recommendation

The order in which the smart components are displayed determines the order in which they are displayed on your homepage. If you want to change the display of a particular smart component, you can simply drag and drop it to reorganize your homepage.

 

The creation of smart components

There are 3 types of smart components: carousels, mosaics and widgets.

  • Carousels are displayed on a single line and scroll horizontally.
  • Mosaics display the contents one after the other and on as many lines as necessary.
  • Widgets

The Carousels and Mosaics can be linked to different data sources: another smartlist, the “my list” component, the “resume reading” component, the content recommendation algorithm.

 

Carousel component

Each carousel component can be customized according to different parameters:

Type of smart component

  • Choose a name for your smart component that will be visible only from the back office
  • Activate or deactivate the smart component on the storefront
  • Choose the image format you want for your smart component. You have 4 different formats: 16/6 “banner” format, 16/9 “thumbnail” format, 3/4 “poster” format, or 1/1 “square” format. For a reminder of the exact dimensions, see our dedicated article.
  • Display settings :
    • Display the smartlist title above the smart component
    • Display the titles of the elements below each of these elements
    • Display the dialog (for more information, see our article on the dialog option)
    • Enable the circular carousel where the smart component and its elements scroll indefinitely
    • Enable the automatic scrolling where the elements of the smart component scroll automatically when you browse the homepage
    • Display navigation arrows (inside or outside the image) and choose to display the arrows only on hover
    • Number of visible and displayed elements on the homepage

Datasource type

You must then choose a data source on which your smart component will be based. This can be based on a smartlist (which you choose from a drop-down menu) or the dynamic lists My list, Resume reading or Content recommendation. For more information about the dynamic lists My list and Resume reading, please see our dedicated article.

Conditional render

You can enable or disable the display conditions of each smart component you set up.

These display conditions are linked to the connection to the platform and to the subscription to the platform:

  • The user is/is not logged in
  • The user has/has not an active subscription

It is possible, within the limits of the possible, to link two conditions, as for example: The user is connected AND The user has not have an active subscription.

Mosaic type component

You also have the possibility to choose a mosaic component, which is easier to set up with only 4 parameters:

 

Type of smart component

  • Choose a name for your smart component that will be visible only from the back office
  • Activate or deactivate the smart component on the storefront
  • Choose the image format you want for your smart component. You have 4 different formats: 16/6 “banner” format, 16/9 “thumbnail” format, 3/4 “poster” format, or 1/1 “square” format.
  • Display settings :
    • Display the smartlist title above the smart component
    • Display the titles of the elements below each of these elements
    • Display the dialog

Datasource type

Next you need to choose a data source on which your smart component will be based. This can be based on a smartlist (which you choose from a drop-down menu) or the dynamic lists My List, Resume Reading or Content Recommendation. For more information about the dynamic lists My list and Resume reading, please see our dedicated article.

Conditional Render

You can enable or disable the display conditions of each smart component you set up.

 

Widget type component

To set up a widget component, see our dedicated article on setting up widgets.

 

Contact us at support@okast.tv if you have any question about the creation and management of your homepage with smart components.