Creating SAP Fiori Spaces and Pages

Objective

After completing this lesson, you will be able to manage SAP Fiori Spaces and Pages.

Spaces and Pages for Launchpad Structuring

In newer on-premise releases of SAP S/4HANA, you can start putting together SAP Fiori spaces and pages for your end users, to give them a better SAP Fiori launchpad user experience than available so far with the single home page. This is also a recommended layout structuring for the SAP Fiori Launchpad home page.

Screenshot showing SAP Fiori Spaces and Pages.

SAP Fiori spaces give you three levels of structuring home page content rather than the one provided by the previous home page approach.

The three levels are:

  • Space
  • Page
  • Section

Users will have one or more spaces that contain one or more pages. The pages show apps clustered in different sections. The spaces mode offers more flexibility to influence the launchpad layout for specific user groups.

Pages are assigned to users via spaces that are assigned to business roles. The business role defines which users see a specific page. If you enable spaces for your users and define specific pages for them, you can reach a better fit. By defining pages with meaningful sections, you can define in which order the apps are sorted on the page.

Hint

You can, for example, sort the most used apps in the top-level section and then create separate sections for apps that belong together. Users can personalize the pages by adding and removing apps.

Spaces are organizational units that combine several pages in a menu that is shown in the navigation bar of the launchpad. They can be assigned to one or more business roles. The pages contain the apps the user works with. When the user clicks on a space in the navigation bar, the first page of the space is shown. The pages then contain the apps for the end users.

SAP delivers spaces and pages for many business roles for SAP S/4HANA 2020, which you can use to get examples of how to structure spaces for these roles, as well as for trying it out in test systems. When you work with your own business roles and catalogs, we recommend that you create your own spaces and pages from scratch.

Note

The classic home page layout with SAP Fiori groups remains possible and can be used in parallel.

Tools for Managing Spaces and Pages

Screenshot showing tools for managing spaces and pages.

To manage launchpad structure and layout using spaces and pages, administrators use SAP Fiori apps Manage Launchpad Spaces and Manage Launchpad Pages.

With Manage Launchpad Spaces app, administrators can create and manage spaces for the SAP Fiori launchpad. Spaces are organizational units that combine several pages. The pages then contain the apps for the end users. This is how the layout of the SAP Fiori launchpad home screen can be structured. The Manage Launchpad Spaces app provides an overview showing all spaces available in your launchpad and a detailed view for the spaces.

With Manage Launchpad Pages app administrators can create the launchpad pages, define the layout of pages and edit, copy or delete existing pages.

Also, the functionality of the role maintenance (transaction PFCG) has been extended. It is now possible to add Launchpad Spaces to the role menu.

Hint

To access these tools, authorization role SAP_FLP_ADMIN needs to be assigned to you.

Creating Spaces with Manage Launchpad Spaces App

There are several possible sequences to create spaces and pages and make them available for users. The recommended sequence if launchpad content creation and role maintenance are separated, is the so called bottom up approach. This means that spaces and pages are created first, and then they are assigned to roles in role maintenance.

With the Manage Launchpad Spaces app you can create and manage spaces for the SAP Fiori launchpad. With spaces you can design the launchpad layout. Spaces are organizational units that combine several pages in a menu that is shown in the navigation bar of the launchpad. They can be assigned to one or more business roles. The pages contain the apps the user works with. A space is shown in the navigation bar of the launchpad. When you click on it, the first page of the space is shown. The pages then contain the apps for the end users. The Manage Launchpad Spaces app provides an overview showing all spaces available in your launchpad and a detailed view for the spaces.

Screenshowt showing the steps to create own space and page with Manage Launchpad Spaces app.
  1. Open the Manage Launchpad Spaces app.
  2. Select Create and add the space information for the new space.

    Enter a unique space ID, a description and a title for the space. All three entries are mandatory.

    Note

    The space ID has to start with a Z or a Y (Y should only be used for spaces designed by SAP partners). Note that you cannot change the space ID anymore. The space title will be shown in the navigation bar.
  3. Select the option Also Create a Page and enter the page information.

    Enter a page ID, a description and a title for the page. All three entries are mandatory. The page ID must be unique, and it has to start with a Z or a Y (Y should only be used for pages designed by SAP partners). The title will be shown as a menu item in the space menu.

  4. Depending on your system configuration, you need to enter a transport. You can check the transport assignment of a space in the Transport tab of the Space Details view in the Manage Launchpad Spaces app.

    Note

    The space is not locked after it was assigned to a transport. A space can be assigned to several transports.

  5. Choose Create. The space details are displayed. The Pages tab shows the newly created, empty page. Here you can add further pages.

    Hint

    You could now start editing the page by adding apps from business catalogs. However, the recommended way is to establish a role context for space and page. This means, the space is assigned to a business role and only apps that are authorized by the business role should be added to the pages of a space. This is done in transaction PFCG.

