HTML & CSS

Hello Docebians!This is me again...Sorry to bother you again… I'm working now on channels...I know I can assign and allow experts to upload content.However, IN THE CHANNELS SECTION is there a way to hide- with CSS- the arrow channel for members, not experts? Here this is what I mean.…  Once you click on the arrow, the menu appears  I want members not to see the arrow there -upload content-. Only the experts to see it.It's confusing for membersThanks in advance @DPatel  @roberto.moscatelli

Hi everyone,Does anyone have issue with seeing their footer? Ours just disappeared (both public facing page and logged in) but I checked our white label setting and our custom footer (using CSS) is turned on. Very strange…Thanks in advance!Teresa

Do any of you know of a reliable way to turn off the “keep me logged in” functionality?I can’t seem to find the right CSS:div[class='ui-input-checkbox'] {    visibility: hidden !important;}Nor does this jQuery seem to be working correctly:$("label[for='ui-input-checkbox-14']").hide(); These do work from the console, so I’m guessing it has something to do with the modal window itself.

I’m trying to use HTML widgets to load images for multiple languages that will each be linked to separate catalogs. Using the WYSIWYG works great to add the image to the widget, but no matter what sizing on the image I try, I cannot get the alignment I’m looking for. The widget automatically adds <p> to the HTML which creates whitespace, I’m able to remove the whitespace but that makes the widget slightly shorter than the carousel I have next to it.Whitespace whitespace removed but widgets different sizes - both HTML/WYSIWYG widgets - both images set to 220px

We have set up a test, and the first “question” is a title type. A screenshot of the setup is below. You will notice bullets next to part 1 and part 2.When we view the test the way a learner would however, the bullets are missing. Screenshot below. When I inspect that element on the page, I can see that it has proper unordered list tags, so the only thing I can assume is that those elements are not styled properly when it comes to tests. Screenshot below. I did go and remove all of our custom styles to see if I had done some

Hi Community members, Does anyone have experience on creating a ‘Carousel Style’ My courses and Learning plans display? The easiest way to describe this would be the ‘Netflix look’.Currently this widget only allows ‘Card’ and ‘List’.Would be happy to learn from you or create this as an idea if that’s something you see as useful as well.

Hello everyone!I recently have begun attempting some HTML/CSS coding endeavors on our homepage to hopefully make a more organized and clean experience for our users. I found a course on Docebo University, titled Take Platform Design to the Next Level and it generously supplied some ideas and accompanying codes. I implemented the ‘Custom Icon Boxes’ on our homepage, this is what it looks like on Screenshot #1 and I am very happy with the size and layout of the boxes, but there is a few things I would love some support on if anyone is willing to help.Is there a way to get rid of the white edge that borders each box? I would ideally love to have the box just be the solid color. I would love to upgrade the design and text on these boxes to make it look a little more professional or ‘finished’. I love the border and ‘button’ look of t

Hi therePlease could some one help me out with how we could edit the footer on the home page to add an image? and how I figure out recommended sizes for the images please?Ideally I'm trying to adjust the whitespace at the bottom? Any help appreciated!!! ThanksSam 

Hi, all. I’m currently working on an unpublished duplicate page of our homepage. I have added a html/WYSIWYG widget to the page that has simple text and some custom CSS that I’ve added to the appropriate custom style area in our Docebo instance. I searched the page’s code via inspect elements and found the proper id to use as a selector in the CSS, and the new widget appears correctly on the page.However….The widget seems to be appearing twice -- almost like it’s stacked on top of one another.This is what’s rendered on the pageThis is the custom CSS code

Trying to hide the page title wrapper on a certain page but can’t seem to get the below to take: #doc-page-575 #page-title__wrapper { display: none !important;}Only able to get the below to work on all pages:#page-title__wrapper { display: none !important;}Any ideas? Thanks!

The “graduation cap” icon for the Ask an Expert button in Discover Coach & Share is fairly meaningless to our users, and creates a lot of confusion. Has anyone found a way (using CSS?) to swap out that icon for something else? Thanks!

Hi All,I am trying to add personal summary or Activity page (Transcript) as Iframe. Is there any way, I could do it. The internal page can’t be Iframed is the message that I get. Any Idea if it is doable? I have re-directed pages with same banner as first html widget, However Activity page is not falling in place. 

