Change Next/Previous navigation on Rally blog navigation

Site URL: https://www.littleblackboxcollective.com/blog/simon-open-door-2020

Hi,

I am looking to change the navigation on our blog posts (Rally template) to change Previous to "Newer post" and Next to "Older Post".

I have tried advice from another thread on this forum with some code injection but unfortunately it didn't work.

Any help would be appreciated!

Thanks

Hi Mark, that's brilliant, it worked a treat!

Thanks very much.

I have the same issue but This code didn't work for me. The url is https://www.jeuno.fr/blog

13 hours ago, martinp said:

I have the same issue but This code didn't work for me. The url is https://www.jeuno.fr/blog

Try this

<script>
  (function() {
    window.addEventListener('load', function() {
        var paginationLabels = document.querySelectorAll('nav.blog-list-pagination span');

        for (var i = 0; i < paginationLabels.length; i++) {
            var text = paginationLabels[i].textContent;

            text = text.replace("Billets plus récents", "Newer Post");
            text = text.replace("Billets plus anciens", "Older Post");

            paginationLabels[i].textContent = text;
        }
    });
})();
</script>

On 1/15/2024 at 6:47 AM, tuanphan said:

Try this

<script>
  (function() {
    window.addEventListener('load', function() {
        var paginationLabels = document.querySelectorAll('nav.blog-list-pagination span');

        for (var i = 0; i < paginationLabels.length; i++) {
            var text = paginationLabels[i].textContent;

            text = text.replace("Billets plus récents", "Newer Post");
            text = text.replace("Billets plus anciens", "Older Post");

            paginationLabels[i].textContent = text;
        }
    });
})();
</script>

 

this worked great thanks! is there a way to remove the arrows too? they look relly strange now.

On 1/26/2024 at 12:11 AM, martinp said:

this worked great thanks! is there a way to remove the arrows too? they look relly strange now.

 

Add this code under

<style>
  .blog-list-pagination-icon.icon.icon--stroke {
    display: none;
}
</style>