Integrate Your App into Your Portal Site (Cloud Foundry)
- How to consume your own developed apps in a Portal site
- How to add the app to the
Launchpadpage in your Portal site.
You’ve created a SAP HTML5 module in SAP Web IDE and deployed it to your SAP Cloud Platform subaccount.
For more information about how to create the app, see the tutorial: Develop Your First SAP Fiori App for Use in a Portal Site on SAP Cloud Platform on Cloud Foundry.
Launchpad page in your
JobCore Portal site already contains a URL app. In this tutorial, you’re going to add the SAP Fiori app that you created in SAP Web IDE to a different group in the launchpad of your Portal site.
To consume apps that you created in the Portal, you first need to configure a destination to your developed content.
The entry point for your developed content is the App Router URL of the MTA file that you developed. So first you’ll find the URL of the App Router of your deployed MTA file and then you’ll add a destination to this App Router.
- Step 1
Open your subaccount and click Spaces in the left navigation panel.
Under Application Routes, copy the App Router URL and save it. You will need it when you create a destination in the next step of this tutorial.
Now you are ready to create a destination to your SAP HTML5 app in SAP Cloud Platform.
- Step 2
Open your trial or other subaccount, and in the side navigation panel, click Connectivity > Destinations. Then click New Destination.
Enter the following properties:
Property Value Name
<id>is your ID number
Note that the URL is the App Router URL that you saved in step 1.
Click New Property
Add the following additional property: sap-platform =
- Step 3
In the side navigation panel of your trial account or subaccount, click Subscriptions and enter
Portalin the search bar. Then click the Portal tile and Go to Application. The Site Manager opens with the Site Directory in focus.
Click the icon in the side panel of the Site Manager to open the Content Manager.
- Step 4
In the Content Manager, click + New > App.
In the PROPERTIES tab enter the following values:
Field Name Value Title
JobCoreApps(this is the name of the system that your app is running on - same name as the destination name). Note that it may take several minutes until the destination that you created in step 2 appears in the System list.
App UI Technology
SAPUI5(this is the type of app that you are adding).
SAPUI5 Component Name
mynamespace.FioriDemo- this is the registered name of the SAPUI5 component. To get this name, ask your developer to open the
component.jsfile in SAP Web IDE - it is defined in the
component.jsfile without the
.componentsuffix as shown here:
Your screen will look like this:
Click the Navigation tab and enter the following intent:
Click the Visualization tab.
Leave the Title as is and then enter the other properties as follows:
Icon: Click the browse icon, type
idea-wall, select the displayed icon, and click OK.
Then click Save
Go back to the Content Manager.
You can see that your new app is in the content items list.
You can now integrate this app with your Portal site and add it to the
To make the app visible in the
Launchpad, you need to assign it to a group. You also need to assign the app to a role.
This is exactly what you’re going to do in the next two steps.
- Step 5
In this step you’re going to create a new group and you’ll assign the
Candidatesapp to it.
Click + New in the Content Manager and click Group to open the Group editor.
Work in Progressas the Title.
In the Assignments panel on the right, type
cato search for your
Candidatesapp and the click the + to assign your app to this group.
- Step 6
In this step, you’ll assign the
Candidatesapp to the
Everyonerole. This is a default role - content assigned to the
Everyonerole is visible to all users.
Go back to the Content Manager.
Everyonerole to open the Role editor.
Search for your app. Type
cain the search field to find the
Candidatesapp and then click + to assign the
Everyonerole to it. And then click Save.
- Step 7
Click the Sites icon to open the Site Directory.
Click Go to site on the site tile.
You’ll see the
Work in Progressgroup with the
You have successfully created a great looking Portal site with apps that you can access from the Portal launchpad.
This is just the start – you can continue to add more apps to your Portal site.
Which of these editors will you find in the Content Manager?