Code Snippet Explanation

This code snippet removes the ability to click into course tiles on the Path Detail page. This is to avoid the scenario where a user starts taking courses in a Path without registering for the Path first, streamlining Path analytics progress reporting. There is also some Javascript that makes it so you can still click the "Show Overview" button to see the lessons in a course if the "Expanded Details" Path layout setting is turned on.

This code snippet will apply to all Path objects and does not need to be edited. It is plug and play.

Installation Instructions

Step 1: Navigate to the Code Snippets section of your domain Theme and paste the below code at the bottom of the Global Code Snippet. 

Snippet Code - Add to Global Code Snippet in Theme:

<!-- START Remove clickable course tiles on Path Detail Page. Global Code Snippet -->
<style>
/* path details page - remove pointer events for course tiles */
.sj-page-detail-path .coursebox-container{
    pointer-events: none;
} 
</style>
<script>
/* Add pointer event back in to "Show Overview" button IF expanded details path
view setting is turned ON. Allows the lesson list to be viewed for a course */
document.addEventListener("DOMContentLoaded", function() {
  var sjPageDetailPath = document.querySelectorAll('.sj-page-detail-path');
  if (sjPageDetailPath.length > 0) {
    //check for expanded details path view and add pointer event back in
    var courseOverviewToggle = document.querySelectorAll('.course-overview__toggle');
    if (courseOverviewToggle.length > 0) {
      for (var i = 0; i < courseOverviewToggle.length; i++) {
        courseOverviewToggle[i].style.pointerEvents = "initial";
      }
      var courseOverviewContentLesson = document.querySelectorAll('a.course-overview__content__lesson');
      for (var j = 0; j < courseOverviewContentLesson.length; j++) {
        courseOverviewContentLesson[j].style.pointerEvents = "none";
      }
    }
  }
});
</script>
<!-- END Remove clickable course tiles on Path Detail Page. Global Code Snippet -->