BEGIN 主题最新文章页面添加加载更多按钮

发布于 2020-07-10

BEGIN 主题最新文章页面添加加载更多按钮

使用 Begin 主题的博主可能都发现过这样一个问题:如果设置杂志布局,博客页面(本站叫最新文章)是不显示加载更多按钮图标的,而其他所有带分页的页面都显示。如果不显示加载更多按钮图标的话,我们就只能通过链接跳转的方式查看分页信息。本文简单分享一下博客页面显示加载更多按钮的实现方法。

产生原因

通过对比博客页面与分页页面的源代码(浏览器右键查看),我们会发现,博客页面引入的是 infinite-comment.js,而分页页面引入的是 infinite-post.js,所以,解决方法是让博客页面引入和分页页面一样的 js 文件。

查看源码

编辑 theme-setup.php 这个文件,找到下面这两段代码:

if ( zm_get_option('infinite_post') && !is_singular() && !is_paged() ) {
    wp_enqueue_script( 'infinite-post', get_template_directory_uri() . '/js/infinite-post.js', array(), version, true );
}
if ( zm_get_option('infinite_comment') && is_singular() ) {
    wp_enqueue_script( 'infinite-comment', get_template_directory_uri() . '/js/infinite-comment.js', array(), version, true );
}

因为博客页面是我们手动添加的一个单页面,单页面 is_singular() 会返回 true,而事实上,博客页面比较特殊,它是一个带分页的列表页面,与其它的单页面(比如留言页面)是有区别的,不应该把它当作单页面,所以我们需要修改 is_singular() 代码处的判断逻辑。

修改方法

我们重新定义一个新方法 is_singular_2,将上面代码中的 is_singular 替换成 is_singular_2(两处都替换),然后在 theme-setup.php 文件末尾添加下述代码即可。

/*
 * 自定义函数 is_singular_2
 */
function is_singular_2(){
    $exp = "/blog"; // 若是以 /blog/ 或者 /blog.html 结尾,此处需要修改为对应的内容
    if(is_singular() && !end_with(get_request_url(), $exp)) {
        return is_singular();
    }
    return false; // is_singular() 为 true,请求路径以 /blog 结尾会返回false
}
 
/*
 * 自定义函数 end_with
 */
function end_with($url, $needle) {
    $length = strlen($needle);
    if($length == 0) {
        return true;
    }
    return (substr($url, -$length) === $needle);
}

/*
 * 自定义函数 get_request_url
 */
function get_request_url(){
    $url = home_url( add_query_arg( array() ) );
    return $url;
}

[mark_a]上述代码的基本逻辑是:判断是否是单页面,如果是单页面并且请求路径是以 /blog 结尾,则返回false,这样,博客页面就不再是单页面了。[/mark_a]

效果预览

修改完成后出现了加载更多图标:

结束语

Begin 主题的多个版本中都存在这个问题,这只是一个小小的问题,不影响正常使用,所以是否选择修改都没有关系。但是,如果你喜欢折腾的话,不妨通过本文的方法完善一下。如果有任何意见或建议,欢迎在下方评论处留言。

喜欢 1
奋楫笃行,臻于至善!

相关文章

BEGIN 主题搜索结果页面添加标题图片

BEGIN 主题可以给文章分类页面、独立页面以及文章详情页面添加标题图片,但是在搜索结果页面及 404 页面却无法通过配置添加标题图片,本文简单分享一下给搜索结果页面和 404 页面添加标题图片,以及...
阅读全文

WordPress 文章评论设置分页按时间倒序排序

WordPress 评论默认是按发布的时间顺序排列的,如果我们想按照时间倒序排列,可以根据本文的方法修改。 1、修改comment-template.php 编辑文件 wp-includes/comm...
阅读全文

使用 LetterAvatar 脚本生成首字图片替代默认评论头像

Gravatar 是全球通用头像,如果我们没有设置 Gravatar 头像,那么在网站上留言或评论就会显示默认的头像或者随机头像,这样的话用户体验不是很好。今天为大家分享一下使用 LetterAvat...
阅读全文

WordPress 文章链接地址 ID 不连续解决方法

Wordpress 默认情况下发布的文章 ID 不是连续的,是因为 Wordpress 自动草稿、文章修订版、页面、菜单、媒体等功能都要占用 ID,所以发布的文章 ID 一般是不连续的。今天为大家分享...
阅读全文

使用 iconfont 阿里矢量图标为网站添加图标的方法

Iconfont 是一个开源的矢量图标管理平台,它的图标库非常丰富,大概有一百三十多万个。Iconfont 可以按照需求定制图标字体库,还能随时修改,最重要的字体图标库只有 100 多 K。今天就来为...
阅读全文

外链图片缩略图不显示解决方法 A TimThumb error has occured

使用 timthumb 可以轻松实现缩略图自动裁剪的功能,但是由于某些原因,使用 timthumb 裁剪图片经常会出现缩略图无法正常显示的现象,错误提示为“A TimThumb error has o...
阅读全文

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注