WordPress 文章页添加3篇相关文章

网站跳出率（Bounce Rate)指某个时间段内，只浏览了一页即离开网站的访问次数占总访问次数的比例。跳出率是评价一个网站性能的重要指标，跳出率高，说明网站用户体验做得不好，用户进去就跳出去了，反之如果跳出率较低，说明网站用户体验做得不错，用户能够找到自己需要的内容。简单来说，跳出率越低的网站，SEO 效果越好。

然后这篇文章的这个小功能将会非常有效地降低网站的跳出率。虽然说在文章底部加一个假的页码导航有误导用户点击的嫌疑，但是从另一方面来说，同样合理的利用也将有助于用户更快查找自己真正需要的信息，从而大大节省用户宝贵的时间。
话不多说，显示效果如上图所示，至于实现方式请看下面，找到主题根目录下的 functions.php 文件，在其中添加如下代码：

```
<?php
```

//通过短代码添加 3 篇页码相关文章

function insert_3_related_posts($attss,$contents = null ){

	extract( shortcode_atts( array('idss' => ''),$attss ) );

```
	$contents = '';
```
```
	$postidss =  explode(',', $idss);
```
```
	$id1=$postidss[0];
```
```
	$id2=$postidss[1];
```
```
	$id3=$postidss[2];
```
```
	$contents .=  '
```
```
	<div class="page-3-related-posts">
```
```
		<span>1</span>
```

		<a rel="noopener noreferrer" target="_blank" href="'.get_permalink( $id1 ).'"><span>2</span></a>

		<a rel="noopener noreferrer" target="_blank" href="'.get_permalink( $id2 ).'"><span>3</span></a>

		<a rel="noopener noreferrer" target="_blank" href="'.get_permalink( $id3 ).'"><span><i class="fa fa-angle-right"></i></span></a>

```
	</div>';
```
```
	return $contents;
```
```
}
```

add_shortcode('insert_3_related_posts', 'insert_3_related_posts');

// 通过短代码添加 3 篇页码相关文章快捷按钮

function insert_3_related_posts_qtag() {

```
	if (wp_script_is('quicktags')){
```
```
?>
```
```
    <script type="text/javascript">
```

        QTags.addButton( 'insert_3_related_posts', '相关文章页码','【insert_3_related_posts idss=id1,id2,id3]');

```
    </script>
```
```
<?php
```
```
    }
```
```
}
```

add_action('admin_print_footer_scripts', 'insert_3_related_posts_qtag' );

源代码来自于博客 112，我又稍微调整了下以避免部分代码小白朋友更好使用。添加完成后应该会在主题文本模式下显示一个按钮，如下图所示：
额，没错。老古董的我还在用着经典编辑器。新版块编辑器直接插入短代码应该就可以了：

[insert_3_related_posts idss=id1,id2,id3]

注意将短代码中的 id 值修改为你想要的打开的文章 ID 。

CSS 样式

然后是样式美化一下，将如下代码添加到主题的样式文件中即可，比如 style.css 文件或 main.css 文件中。

/** 短代码添加 3 篇页码相关文章 */

```
.page-3-related-posts{
```
```
	width: 100%;
```
```
	height: 30px;
```
```
	text-align: center;
```
```
}
```
```
.page-3-related-posts a{
```
```
	color: #999;
```
```
}
```
```
.page-3-related-posts span{
```
```
	display: inline-block;
```
```
    line-height: 28px;
```
```
    text-align: center;
```
```
    width: 30px;
```
```
    height: 30px;
```
```
    border: 1px solid #eee;
```
```
    border-radius: 3px;
```
```
}
```
```
.page-3-related-posts>span{
```
```
	background: #45B6F7;
```
```
	color: #fff;
```
```
}
```

下拉按钮

如果你觉得每次都需要切换到文本模式点击按钮比较麻烦，可以参照 WordPress 后台文章编辑器添加下拉式短代码选择这篇文章加个下拉选择：在其中添加如下代码即可：

<option value="[insert_3_related_posts idss=id1,id2,id3]">相关文章页码</option>

原创文章，作者：DavidWu，如若转载，请注明出处：https://www.davidwu.net/archives/93780

服务项目	服务内容	收费标准（元）
开发定制	WordPress主题/插件开发定制	（以最终需求为准）
主题/插件汉化	汉化团队WordPress主题/插件，翻译率95%	（以标的主题/插件的句子数量为准）
服务器环境配置	基于您现有服务器，搭建配置网站运行环境，结合我们多年来实战经验，可完美支持WordPress等PHP程序运行，并配置伪静态规则、优化目录权限等问题。服务器我们强烈推荐使用Linux系统。	100元/次
网站托管	若贵站目前尚无技术人员，无法完成服务器环境配置，可选择我们的网站托管服务，直接交付正常运行的WordPress站点，并且无需担心服务器的后续维护工作，一切都由我们来帮您完成。	标配套餐：1000元/年/站点高配套餐：联系客服获取
网站加速优化	从服务器后端配置优化到WordPress数据库缓存、前端页面缓存、JS和CSS压缩合并，全方位优化网站加载速度，实现秒开。（此服务仅针对（云）服务器/VPS）	500元/次（仅站内优化200元/次）
主题配置	本站所有主题均支持，可快速实现，若有任何问题可以咨询客服解决，若您希望我们提供配置服务，可选购此服务。	英文主题安装 60元/次汉化主题安装 30元/次
HTTPS配置	HTTPS已经不断普及，并且有着更高的安全性以及SEO上的优待。该服务收取的为服务费，SSL证书产生的费用请自行承担。	100元/次
网站搬家	迁移网站所有文件和数据库信息、网站相关配置的调整、以及迁移中的疑难问题故障排除。	标准收费：500元/次若网站数据量大，需协商
网站运维	提供整站的运维服务，保证网站正常运行。包含：网站故障定位及排除、网站数据备份和恢复、网站攻击及木马等问题的处理等	标准收费：2000元/年 IP 5000以上需协商

服务项目

服务内容

收费标准（元）

开发定制

WordPress主题/插件开发定制

（以最终需求为准）

主题/插件汉化

汉化团队WordPress主题/插件，翻译率95%

（以标的主题/插件的句子数量为准）

服务器环境配置

基于您现有服务器，搭建配置网站运行环境，结合我们多年来实战经验，可完美支持WordPress等PHP程序运行，并配置伪静态规则、优化目录权限等问题。服务器我们强烈推荐使用Linux系统。

100元/次

网站托管

若贵站目前尚无技术人员，无法完成服务器环境配置，可选择我们的网站托管服务，直接交付正常运行的WordPress站点，并且无需担心服务器的后续维护工作，一切都由我们来帮您完成。

标配套餐：1000元/年/站点高配套餐：联系客服获取

网站加速优化

从服务器后端配置优化到WordPress数据库缓存、前端页面缓存、JS和CSS压缩合并，全方位优化网站加载速度，实现秒开。（此服务仅针对（云）服务器/VPS）

500元/次（仅站内优化200元/次）

主题配置

本站所有主题均支持，可快速实现，若有任何问题可以咨询客服解决，若您希望我们提供配置服务，可选购此服务。

英文主题安装 60元/次汉化主题安装 30元/次

HTTPS配置

HTTPS已经不断普及，并且有着更高的安全性以及SEO上的优待。该服务收取的为服务费，SSL证书产生的费用请自行承担。

100元/次

网站搬家

迁移网站所有文件和数据库信息、网站相关配置的调整、以及迁移中的疑难问题故障排除。

标准收费：500元/次若网站数据量大，需协商

网站运维

提供整站的运维服务，保证网站正常运行。包含：网站故障定位及排除、网站数据备份和恢复、网站攻击及木马等问题的处理等

标准收费：2000元/年 IP 5000以上需协商

WordPress 文章页添加3篇相关文章

CSS 样式

下拉按钮

发表评论 取消回复

请登录

发表评论取消回复