How to add background image on Portal

[Saba Baig]

Step 1: Upload the Image

1. Navigate to the db_image table.

2. Upload the image that you want to use as the background.

Note the Name of the image record (this will be used in CSS).

Step 2: Open Page Editor

1. Open your Service Portal.

2. Click on Instance in Page Editor.

In the Page Editor hierarchy, select the Landing Page (or the page where you want the background image applied).

Step 3: Add CSS

1. Scroll to the CSS section of the selected page.

2. Add the following CSS:

body {
background-image: url('la_jolla_sp_login_background.png');
background-size: cover;
background-repeat: no-repeat;
background-position: center;
}

[GlideFather]

Hi @Saba Baig,

I believe there's an easier way, navigate to the ESC (switch the scope to Employee Centre), press control*** + right mouse button to the container to get the window as seen below:

*** I use MacBook, so the key shortcut may vary on other devices...

 

And select "Edit Container Background":

 

There's a change to upload the image easily and based on its size/resolution, you can select the style (cover, repeat, ...).

It will make the background look like this (compare with the image above😞

 

It's more or less the same asyou shared but I believe this is more convenient method. What do you say?

[Saba Baig]

The above way which you showed is for search box background whereas  my solution is for whole background.

[GlideFather]

@Saba Baig I tried your method and it didn't work, can you please share screenshot from the configurations to see what you did and also how it looks as result?

 

[Saba Baig]

Please refer below portal image , there are 2 images 
1. search box background (Grey) 
2. The larger image