Screenshots on adding space to Role Menu.
  1. In Role Maintenance (transaction PFCG), create a new role or edit an existing one.
  2. Go the Menu tab.
  3. Choose the context menu of the transaction button and select SAP Fiori → Launchpad → Launchpad Space.
  4. Enter a space ID. You can use the value help for this.

    The space ID is the name that you provided when creating the space in the Manage Launchpad Spaces app.

    By adding the defined space to a role you make it available for all users with this role.

  5. Save the role.

Creating and Editing Pages with Manage Launchpad Pages App

You create and edit pages with Manage Launchpad Pages app. In the app, you also define the layout of pages and edit, copy, or delete existing pages.

When you open the Manage Launchpad Pages app, you can access customer-created or SAP-delivered pages in your system.

  1. On Customer-Created tab, choose Create to create a custom page.
  2. For newly created pages, enter the page information.

    Enter a page ID, a description and a title for the page. All three entries are mandatory.

    Note

    The page ID must be unique, and it has to start with a Z or a Y (Y should only be used for pages designed by SAP partners). The title will be shown as a menu item in the space menu.
  3. Depending on your system configuration, you need to enter a transport. The transport assignment of a page is shown in the Transport tab of the Page Details view in the Manage Launchpad Pages app.

    Note

    The page is not locked after it was assigned to a transport. A page can be assigned to several transports.

  4. Click on Create to generate the page.

    An empty page is displayed in the edit page view.

    Note

    A page always has to be assigned to a space to make it available to users. If you have created a page from scratch, you need to assign it to the space in the Manage Launchpad Spaces app.

  5. Assign the page to a space.
Screenshots on editing page with Manage Launchpad Pages app.

If you have already created a page and it is assigned to a space, you can edit it in the Manage Launchpad Pages app.

  1. Choose Edit (pencil icon) to open the edit mode.
  2. On the Page Content tab, you will find a first empty section in the page, which requires a title. Enter a meaningful name for it.

    You can add more sections to one page according to your needs.

  3. You can add apps from the tile catalogs to the sections by choosing Catalogs.

    Hint

    However, if you have defined the role context by assigning the space where the page is in to a business role, you will be able to see all the app tiles from the catalogs inside a role. This prevents from adding tiles to a page that the end user is not authorized to see and thus from potential issues.
  4. You can also select several apps by ticking the boxes in front of each app title. When you have selected all apps you want to assign to a section, click on Add or simply drag and drop the app tiles to the section.
  5. Save your changes.

Page Visibility

After you have set up all the pages for a space, go to the Manage Launchpad Spaces app and set the pages visible.

Screenshot on setting pages visible.

Until then, the page visibility will remain hidden. This means, that even if the end user has got the roles assigned that contains a space, he or she would not be able to see the pages and any app tiles on the SAP Fiori Launchpad home screen.

Practice System Exercise: Create Spaces and Pages

Select Start Exercise to start the simulation.

ExerciseStart Exercise

Note

If you have access to a practice system, you can now execute this exercise.

To enable end-users to display tiles on the home screen of the SAP Fiori Launchpad, you want to create SAP Fiori spaces with corresponding pages and include them into an existing PFCG role.

In this exercise, you want to create two different SAP Fiori spaces according to the two different job profiles: accounting manager and inventory manager.

And you will also include pages into the spaces:

  • Space ID: Z_ADM945_##_SP_FIN_ACCOUNT

    • Page ID: Z_ADM945_##_PG_ACCOUNT

    • Page ID: Z_ADM945_##_PG_BANK_MGMT

  • Z_ADM945_##_SP_INVENT_MGMT

    Page ID: Z_ADM945_##_PG_INVENT_MGMT

Note

In this exercise, when an object name or value contains ##, replace ## by the number your trainer assigned to you.Illustration on ADM945: Roles and Spaces Overview.

Task 1: Create SAP Fiori Space for Accounting Manager

You want to create an SAP Fiori Launchpad space for an accounting manager.

