Change Dynamically Background Image of Fiori Launchpad

[former_member193140]

I would like to share a simple trick to change the background image of Fiori Launchpad dynamically.

Firstly, let's take a look a html tag and CSS in Fiori Launchpad for the background image:

We need to update the class sapMAppBG sapMGlobalBackgroundImage and add the style="background-image: url(<path_to_image>);"

Let's add the JavaScript codes in the FioriLaunchpad.html

Execute transaction SE80  and go to /UI2/USHELL to modify the FioriLaunchpad.html:

Add below JavaScript codes highlighted in red box after the line "jQuery.sap.require('sap.fiori.core-ext');"

And the last step is to upload the PNG image files to the Netweaver Gateway:

Final result:

You can find the modified FioriLaunchpad.html in the attachement.

References:

• Colorful App Tiles in Fiori Launchpad
  
• Colorful App Tiles in Fiori Launchpad (Enhanced version)
• Fiori Launchpad with Random Flowers