In my previous Blog Article, I explained how to deploy your UI5 Application into the ABAP server using two different methods. Now Let’s add the application to the Fiori Launchpad.
What is Fiori Launchpad
SAP Fiori launchpad is a shell that hosts SAP Fiori apps and provides the apps with services such as navigation, personalization, embedded support, and application configuration. SAP Fiori launchpad is the entry point to SAP Fiori apps on mobile and desktop devices.
FLP Configurations Steps
We will complete the configurations by following these steps notice that this example has been done on S/4 HANA 2020 release :
Step 1: Creating a Sematic object
Use the T-Code: /UI2/SEMOBJ to define a new Semantic object, notice that Semantic objects will allow you to group apps that are related to each other for easier navigation. It is recommended to add your tiles to existing Semantic Objects so that your app will be added to the list of related apps and links dialogs together with standard SAP apps. You can access all the existing Semantic Objects by using transaction code /UI2/SEMOBJ_SAP.
Click on Edit and add a new Entry
add a unique semantic object, semantic object name, and description, and Save the changes into a transport request.
Step 2: Creating a Business Catalog
Use the T-Code: /UI2/FLPD_CUST to Enter the SAP FIORI Launchpad designer for customization (client-specific)
now you can create a new catalog by clicking on the Plus icon at the bottom of the left-hand side pane.
Next, Enter a title and an ID for your Catalog, and click on Save. The new catalog is saved and you should be able to see it under the catalog collections.
Step 3: Creating Target Mapping
In the target mapping configuration, you map a navigation target to the combination of a semantic object and an action, also known as an intent. To create a new target mapping, choose Create Target Mapping.
The target mapping configuration page is displayed, now fill in the parameters in the configure target mapping pop-up as follows:
- Semantic Object: the semantic object that we’ve already created
- Action: you can choose an action according to your requirements
- Application Type: SAPUI5 Fiori App
- Title: choose a title for your application
- URL: is an ICF Base URL of SAPUI5 application, mostly should look like that: /sap/bc/bsp/applicationname notice that The URL is server-relative and you can get it by using the T-code SICF and it must point to a SAP Fiori app.
- ID: is your deployed application ID, you can find it in the manifest.json file or component.js or in your controller.js
Note: the usage of the application type “SAP Fiori App using LPD_CUST” is deprecated. See SAP Note 2614740.
click on save and you’re all set 😃.
Step 5: Creating Tiles.
Choose the ’Tiles’ icon, then click on the ‘Plus’ icon to add a tile
On the next screen, choose the ’App Launcher — Static’ template from the available options of tile templates:
choose App launcher — Static
Notice that, App Launcher-Static tiles are used to launch applications from the home page while App Launcher-Dynamic Tiles, display information that is pulled from a back-end system using an OData service EntitySet.
Next, Maintain the following configuration parameters:
Title: Enter a title that will be displayed on the tile.
Tile Subtitle: Enter a subtitle that will be displayed on the tile.
Tile Information: Enter additional information that will be displayed at the bottom of the tile.
Tile Keywords: Tag a tile with keywords so users can find it more easily using the search function in the tile catalog. If you want to specify several keywords, use either a space or a comma as a separator.
Tile Icon: Select an icon by using the value help. After you have selected an icon, the system inserts a URL starting with the sap-icon:// protocol. These icons are based on SAPUI5 icon fonts. For more information, see Icon and Icon Pool.
Semantic Object: add the semantic object that you created earlier.
Notice that, the Tile and the Target Mapping are linked using Semantic Object + Actions. and the SAP UI5 application path is linked in Target mapping via Launchpad Role
Step 6: Creating Business Groups.
To create a Business Group, we should use a similar approach as when creating catalogs.
click on the + button and add a title and ID your group and click on save
Add the group to the Business Catalog that you’ve already created and then add the tile.
Notice that One Business Group can have single or multiple tiles from the same Catalog or multiple Catalogs and you can control the app/tile accessibility to users in SAP Fiori Launchpad with the Business group.
Step 6: Creating PFCG Business Role
The very last step of your FLP Configurations will be creating a PFCG Role in the SAP Fiori Server (Front-end) server.
Go to the T-code PFCG and give your role a name then click on Single role
please try to not add any spaces or special characters in the role name
Go to the menu tab, From the Insert Node drop-down list, choose SAP Fiori Tile Catalog. Select the catalog and click on OK.now assign your business catalog and Group to the Role
now the very last step, you can assign users to the Role by clicking on the User Menue tab and adding the user ID
And now you're good to go! check your application tile on the Fiori Launchpad.
By completing these six steps, your UI5 application is now successfully integrated into the Fiori Launchpad, allowing users to access and interact with the application seamlessly.
Keep in mind that Fiori Launchpad configuration might require ongoing maintenance and updates as your application landscape evolves or user requirements change. Regularly review and optimize your Fiori Launchpad setup to ensure a smooth and efficient user experience. With this newfound knowledge, you are equipped to make the most of the powerful SAP Fiori Launchpad and create a personalized and efficient Fiori experience for your users. Happy coding!
