How to change the Courses text for ‘Start Course’, ‘Lesson’ and more - Squarespace 7.

Want to edit the “Start Course” button or change the phrase of the “lessons” within the relatively new Courses functionality?

We’ve found that people want to use this new functionality for different purposes, and so want the ability to change the text.

Well using the code below, this is now possible. This code does a lookup on the exact word and the replaces it with another word.

Add the following code to Website Tools > Code Injection > Footer

---

<!-- Courses Text replacer -->
<script>
  document.addEventListener('DOMContentLoaded', function() {
    // Replace 'LESSONS' with 'VIDEOS' in the side nav
    var elements = document.getElementsByClassName('course-item__side-nav-chapter-metadata');

    for (var i = 0; i < elements.length; i++) {
        elements[i].textContent = elements[i].textContent.replace('LESSONS', 'VIDEOS');
    }

    // Customize button texts on the Course Overview page
    elements = document.getElementsByClassName('course-item__course-action-button-text');

    for(var i = 0; i < elements.length; i++) {
        var buttonText = elements[i].textContent.trim();
        if(buttonText === 'Start Course') {
            elements[i].textContent = 'Start the Video'; // Change to desired text
        } else if(buttonText === 'Continue Course') {
            elements[i].textContent = 'Continue the Video'; // Change to desired text
        } else if(buttonText === 'Retake Course') {
            elements[i].textContent = 'Retake the Video'; // Change to desired text
        }
    }

    // Customize next lesson/video texts on the lesson pages
    elements = document.getElementsByClassName('course-item__next-lesson-text--incomplete');
    var elements2 = document.getElementsByClassName('course-item__next-lesson-text--complete');

    for(var i = 0; i < elements.length; i++) {
        if(elements[i].textContent.trim() === 'Complete & Continue') {
            elements[i].textContent = 'Continue'; // Change to desired text
        }
    }

    for(var i = 0; i < elements2.length; i++) {
        if(elements2[i].textContent.trim() === 'Next Lesson') {
            elements2[i].textContent = 'Next Video'; // Change to desired text
        }
    }

    // Replace 'Lesson' with 'Video' in the Course Overview
    elements = document.querySelectorAll('.course-item__side-nav-chapter-metadata, .course-list__list-chapter-item-chapter-meta span:first-child');

    for(var i = 0; i < elements.length; i++) {
        elements[i].textContent = elements[i].textContent.replace('Lesson', 'Video');
    }
  });
</script>