How to add the background image for homepage of Employee center PRO

Santoshi5 · ‎02-15-2022

Hi ,

Can anyone let me know how to add the Background image for Employee center pro,

As per the other posts i know how to add the background image for Employee service center using the content Delivery module,

But i am not able to see the module to change the background image for Employee center Pro.

Rob Sestito · ‎02-15-2022

You can add a background image a couple of ways.

The way I did ours was right within the Container itself when designing from the Page Designer of the portal.

While on your portal page, hold Ctrl and right-click on one of the widgets. You will get a pop-up menu and you can select Page in Designer:

From the Page Designer, you can choose any container you want to have an image for a background.

Here, I am clicking on the widget I am using, and you will see your bread crumbs - select Container, then you can modify like so:

Be sure you are in the correct application so you have access to modify, but here is what the menu should look like when you edit a container:

Here you have the option to add in a background image.

Here is one of my background images for the top of the portal page - this was all done by me adding an image into the Background Image option I just showed you.

Hope we were able to lend you some options as to how to add a background image.

Cheers,

-Rob

View solution in original post

Rob Sestito · ‎08-29-2022

Hello @yandp -

Have you tried removing the Parent Class to be empty, and switched your width to Fluid rather than Fixed?

Or, just changing from Fixed to Fluid for the Width and keep your Parent Class as is.

Give those a try real quick if you haven't already. If you have and/ or when you do you still have the issue, please let me know.

Thanks,

-Rob

P.S. It might be good to start your thread on your issue and you can reference this post. That way in case I am unable to help, someone else will see the new post as unanswered.

Cheers!

Lorna · ‎12-14-2022

Hi Rob, I'm having the same issues and I tried your solution. It's still now showing the banner

BMX_ · ‎05-30-2024

Update Employee Center (plugin)
After upload, right-click the preview pic of the upload and select “Copy Image Link.”

Paste the URL in a new tab to verify the picture is correct. (The picture may be smaller than the one you uploaded, which is fine)

The URL will look like:
https://devxxxxxx.service-now.com/b734904047018210d8a2962f316d43a6.iix
Copy the image file name: b734904047018210d8a2962f316d43a6.iix
Return to the Employee Center.
While holding the [CTRL] keyboard key, right-click the Search field
Select “Page in Designer”
At the top, click the button with a gear called “Page”

Copy and paste the very first CSS line to the 2nd line.
At the beginning of the first line, add a hashtag “#”.
In the 2nd line, replace the file name with your above image name.
The top two lines should now look like:

#$banner-768-svg : "d9bc1319533130101865ddeeff7b12ba.iix";

$banner-768-svg : "d8f12b6893aa02101d27326efaba1015.iix";

Click “Save” at the bottom.
If Employee Center still isn’t showing the background image, close browser completely and flush browser cache.