Steps

  1. Log on to SAP Fiori Launchpad of system S4D with your train-## user. Use Google Chrome.

    FieldValue
    Usertrain-##
    Password

    Custom password

    1. In the Microsoft Windows start menu, choose Google Chrome.

    2. In Google Chrome, go to Bookmarks.

    3. In Bookmarks, choose 10 Development → s4dhost → 10 S4D SAP Fiori Launchpad.

      Note

      Since SAP S/4HANA 2020 new tools for creating spaces and pages have been introduced. To access those tools, you as an administrator need to have the relevant authorizations that are provided by SAP-delivered role SAP_FLP_ADMIN. After you got this, you will see the relevant tools in SAP Fiori Launchpad.

  2. Start Manage Launchpad Spaces app rom the Fiori Launchpad space and create an SAP Fiori Launchpad space for accounting manager. Use the following data:

    Note

    The space ID must start with Z or Y and must be unique. It can contain up to 32 characters but must not contain any special characters.

    FieldValue
    Space IDZ_ADM945_##_SP_FIN_ACCOUNT
    Space Description

    any feasible description

    Space TitleFinancial Accounting Space ##

    1. On the SAP Fiori Launchpad home screen, choose the Fiori Launchpad space.

    2. Launch the Manage Launchpad Spaces app.

    3. Choose Create.

    4. In the Create Space dialog window, enter the following information for the space:

      FieldValue
      Space IDZ_ADM945_##_SP_FIN_ACCOUNT
      Space Description

      any feasible description

      Space TitleFinancial Accounting Space ##

  3. Assign a customizing transport request that you have already created in the catalog exercise.

    Note

    The transport request is displayed in the drop-down menu only if you are the owner of it or you have been assigned as user to it.

    1. In the Create Space dialog window, choose the field Transport.

      Result

      The customizing transport request that you created in system S4D before is displayed.

    2. Select the transport request from the drop-down menu.

  4. Choose Create.

  5. Choose SAP logo to get back to the FLP home screen.

Task 2: Create SAP Fiori Pages for Accounting Manager

In the Financial Accounting Space ##, you want to include two pages that later will contain tiles to reflect typical tasks of an accounting manager.

Steps

  1. On the FLP home screen, from the space Fiori Launchpad start Manage Launchpad Pages app and create two SAP Fiori Launchpad pages for accounting manager. Use the following data:

    Note

    The space ID must start with Z or Y and must be unique. It can contain up to 32 characters but must not contain any special characters.

    Page 1

    • Page ID: Z_ADM945_##_PG_ACCOUNT
    • Page Description:

      any feasible description

    • Page Title: Accounting Page ##

    Page 2

    • Page ID: Z_ADM945_##_PG_BANK_MGMT
    • Page Description:

      any feasible description

    • Page Title: Bank Management Page ##

    1. On the home screen of the SAP Fiori Launchpad, choose Fiori Launchpad space.

    2. Launch the Manage Launchpad Pages app.

    3. Choose Create to create the first page.

    4. In the Create Page dialog window, enter the following information for the space:

      FieldValue
      Page IDZ_ADM945_##_PG_ACCOUNT
      Page Description

      any feasible description

      Page TitleAccounting Page ##

  2. Assign a customizing transport request that you have already created in the catalog exercise.

    Note

    The transport request is displayed in the drop-down menu only if you are the owner of it or you have been assigned as user to it.

    1. In the Create Space dialog window, choose the field Transport.

      Result

      The customizing transport request that you created in system S4D before is displayed. Choose it.

  3. Choose Create.

  4. Choose Back to get to the Customer-Created pages overview and create the second page.

    1. Choose Create to create the second page.

    2. In the Create Page dialog window, enter the following information for the space:

      FieldValue
      Page IDZ_ADM945_##_PG_BANK_MGMT
      Page Description

      any feasible description

      Page TitleBank Management Page ##

  5. Assign a customizing transport request that you have already created in the catalog exercise.

    Note

    The transport request is displayed in the drop-down menu only if you are the owner of it or you have been assigned as user to it.

    1. In the Create Space dialog window, choose the field Transport.

      Result

      The customizing transport request that you created in system S4D before is displayed. Choose it.

  6. Choose Create.

  7. Assign both pages to the Z_ADM945_##_SP_FIN_ACCOUNT space.

    1. Choose SAP logo to return to the FLP home screen.

    2. Start Manage Launchpad Spaces app.

    3. Select Z_ADM945_##_SP_FIN_ACCOUNT space.

    4. Choose Edit (pencil button).

    5. In the Search for pages field, search for the two pages that you have created. Enter ADM945_## to find specifically your pages.

    6. Choose Add for both pages.

    7. In the bottom right corner, choose Save.

    8. Choose SAP logo to return to the FLP home screen.

Task 3: Create SAP Fiori Space and Page for Inventory Manager

You want to create an SAP Fiori Launchpad space for an inventory manager. In the space, you want to include one page that later will contain tiles to reflect typical tasks of an inventory manager.

