Skip to Content

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>); /wp-content/uploads/2015/01/a2_631178.jpg

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 “‘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.


To report this post you need to login first.

Be the first to leave a comment

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

Leave a Reply