Skip to main content
Best Answer

How to suppress Instructor names on Course summary screen using CSS?

  • August 28, 2024
  • 9 replies
  • 156 views
L

Hi - Wondering if anyone knows how to use CSS to hide the Instructors listed by default on the course summary screen? The attached image shows the Instructors highlighted in yellow. Many of the instructors are not with the company any longer and we would like to just have the list suppressed all together if we can find some CSS to do that. The only other solution I currently found is to unenroll the Instructors, but we don’t want the active instructors to be displayed either.

Thanks for any ideas!

 

Best answer by modonetwork

Hi @laramarlin ,

Here is the CSS code to hide only the instructors from the page you mentioned. Please note that this will only remove the instructors from the specified page and will only affect the browser view, not the mobile app.

/* MODO : CSS to remove the instructors from the course catalog */ 
classroom .course-head .course-head-content .mdl-grid .mdl-cell:nth-of-type(2) .course-info li:first-child {display: none;}

Additionally, please be aware that this code is designed for the “old” version of the course players. Once your platform updates to the new player (by the end of the year?), this code will no longer be effective.

Let me know if it works for you.

Best regards, MODO

DaveBee

9 replies

lrnlab
Hero III
Forum|alt.badge.img+10
  • lrnlab
  • Hero III
  • August 28, 2024

following

modonetwork
Contributor I
Forum|alt.badge.img
  • modonetwork
  • Contributor I
  • Answer
  • August 29, 2024

Hi @laramarlin ,

Here is the CSS code to hide only the instructors from the page you mentioned. Please note that this will only remove the instructors from the specified page and will only affect the browser view, not the mobile app.

/* MODO : CSS to remove the instructors from the course catalog */ 
classroom .course-head .course-head-content .mdl-grid .mdl-cell:nth-of-type(2) .course-info li:first-child {display: none;}

Additionally, please be aware that this code is designed for the “old” version of the course players. Once your platform updates to the new player (by the end of the year?), this code will no longer be effective.

Let me know if it works for you.

Best regards, MODO

MODO
lrnlab
T
T
Contributor III
Forum|alt.badge.img
  • talya.pacheco
  • Contributor III
  • October 9, 2024

@modonetwork Do you have a code to remove the instructors from the additional information tab as well? I got it out of the header, but i want it out of here too!

 

 

modonetwork
Contributor I
Forum|alt.badge.img
  • modonetwork
  • Contributor I
  • October 10, 2024

Hi @talya.pacheco ,

Here’s the code to remove the instructor from the Additional Information tab:

/* MODO : CSS to remove the instructors from the additional */ 
classroom .course-tabs #panel-2 .additional-information .instructor-info {display: none;}

Let me know if it works for you.

Best regards,

MODO
T
Contributor III
Forum|alt.badge.img
  • talya.pacheco
  • Contributor III
  • October 10, 2024

Hi @modonetwork I was actually looking to remove the tab all together. Do you know how to do that?

THe code above did not work to erase the content from the tab but I was able to do it with this, but it erases all conent for all the tabs and #panel-2 doesnt work because the panel number changes on the courses 

 

classroom .mdl-grid .mdl-cell .course-tabs .tabs :last-child .tabs-body  {
    display: none;
}

 

Here is a screenshot of the inspection with the code removed.

 

 

 

As you can tell I am fairly new to CSS. So maybe this can’t even be done. THanks for all the help.

modonetwork
Contributor I
Forum|alt.badge.img
  • modonetwork
  • Contributor I
  • October 10, 2024

Hi @talya.pacheco ,

If you want to remove the entire "Additional Information" tab, here is the CSS code:

/* MODO: CSS to remove additional-info tab */
classroom .course-tabs .tabs .tabs-head .mdl-tabs__tab-bar .tabs-header_element:last-child {
    display: none;
}

Best regards. MODO

MODO
T
Contributor III
Forum|alt.badge.img
  • talya.pacheco
  • Contributor III
  • October 10, 2024

@modonetwork This is hiding them all. I dont know what im missing 

 

Update i got it!!! YOUR THE BEST

dklinger
Hero III
Forum|alt.badge.img+11
  • dklinger
  • Hero III
  • February 5, 2025

Morning from the East Coast - curious if someone has figured this out (CSS to hide instructor information) for the new course player.

Maybe you can save us a cycle.

modonetwork
Contributor I
Forum|alt.badge.img
  • modonetwork
  • Contributor I
  • February 7, 2025

Hi ​@dklinger ,

try this one: 

/* Hide Session Instructors in Course Page when enrolled*/
.lrn-widget-session-tabs-wrapper dcb-ui-tabs-horizontal-header-item[aria-label="Instructors "]{display: none !important;}
lrn-widget-content-instructors{display: none !important;}

/* Hide Session Instructors in Course Page when not enrolled*/
.lrn-list-item-session-wrapper .lrn-list-item-session-content-colophon .lrn-list-item-session-content-colophon-list-item[data-dcb-ui-aria-label*="instructor"]{display: none !important;}

/* Hide Event Instructors in Course Page when enrolled*/
lrn-widget-session-event-details lrn-widget-content-instructors{display: none !important;}

/* Hide Event Instructors in Course Page when not enrolled*/
lrn-widget-event-list .lrn-widget-event-list-colophon-list-item:has(.lrn-widget-event-list-event-instructors-count){display: none !important;}

Very best from Italy 🖐

 

MODO
Terms & ConditionsCookie settingsAccessibility statement