Jonnylbbc Posted January 24, 2021 Share Posted January 24, 2021 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 Link to comment
Solution markvigeant Posted January 26, 2021 Solution Share Posted January 26, 2021 Hey there- I just solved a similar issue on a blog on the Margot template. Here's the code I used, with the appropriate class names taken from Rally. Toss this into your header and let me know if you need anything else! <script> (function() { window.addEventListener('load', function() { var paginationLabels = document.querySelectorAll('.BlogItem-pagination-link-label'); for (var i = 0; i < paginationLabels.length; i++) { var text = paginationLabels[i].textContent; text = text.replace("Previous", "Newer Post"); text = text.replace("Next", "Older Post"); paginationLabels[i].textContent = text; } }); })(); </script> tuanphan 1 Link to comment
Jonnylbbc Posted January 29, 2021 Author Share Posted January 29, 2021 Hi Mark, that's brilliant, it worked a treat! Thanks very much. Link to comment
martinp Posted January 14 Share Posted January 14 (edited) I have the same issue but This code didn't work for me. The url is https://www.jeuno.fr/blog Edited January 14 by martinp Link to comment
tuanphan Posted January 15 Share Posted January 15 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> Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message Contact Customer Care - Learn CSS - Buy me a coffee (thank you!) Link to comment
martinp Posted January 25 Share Posted January 25 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. Link to comment
tuanphan Posted January 28 Share Posted January 28 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> Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message Contact Customer Care - Learn CSS - Buy me a coffee (thank you!) Link to comment
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment