Replacing SQSP Default text with jQuery

Hi everyone, I've browsed the web looking for and trying different solutions to replacing "Read more", "Next", "Previous" and other sorts of default texts in my template. None of them worked for me using the Mojave template.

In the end I figured out using text.replace with jQuery would work. So I want to share my solution.

First you have to include jQuery in your template by going to Settings > Advanced > Code Injection

Paste this in the header injection:

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js></script>

After this you need to find the target class for the text you want to replace, in my template it was ".BlogList-item-readmore".

Then add the following code to your footer injection:

<!-- Start of replace "Read more" -->
<script>
$(".BlogList-item-readmore").text(function () {
    return $(this).text().replace("Read More", "Replace me"); 
});
</script>
<!-- End of replace "Read more" -->

This means that if the div, span, section or whatever you target by class, contains the text "Read more", it will be replaced with "Replace me". 

Hope this helps someone :)

Thanks.

I usually use this

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script>
$('.BlogList-item-readmore:contains("Read More")').text('Tuan SS');
</script>