Configure the layout of your tile

In this topic, you learn how to configure the layout of your tile.

Prerequisites

Procedure

  1. To make layout changes to the tile content, open the Tile Content tab.

    1. In the Information section, you can enter a title, subtitle, description, tags, and role tags for a tile.

    2. In the Tile Icon section, you can add an icon on the tile from the integrated SAP Icon Explorer.

      Icon fonts from the integrated SAP Icon Explorer adapt automatically the underlying color scheme of the base UI5 theme selected for a launchpad layout, either for a light or dark appearance respectively. You can alternatively select an image file as an icon from the Media Library instead of an icon font from the integrated SAP Icon Explorer. In this case, the image file does not adapt to the underlying color scheme of the base UI5 theme. Select image files from the Media Library for the tile icon in a light and dark appearance respectively.
    3. In the Tile Image section, you can add a custom source image for the tile for light appearance and dark appearance from the Media Library.

    4. In the Open Button section, you define what text or which icon is displayed on the start button of the tile.

  2. To make layout changes to the tile appearance, open the Tile Appearance tab.

    1. In Tile Layouts for Light Appearance, select Add Tile Layout to add one or more predefined tile layout settings from the Tile Layout tool to apply to your tile for a light appearance. If same tile layout settings are shared between multiple tile layouts, the top tile layout is prioritized when applying settings.

    2. By default, tile layouts added for light appearance are also used for dark appearance. In Tile Layouts for Dark Appearance, select Do Not Inherit Light Appearance Tile Layout to prevent the inheritance of light appearance for tile layouts for dark appearance and to add tile layouts for dark appearance separately.

    3. Select Add Tile Layout to add one or more predefined tile layout settings from the Tile Layout tool to apply to your tile for a dark appearance. If the same tile layout settings are shared between multiple tile layouts, the top tile layout is prioritized when applying settings.

    4. In the Settings section, in the StyleClass field, you add a custom style class to apply for the tile.

    5. Select Force Tile Layout Attributes! to enable the settings defined in the tile layouts added to this tile instead of the tile inheriting tile layout settings configured in launchpad layouts and tile group layouts by default.

  3. Select Save.

Results

  • You have configured the layout of your tile.

Next steps