We would like to promote our subscription program to our non-subscribers. We don’t want to bother our subscribers with this information.Does anyone know if it’s possible to show a widget/image/text to non-subscribers only?I could not find anything useful in the CSS for this purpose.

Hello! I am hoping some one can help me. At one point we added a scroll bar with a forced height to out Activity Stream widget on our home page. This has since stopped working. Does anyone have any advise on how I can modify the CCS to have it work again? /* Added scroll bar for Activity Stream Widget on page*/#doc-widget-31 {    height: 450px;    overflow:scroll}

 Can anyone help me remove the above? I have tried:  .lrn-course-player.lrn-widget-session-completion-status-open {display: none;}.lrn-widget-session-completion-status-open {display: none;}lrn-widget-session-completion-status-open {display: none; What am I missing?

I notice that AWS skill builder and Docebo University both have the same responsive full page course design with table of contents on the left, and scrollable content for 80% of the interface. The content then includes flip cards, tabs, accordions, videos, images, text, and quizzes in similar styles, although the Amazon version is slightly cleaner.I am interested in replicating this look for at least some of the e-learning courses on my platform. Since these are so similar, is there a “standard” method to achieve this look and functionality? I can design this if needed, but hoping there are shortcuts in the form of templates, etc. to expedite.Here are the two examples of the look and function I am referencing:https://explore.skillbuilder.aws/learn/course/134/play/99519/aws-cloud-practitioner-essential

Hello,Has anyone had any luck withdisplay: none;on either of these two elements on the new course player?Can’t get anything to stick - thanks

Hi! How do I remove or make transparent the overlay in the course player? I have tried all sorts of nonsense. I put this code in the Configure Branding and Look > Course Player area:.lrn-course-player-training-material-idle-view-overlay {    background-color: #ffffff;    opacity: 0;}Doesn’t work. 😪 Please help! 

The table cells do not show up when you are actually taken the test?  Is there anyway to have the table cells show? This is now it displays when taking the assessment 

Hi community!Has anyone managed to changed the border colour (on hover) for the course icons? Thank you!

hi, I am trying to add an interactive reaction buttons html widget to my LMS homepage. when I test the code on an external platform, it seems to work fine, but when I try to add this to an HTML widget, for some reason the buttons are not visible, and the html code I am adding in the widget configuration settings, disappears. is there any additional configuration I need to do here?would appreciate any help, thanks! 

Here’s some CSS that will adjust the new course player to “light mode” if you don’t like the default look and feel. Insert the following into the CSS editor:/* Light Theme */lrn-course-player-play-area { --ui-color-layout-contrast: rgba(255, 255, 255, 1); --ui-color-typography-negative: rgba(33, 39, 33, 1); --ui-color-border-accessibility-default: rgba(228, 230, 229, 1); --ui-color-layout-overlay-dark: rgba(255, 255, 255, 1);}lrn-training-material-header,.lrn-course-player-table-of-contents-header,.lrn-course-player-training-material-idle-view-content { --ui-color-icon-negative: rgb(73, 43, 43); --ui-color-icon-neutral: rgba(255, 255, 255, 1);}lrn-training-material-header button,.lrn-course-player-table-of-contents-header button,dcb-ui-list-item-training-material-content,.lrn-course-player-training-material-idle-view-content { -

Hello, So I had a client ask me if there was another way to create a “2nd” sign in button on the Sign in page. In this client’s use case they want to quickly point learners who were external to use the Extended Enterprise if they accidentally arrived at the main parent platform page. Please see the Look of the Sign and Page, the header I created, and the CSS I use to style the Sign in Button which is a link to Extended Enterprise.   CSS Used:/*Use to Edit Header Sign in Button Me

Can anyone share any CSS wizardry to hide the Completion Status box in the ILT player? It’s irrelevant in my situation.  

Hey everyone,I’m wondering if anyone here uses iframes and if you do, where do you host external files?Currently we have a rotating carousel image banners, with the images being hosted from another server. I was thinking if there are options or workaround for hosting the files within Docebo rather than pulling the urls from another server?