Skip to Content

This blog is for portal administrators who would like to implement Fiori Launchpad in their organizations.

Motivation:

The existing L-shape hierarchy has several drawbacks:

  • It takes a number of clicks to get to the required application
  • The navigation logic is not easy to memorize
  • To easily find the required object a user has to be familiar with the hierarchy structure.

Fiori Launchpad provides a flat structure with the following:

  • Personalization: allowing the user to organize the homepage as he wants.
  • Search and filtering functionality.
  • A required application can be found and launched in one click without screen navigation.


Challenges:

The traditional portal L-shape hierarchy has to be mapped into Fiori Launchpad structure.


Prerequisites:

  • SAP Enterprise Portal (EP) 7.31 SP 16 and higher or SAP Enterprise Portal 7.4 SP 11 and higher
  • Fiori Launchpad on Portal (FLP on EP) is enabled

Fiori Launchpad navigation paradigm:

Fiori Launchpad consists of 2 pages: Homepage and Tile Catalog page.

Home page is controlled and personalized by an end-user. A user can create/delete a group, fill a group with content or remove content from the group.

HomePage.PNG

Tile Catalog page serves as a repository for the entire content assigned to the end-user via EP roles.

TileCatalog.PNG


The content is provided in the form of tiles, which have a number of properties used for navigation and identification:

  • Category
  • Name
  • Subtitle
  • Keyword
  • Promotion properties: New, Recommended.


FLP on EP provides various search and filtering possibilities, on both Homepage and the Tile Catalog.

Both pages have a header line with the Quick Launcher and Fiori Search Application functionality:

  • Quick Launcher (search by tile title)

The search searches for the tiles in the entire Fiori Launchpad content (Homepage and Tile Catalog) by the tile title. By clicking the selected entry from the drop down list you can run the application directly.

Example: tiles from Homepage and Tile Catalog are found


HomePageCatalogSearchSales.PNG


  • Fiori Search Application (search by tile title, subtitle, info and keyword properties)

With the same search criterion as in Quick Launcher there are more results now as subtitles and keywords are also used:


TileCatalogSearchApp.PNG


Note: first enter a search criterion into an entry field and only then click on the magnifying glass.


On the Tile Catalog page the content can be filtered by category:


TileCatalogSearchByCategory.PNG


Or by tile title, subtitle, info and keyword in the right input field:


TileCatalogSearchBarSales.PNG


Or by combination of both.


On the Homepage the navigation can be done by clicking on the group in left-side menu. Then the group is moved to the top of the screen:


HomePageGroupNav1.PNG


Mapping principles:

The traditional EP navigation hierarchy has unlimited hierarchy levels whereas FLP hierarchy is limited.

For mapping the meaningful part of the navigation context should be identified and used in the new environment as the categories and information on the tiles. (Note that parts of the navigation structure may be omitted)

This context information will help to find and navigate to the needed tile and to identify the required application.

Mapping Example:

As an example we take Standard MSS (Manager Self-Service) SAP provided content and see how it might look like on FLP on EP.

Traditional Portal hierarchy:


AFP_ESS_Team.PNG


Let’s look closer on the hierarchy:


AFP_MSS+Zoom1.PNG


FLP on EP representation of MSS content:


  • Tile Catalog:


TileCatalog.PNG


  • Homepage:


HomePage.PNG

Steps to transform to FLP (an example)

1. Create categories in Portal Content ->Portal Users->Standard Portal Users->iViews->Fiori Launchpad->Fiori Launchpad Categories. Use concatenated values of Hierarchy Level #1 and Hierarchy Level #3, e.g. Manager Self-Services – Team


Categories.PNG


2. Change iView or Page properties as following:

  • Set Assigned Category  to a created category
  • Set Subtitle to Hierarchy Level #4, e.g. General Information
  • Set Object ID of Device Group to the list of supported devices groups or devices
  • Set Keyword to any hidden search criteria that can use in Tile catalog and Homepage search

MSSWorkingTimesPorperties1.PNG


  MSSWorkingTimesProperties2.PNG


The result for our example looks like this:


TilesWithProperties.PNG


For mass update of several iViews a mass editor can be used. This editor allows “Changing Property Values of Multiple Objects”.

After the mapping is finished both structures co-exist in EP: the unchanged L-shape and Fiori Launchpad providing a new user experience for the same EP content.


To report this post you need to login first.

17 Comments

