WordPress实现中英文数字之间自动加空格排版

懿古今更新于 2018-02-01 09:09:01首发于 2017-01-12 07:31:50610

前几天分享的《博主站长必看的中英文排版技巧》文中说到中文与英文、中文和数字之间加上空格的排版会更加好看，但是如果让我们在编辑文章的时候人工添加，感觉非常繁琐和让人厌烦，所以今天就跟大家介绍一下 WordPress 如何实现中英文数字之间自动加空格的排版技巧。

WordPress实现中英文数字之间自动加空格排版-第1张-boke112百科(boke112.com)

WordPress文章中英文数字之间自动加空格已经有更好的办法，所以本文可以作废了，新办法请移步《WordPress文章中英文数字间自动添加空格教程》

具体实现步骤如下（如 Nana 主题为例）：

PS：文中技术及代码来自曾先生。

1、下载 js 文件上传到主题文件的 js 文件夹中，如果 text-autospace.js 文件不是上传到主题的 js 的文件夹，请自行修改第二步的路径。

2、在主题的 header.php 的 html 标签中添加class=”han-la”，如找到以下代码：

修改为：

找到以下代码：

<script type=“text/javascript” src=“<?php bloginfo(‘template_directory’); ?>/js/jquery.min.js”></script>

在它的下方添加以下代码：

<script type=“text/javascript” src=“<?php bloginfo(‘template_directory’); ?>/js/text-autospace.js”></script>

3、在主题的 style.css 文件中添加以下 CSS 代码：

至此，已经可以让我们的 WordPress 主题拥有了中英文数字之间自动加空格的排版功能。效果如下：

WordPress实现中英文数字之间自动加空格排版-第2张-boke112百科(boke112.com)

这个 text-autospace.js 文件有 12.9 KB 这么大，所以我就懒得折腾进去，还不如我自己动手添加呢。至于是否需要添加这个功能，就请大家自我衡量了，如果开有 CDN 加速的话，这个 JS 文件对影响网站速度应该不大。

2017年8月28日更新

根据 BanYuner 博主反馈说代码有问题，我当初就是这样折腾成功的，具体原因就懒得深究了，如果大家根据本文折腾不成功的，建议到 BanYuner 博主网站看看他所分享的《WordPress 在中英文间自动加入空格》这篇文章，希望能够帮助到大家。