Steps

  1. Start Manage Launchpad Spaces app and create an SAP Fiori Launchpad space for inventory manager. Use the following data:

    Note

    The space ID must start with Z or Y and must be unique. It can contain up to 32 characters but must not contain any special characters.

    FieldValue
    Space IDZ_ADM945_##_SP_INVENT_MGMT
    Space Description

    any feasible description

    Space TitleInventory Management Space ##

    1. On the FLP home screen, from the space Fiori Launchpad start Manage Launchpad Spaces app.

    2. Choose Create.

    3. In the Create Space dialog window, enter the following information for the space:

      FieldValue
      Space IDZ_ADM945_##_SP_INVENT_MGMT
      Space Description

      any feasible description

      Space TitleInventory Management Space ##

  2. Since you will have only one page in the space, choose the option to create the page right away. Enter the following data:

    Note

    The page ID must start with Z or Y and must be unique. It can contain up to 32 characters but must not contain any special characters.

    FieldValue
    Page IDZ_ADM945_##_PG_INVENT_MGMT
    Page Description

    any feasible description

    Page TitleInventory Management Page ##

    1. Since it is going to be only one page in the space, set a flag in Also create a page to create the page in the space.

    2. In the Create Space dialog window, enter the following information for the page:

      FieldValue
      Page IDZ_ADM945_##_PG_INVENT_MGMT
      Page Description

      any feasible description

      Page TitleInventory Management Page ##

  3. Assign a customizing transport request that you have already created in the catalog exercise.

    Note

    The transport request is displayed in the drop-down menu only if you are the owner of it or you have been assigned as user to it.

    1. In the Create Space dialog window, choose the field Transport.

      Result

      The customizing transport request that you created in system S4D before is displayed. Choose it.

  4. Choose Create.

Assign SAP Fiori Spaces to PFCG Roles

Select Start Exercise to start the simulation.

ExerciseStart Exercise

Practice System Exercise: Assign SAP Fiori Spaces to PFCG Roles

Task 1: Assign Spaces to Business Roles

Note

If you have access to a practice system, you can now execute this exercise.

You want to assign your custom-spaces to business roles ADM945_##_BR_FINANCIALS and ADM945_##_BR_INVENTORY so that the pages are available for the ADM945-## user with those business roles.

Steps

  1. Log on to the SAP GUI of the system S4D.

    FieldValue
    Usertrain-##
    Password

    Custom password

    1. Choose SAP Logon.

    2. Select 10 Development → S4D SAP GUI non-SNC [PAS].

    3. Choose Log On.

  2. Assign Z_ADM945_##_SP_FIN_ACCOUNT space to the ADM945_##_BR_FINANCIALS role.

    1. In system S4D, start the role maintenance (transaction PFCG).

    2. In the Role field, enter ADM945_##_BR_FINANCIALS.

    3. Choose Change.

    4. Go to the Menu tab.

    5. In the context menu of the Transaction button, choose SAP Fiori Launchpad → Launchpad Space.

    6. In the Space ID field, use the value help (F4) and search for the Z_ADM945_##_SP_FIN_ACCOUNT space.

    7. Choose Save in the lower right-hand corner.

    8. Choose Back (F3).

  3. Assign Z_ADM945_##_SP_INVENT_MGMT space to the ADM945_##_BR_INVENTORY role.

    1. Back on the Role Maintenance screen, in the Role field, enter ADM945_##_BR_INVENTORY.

    2. Choose Change.

    3. Go to the Menu tab.

    4. In the context menu of the Transaction button, choose SAP Fiori Launchpad → Launchpad Space.

    5. In the Space ID field, use the value help (F4) and search for the Z_ADM945_##_SP_INVENT_MGMT space.

    6. Choose Save in the lower right-hand corner.

    7. Choose Cancel.

    8. Choose Back (F3).

Task 2: Edit Page Content

You want to edit page content and add apps to it to reflect typical tasks of business roles.

