Here is what works for me:

.profile {

background-size: cover; background-color: blue; background-position: center center; }

I guess if you’re wanting the widget to be a different color than the rest of your theme you’ll need CSS.

Otherwise, this will change it too. (along with some other things.

But you probably already knew that.

Hi Dan

Here’s what I found

div.course-completed-ready.ng-star-inserted {

  background-color:hide;

}

div.profile {

  background-color: #ff5722;

}

You’ll need to change the hexi for the Background color

Dave

@sigamoline and @Dlibengood - thank you! Siga - you did something neat with yours how did you customize that message????

There a few customizations that I do. I add text and removed the “password” button since my users are all SSO.

I showed how to change the color. I am also going to show you an example here on how to put in an image as a background for you profile widget.

.profile {

background-size: cover; background-image: url("https://cdn5.dcbstatic.com/files/s/p/sprayingecs_docebosaas_com/userfiles/13499/spray410x200.png"); background-position: center center; 

}

.fullName::before { 

  content: "Hello, ";

}

.fullName::after { 

  content: " -  Welcome to SprayUniversity! ";

}

/* hide the password reset option */

myprofile-widget > div > div > div.widget-actions-container > widget-action-button:nth-child(1) > div {

     display: none !important;

}

Example:

@sigamoline 

Nice use of  ::before  and  ::after

@gstager Thanks! Someone showed me that trick around 5 or 6 years ago. I am so happy we have this platform for everyone to share what they have learned.

Yawl are awesome. This so made my day.

@sigamoline 

I am just starting to build our Docebo platform - and already was trying to solve this - as someone with no CSS skills - thanks!  One thing (actually 2) - I want to have Hello first name and last name with no other message.  And I am trying to link to an image on our server but can’t make that work - hate to ask - but can you assist?

I’m very new to CSS. where do I put this code?? 

@Loconnorrmc - Hey - you probably can figure out a hack - but the Profile widget was meant for the profile. I think you definitely can get clever with CSS and exploit it for this. For example you can take widget make it a single row and start off with your welcome.

For the server component - reach out to the Docebo service desk…there may be many reasons for that not working.

@KC_SS - Start here: https://www.docebo.com/knowledge-base/activate-manage-themes/#post-simple-toc-heading-5

@dklinger Thanks.  I have the name working - I just needed to activate the first name last name in the advanced settings - so that is solved and looks great. Certainly will reach out to support about the image - and a way to use one from our server.  Appreciate the note!

This fix was working for me, but just recently (since the beginning of the year maybe?) this code isn’t working and the background color is still on top. When I inspect the page, the CSS is there, but the background color is still “covering” it.

Halp