Customized modification of Google Blogger page turning function

Original link: https://www.williamlong.info/archives/6934.html

Blogger.jpg

The page-turning navigation experience at the bottom of Google Blogger is actually not very good. There are two optimization methods. One is to hide the page-turning navigation bar through a plug-in, and automatically turn the page after sliding to the bottom. The other method is to use a template. The default display of the middle page is “older blog posts” and “newer blog posts”, and “older blog posts” and “newer blog posts” are changed to “next page” and “previous page”.

Browse automatic page navigation

It is optimized through a third-party plug-in Infinite Ajax Scroll . The effect is: when browsing to the bottom of the page, the content of the next page is automatically loaded, that is, the drop-down loading effect. This effect allows users to avoid clicking “Next page”. ” button, you can also turn pages, whether on a PC or a mobile phone, the experience is very good.

The specific modification method is: in the layout interface, add the HTML/JAVASCRIPT widget, and then add the following code in it.

let ias = new InfiniteAjaxScroll(‘.blog-posts’, {

item: ‘.date-outer’,

next: ‘#blog-pager-older-link a’,

pagination: ‘#blog-pager’,

spinner: ‘.loader’,

});

ias.on(‘load’, function(event) {

event.nocache = true;

});

Modify page turning text

In the Blogger template, the default display of page turning is “older blog post” and “newer blog post”, which can be modified to “previous page” and “next page”. The specific modification method is as follows:

Enter the Blogger background, select “Theme” – “Edit HTML”, click on the blank space in the code box, and then press Ctrl+ F .

Type and look for <data:newerPageTitle/> in the search box, and when you find it, replace it with “previous page”.

Type and look for <data:olderPageTitle/> in the search box, and when you find it, replace it with “next page”.

After that, save the theme template, open the home page again, and you will find that “older blog posts” and “newer blog posts” have been replaced with “next page” and “previous page”.

This article is reprinted from: https://www.williamlong.info/archives/6934.html
This site is for inclusion only, and the copyright belongs to the original author.