You must be Logged on to comment or reply to a post.

  1. Venkatesh Machineni

    Hi Irena Kull,

    Nice article,

    I have developed a custom SAPUI5 application, I want to integrate it in SAP Enterprise portal and in Fiori LaunchPad.

    Do I need to follow any guidelines to integrate it in SAP EP and how to integrate it. Please tell me the procedure.

    Thank you in advance.

    (0) 
    1. Irena Kull Post author

      Hello Venkatesh,

      If your SPAUI5 app is in WRR already, you can integrate it using UI5 template (aka Fiori iVIew). You can look into the blog  to find out how to find and use this template.

      Regards,

      Irena

      (0) 
    1. Irena Kull Post author

      Hello Venkatesh,

      upload the entire application into the “Fiori Application” folder in the WRR and and then, create an iview from it in the portal catalog as described in the blog above.


      Set the iview’s “system” property to “WEBDISP” (assuming that this is the alias for web dispatcher).

      Set component path to the application’s component.js file location under the application’s root folder.

      Add the iview to the a role, assign this role to your end-user, login to portal via Web Dispatcher and then it should be visible as a tile in the tile catalog.


      BR, Irena

      (0) 
      1. Venkatesh Machineni

        Hi Irena,

        Thank you very much for your reply.

        I have one question, Can we display SAP Portal news items using SAPUI5 from Knowledge management repository.

        Could you please clarify this.

        (0) 
        1. Irena Kull Post author

          Hello Venkatesh,

          There are 2 ways: either use the news tile and configure RSS feeds from KM

          OR create a UI5 application, deploy it in WRR and run it as a UI5 iView

          (News tile is available as of 7.5 SP2)


          Regards,

          Irena

          (0) 
          1. Venkatesh Machineni

            Hi Irena,

            Thank you for your response,

            I have the following configuration on my Laptop:

            1.Intel i3 2nd generation processor and > 2.00 GHz

            2. 4 GB RAM

            3. 500  GB Hard Drive

            4. Windows 10 OS

            I need to work on SAPUI5 and Fiori on Portal to integrate my UI5 applications.

            Can I install the above mentioned prerequisites( SAP Enterprise Portal (EP) 7.31 SP 16 and higher or SAP Enterprise Portal 7.4 SP 11 and higher) along with backend on my Laptop?

            Please let me know. Thanks in advance.

            (0) 
            1. Irena Kull Post author

              Hello Venkatesh,


              for NetWeaver only (incl. portal) you need 8G RAM.

              I cannot give you an idea about the backend right away, but keep in mind that it is not only the application backend, but also the Frontend server you should install.

              It looks like the answer is no…


              Regards,

              Irena

              (0) 
  2. Sonali M S

    Hi Irena,

    I have the exact same requirement as stated in your blog and it really helpful. Thank you for such detailed explaination. I am just having one issue- I know that we can add images to the tiles. But somehow the images never get displayed in the tile. I have tried absolute/ relative paths, but none worked. When I try to display the images directly on the browser via a url to the image location, they do. The problem is only for the tiles.

    Our Portal is 7.4 SP 11.

    Thanks,

    Sonali.

    (0) 
      1. Sonali M S

        Thanks Irena.

        I was able to resolve this problem by making a copy of the theme in UI Theme Designer and making it as the default theme for Fiori Launchpad. I don’t know the reason but I was able to see the tile images in the preview mode in Theme Designer but not at run time. That is when I thought of making a copy and assigning the copied theme in the framework page.

        Thank you so much for all the help.

        Best,

        Sonali.

        (0) 
  3. Mohamed Yusuf Penna Khaja

    Hi Irena Kull,

    Very Useful Blog, Thanks for Sharing.

    We tried to Add few iviews of ESS(WDJ/WDA) in FLP. Its loading properly but UI’s like dropdown (for WDA) etc are not working in iPad / iPhone. But the same is working in Android and Browser. Is there any restriction for iOS/Safari browser. Do we need to update any to any patch to make it work in iOS devices. We are currently at 7.40 SP 11.

    Thanks,

    Yusuf

    (0) 
  4. Mohamed Yusuf Penna Khaja

    Dear Irena Kull,

         Thanks for your reply. We did update the server to the latest SP (7.4 SP 12) and Patch and tried again. But unfortunately there seems to be some issue with dropdown of WDA. The values are listed but we are not able to select the value in the drop down in safari browser (iPad) for WDA apps. But WDJ apps dropdown is working fine.

    Searched a little in SDN and it seems many are facing issue with WDA dropdown for iPad/iOS (  WDA dropdown does not work on iOS (iPhone/iPad) ). But as per PAM ( https://support.sap.com/content/dam/library/ssp/infopages/pam-essentials/TIP/NW74PAMBrow.pdf  -> Pg. 5) it should be working.

    Appreciate if you could suggest for this dropdown issue of WDA in iOS/iPad.

    Note: ECC Version is EHP6 FOR SAP ERP 6.0

    Thanks

    Yusuf

    (0) 
    1. Irena Kull Post author

      Hello Yusuf,

      I deleted my previous answer, it fits only to a very specific situation, i.e. using SAP ESS/MSS business package, and not a real BS application.

      In general, WDJ/WDA is not supported on mobile devices (as it is mentioned in PAM:

      EHP6.JPG– only desktop browsers are supported).

      For mobile devices you need Fiori apps.

      For FLP on EP running on iPad  NW 7.4 SPS9 or NW 7.31 SPS9 is required.

      Please let me know if you have further questions.

      Regards,

      Irena

      (0) 
  5. Arnold Gallemann

    Hello Irena,

    we want to use “old” iviews (with long names sometimes) in the FFP form the portal.

    So I tested a tile with much text for the properties name, subtitle and information.

    Unfortunately the text are cut and you can see the full textes only in the tooltip.

    tile text.JPG

    Is it possible to change this behavior particualr for the name in the future?

    Regards,

    Arnold

    (0) 
    1. Irena Kull Post author

      Hello Arnold,

      In the future releases you will be able to define tiles with different sizes, such as 1×2, 2×2, 2×1.

      But a general recommendation is to distribute the name between the properties (name, subtitle, information , keywords, tags), and also to use the icons.

      Regards,

      Irena

      (0) 
      1. Arnold Gallemann

        Hello Irena,

        thank you for your answer.

        I tested the new tile sizes in our 7.50-sandbox.

        Unfortunately the number of lines properties still the same. Only in the 1×2 and 2×2 tiles appears more text.

        tile text 2x2.JPG

        It would be nice if the additional space could be used for more text lines.

        Best regards,

        Arnold

        (0) 

Leave a Reply