Steps

  1. Log on to SAP Fiori Launchpad of system S4D with your train-## user. Use Google Chrome.

    FieldValue
    Usertrain-##
    Password

    Custom password

    1. In the Microsoft Windows start menu, choose Google Chrome.

    2. In Google Chrome, go to Bookmarks.

    3. In Bookmarks, choose 10 Development → s4dhost → 10 S4D SAP Fiori Launchpad.

      Note

      Since SAP S/4HANA 2020 new tools for creating spaces and pages have been introduced. To access those tools, you as an administrator need to have the relevant authorizations that are provided by SAP-delivered role SAP_FLP_ADMIN. After you got this, you will see the relevant tools in SAP Fiori Launchpad.

  2. In the Manage Launchpad Pages app, create a Quick Access section for the Z_ADM945_##_PG_ACCOUNT page.

    1. On the SAP Fiori Launchpad home screen, choose the Fiori Launchpad space.

      If you want to work with groups, you can deactivate the space usage in the user settings. Then you will find the admin tools in the Fiori Launchpad group.

    2. Launch Manage Launchpad Pages app.

    3. Select Z_ADM945_##_PG_ACCOUNT.

    4. Choose Edit (pencil icon).

    5. Enter a Section TitleQuick Access.

  3. Add the tiles of the Display G/L Account Balances app and Display G/L Account Balances - For Ledger app to the Quick Access section.

    1. In the Derived from Roles section on the right-hand side, choose Add for the Display G/L Account Balances app.

      Result

      The tile is added to the Quick Access section.

    2. In the Derived from Roles section on the right-hand side, choose Add for the Display G/L Account Balances - For Ledger app.

      Result

      The tile is added to the Quick Access section.

    3. Choose Save ind the lower right-hand corner.

    4. Choose Back.

  4. In the Manage Launchpad Pages app, create a Quick Access section to the Z_ADM945_##_PG_BANK_MGMT page.

    1. From the list of custom-created pages, select Z_ADM945_##_PG_BANK_MGMT.

    2. Choose Edit (pencil icon).

    3. Enter a Section Title:Quick Access.

  5. Add the tile of the Manage Banks app to the Quick Access section.

    1. In the Derived from Roles section on the right-hand side, choose Add for the Manage Banks app.

      Result

      The tile is added to the Quick Access section.

    2. Choose Save in the lower right-hand corner.

    3. Choose Back.

  6. In the Manage Launchpad Pages app, create two sections Overview and Analysis to the Z_ADM945_##_PG_INVENT_MGMT page.

    1. On the home screen of the SAP Fiori Launchpad for system S4D, launch Manage Launchpad Pages app.

    2. Select Z_ADM945_##_PG_INVENT_MGMT.

    3. Choose Edit (pencil icon).

    4. Enter a Section Title:Overview.

    5. Choose + Add Section to create a second section in the page.

    6. Enter a Section Title:Analysis.

  7. Add the tile of the Material Documents Overview app to the Overview section.

    1. In the Derived from Roles section on the right-hand side, drag and drop the Material Documents Overview app to the Overview section.

      Result

      The tile is added to the Overview section.

  8. Add the tile of the Physical Inventory Analysis app to the Analysis section.

    1. In the Derived from Roles section on the right-hand side, drag and drop the Physical Inventory Analysis app to the Analysis section.

      Result

      The tile is added to the Analysis section.

    2. Choose Save in the lower right-hand corner.

    3. Choose SAP logo to return to the FLP home screen.

Task 3: Log on to the SAP Fiori Launchpad and Examine Spaces and Pages

You want to log on to the SAP Fiori Launchpad withADM945-## test user you created in an exercise before and you want to review if the SAP Fiori spaces and pages that include the apps that are displayed on the FLP home screen.

Steps

  1. If you have already logged off, log on to the SAP Fiori Launchpad in Mozilla Firefox once again. If not, refresh the home page.

    Hint

    We do not recommend that you use Google Chrome since you have already logged in to the SAP Fiori Launchpad with your train-## user there. To avoid logging off, you can use any other browser in the training landscape to start the SAP Fiori Launchpad if you know the URL. Mozilla Firefox is only a suggestion. However, there you will find all necessary bookmarks.

    1. In the Microsoft Windows start menu, choose Mozilla Firefox.

    2. In Bookmarks, choose 10 Development → s4dhost → 10 S4D SAP Fiori Launchpad.

    3. Enter the following data:

      FieldValue
      UserADM945-##
      Password

      Custom password

    4. Choose Log On.

    5. Examine the SAP Fiori Launchpad home screen.

    Result

    You see the home page layout with the SAP Fiori Spaces ans Pages.

  2. Enable the spaces for your user via user settings.

    1. On the FLP home screen, go to the user-action menu.

    2. Choose Settings.

    3. In the Settings window, go to Spaces and Pages.

    4. Set the flag in Use Spaces.

    5. Choose Save.

    Result

    The page has been refreshed. The layout is now changed. You landed in the My Home space. However, you can see the spaces and by opening the drop-down menu the pages. You can switch between the Inventory Management Space ## and the Financial Accounting Space ##.

Log in to track your progress & complete quizzes

Learning

SAP FacebookSAP YoutubeSAP LinkedIn