How can you add a custom text to the "Continue Course" button on the course homepage, and "Lesson" section titles for each section of lessons?

Hi. I am using a Sqaurespace course page to create an intro guide for our new clients when we on-board. I need to change the wording of "lesson" and "course" to "topics" and "guide". How do you change the Buttons that appear on the course homepage of "Start Course" and "Continue Course", to "Start Guide" and Continue Guide". I also need to know how to change the lesson count on the right side of each group of lessons to "topics".

https://valcollective.com/working-with-val-collective

Change texts in these positions?

Yes!

I able to fix the "Complete and Continue". I just need the "Start Course" and "Lessons" Changed to "Start Guide" and "Topics". 

Thank you!

On 3/26/2024 at 12:32 AM, danim said:

Hi. I am using a Sqaurespace course page to create an intro guide for our new clients when we on-board. I need to change the wording of "lesson" and "course" to "topics" and "guide". How do you change the Buttons that appear on the course homepage of "Start Course" and "Continue Course", to "Start Guide" and Continue Guide". I also need to know how to change the lesson count on the right side of each group of lessons to "topics".

https://valcollective.com/working-with-val-collective

 

Page url doesn't work now. Can you check it again?

Does this work now? https://valcollective.com/lets-get-started

Thank you @tuanphan

On 5/2/2024 at 2:16 AM, danim said:

Yes!

I able to fix the "Complete and Continue". I just need the "Start Course" and "Lessons" Changed to "Start Guide" and "Topics". 

Thank you!

Use this code to Code Injection > Footer or Page Header Code Injection

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.0/jquery.min.js"></script>
<script>
$(document).ready(function(){
    $("span.course-item__course-action-button-text.course-item__course-action-button-text--active").html(function() { 
          return $(this).html().replace("Start Course", "Start Guide");  
    });
      $("span").html(function() { 
          return $(this).html().replace("Lessons", "Topics");  
    });
});
</script>

The code fixed the "lesson" labels but not the top section for some reason. All others changes to "topics" correctly. See picture. Also the code for the "Start Button" Course didn't work. It made the button disappear completely.  

It also effected the button styles. The buttons no longer have the designed box around them through the entire guide now, and can not edit in "design"

I just tested again the code from my browser and it still works here.

Can you add & keep the code? I can check easier