Showing results for 
Show  only  | Search instead for 
Did you mean: 
Community Contributor

Display course title breadcrumbs

I have a question and I'm hoping someone could lend some advice.  We have some code to display the course title in the breadcrumbs and course term and course code above the course menu.  Now when on user's details page in a course, it no longer works.  Here's the code:

$(document).ready(function() {
  if ($("body").attr("class").match(/\bcontext-course_(.[0-9]*)/)) {
     //insert course ID into variable
      var courseID = $("body").attr("class").match(/\bcontext-course_(.[0-9]*)/)[1];

        $.getJSON("/api/v1/courses/" + courseID, "include[]=term", function(data) {
          $("#breadcrumbs ul li:nth-child(2) a span.ellipsible").html(;
          $('#section-tabs-header-subtitle.ellipsis').html( + '<br>' + data.course_code);

        }); //end get jSON     

    }//end check if it is a course
});//end on document ready

I'm stumped as to why it's not triggering on a user's details page when in a course and I really want that a-ha! moment.    

Tags (2)
0 Kudos
5 Replies
Community Contributor

This is a cool idea. I will see if any of my team members can see what the issue.could be.

Community Contributor

So, we looked at the code and it seems to be working mostly. We do not use sections, so we cannot see if that part of the code is working, but we did see the name change in the breadcrumbs that the javascript was doing. 

Community Contributor

Do you see it display across all pages even when you view the Course Analytics page?  It works across most of a course, but so far it's not triggering on the Course Analytics page or when clicking on a student and viewing their user details page.  

Community Champion

Hi Lisa --

The code (and specifically line 3) is looking for a CSS class on the <body> tag that's in the format "context-course_###" where ### is the actual course code. If you view the page source and look at the body tag on the pages where this code does work, you'll see something like: 

<body class="with-left-side course-menu-expanded with-right-side padless-content pages home primary-nav-transitions context-course_5 lato-font-not-loaded-yet">

but when I browse to the Analytics page, here's what the body tag looks like:

<body class="full-width primary-nav-transitions lato-font-not-loaded-yet">

Since that tag doesn't contain anything that looks like "context-course_###", the function isn't going to do anything on the Analytics page. I haven't inspected the user detail page, but the same thing could be happening there, or the markup for the breadcrumbs could be different there which could have the same effect. 


Community Coach
Community Coach

 @baxl ,

Were you able to find an answer to your question? I am going to go ahead and mark this question as answered because there hasn't been any more activity in a while so I assume that you have the information that you need. If you still have a question about this or if you have information that you would like to share with the community, by all means, please do come back and leave a comment.  Also, if this question has been answered by one of the previous replies, please feel free to mark that answer as correct.