Best Answer

Hiding Contextual Help icon

  • 14 December 2021
  • 15 replies
  • 194 views

Userlevel 7
Badge +6

Does anyone have CSS code to hide this icon? We are trying to strip down one of sites to have minimal options in the top bar...Was able to find a way to hide global search but would appreciate if anyone has this code is they can share. Thank you.

 

icon

Best answer by nick.tosto 14 December 2021, 22:03

View original

15 replies

Userlevel 2

Hi @lrnlab,

I have this that my implementation specialist shared. You might be able to work with it. I haven’t used it myself.

/*hide contextual help question mark (but not link)*/

div.zmdi.zmdi-help{

    display:none;

}

Userlevel 5
Badge +1

@malicm while I think that CSS would work, I’d be worried it would hide all question mark icons throughout the platform, which may not be good.

I might try this code instead:

.internal-header-suggestion-balloons {
display: none !important;
}

 

Userlevel 2

@nick.tosto Good to know. I will be sure to note that on what the implementation specialist gave me. Thank you!

 

Userlevel 7
Badge +6

Thanks @nick.tosto that worked.

Userlevel 2

@nick.tosto and @lrnlab - does using this css prevent the help from popping up at all as well? It seems to have hidden the button from the menu bar but the balloons still pop up. Is there a way to turn them off altogether?

Userlevel 7
Badge +6

@KatieD sadly it does not...actually makes it more stressful to have to click them all off one by one LOL

Userlevel 5
Badge +1

Since it was brought up in a different thread here in the community, I thought I would share that you can hide the pop-boxes themselves with CSS as well:

 

.bg-main.docebo-balloon.color-white {display: none;}

 

Userlevel 4
Badge

This might be a question for the experts, but isn’t the contextual help supposed to go away and stay hidden once you’ve closed it or turned it off? I know it doesn’t, but I’m curious if that’s a bug or a feature. 😅

Userlevel 7
Badge +6

HI @nick.tosto seems to be working as expected, thanks for the code Nick!

Userlevel 7
Badge +6

HI @nick.tosto a couple notes on using the CSS…

  • if you do not also add code to hide the actual question mark icon, and the user selects it, it actually supersedes the CSS code and turns ON the help
    • logging out and back in resets it to OFF
  • if you impersonate a user, the help is automatically turned back on when the admin returns to their page

Don you have another way to make this more permanent? Thank you

Userlevel 5
Badge +1

@lrnlab it seems like there were a few invisible characters in the code I pasted above between the open curly brace and “display” that was making it so the CSS didn’t work properly. I just updated it and it seems to be working consistently now. Let me know if it still doesn’t work.

Userlevel 7
Badge +6

Hi @nick.tosto tried with this code and dont see any difference..same as mu notes above...did I  miss something?

.bg-main.docebo-balloon.color-white {​​​​display: none;} 

Userlevel 5
Badge +1

@lrnlab weird, looks like it was still doing it. You can tell if you copy and paste the code into a text editor you’ll see something like this:
 

 

I just edited the code above again and I think those characters are gone but it doesn’t hurt to double check.

 

If you’re seeing the below in the Custom Styles area after you paste it in, you’ll know it’s still not working:

 

Userlevel 7
Badge +6

@lrnlab weird, looks like it was still doing it. You can tell if you copy and paste the code into a text editor you’ll see something like this:
 

 

I just edited the code above again and I think those characters are gone but it doesn’t hurt to double check.

 

If you’re seeing the below in the Custom Styles area after you paste it in, you’ll know it’s still not working:

 

yes that’s what I’m seeing (the grey error message) - how can we get this working?

Userlevel 5
Badge +1

@lrnlab I expect if you type the code out instead of copying and pasting it would work properly

Reply