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

迈不过友情╰ 2021-11-17 10:00 170阅读 0赞

通常来说中文与英文、中文和数字之间加上空格的排版会更加好看，但是如果让我们在编辑文章的时候人工添加，感觉非常繁琐和让人厌烦，所以今天龙笑天下就来跟大家介绍一下WordPress如何实现中英文数字之间自动加空格的排版技巧。（PS：其实很早就想加上这个功能了，但奈何懒癌发作…）

第一步：html或body标签中加入han-la类

在html标签中添加class=”han-la”（一般在header.php文件中）。但是并不是硬性规定，现在很多博客都是通过功能函数动态加载class类，那么同样的，你也可以将这个han-la类动态加载到body中去。将类加载到html标签中的方法就不说了，这里说下怎么加载到body标签中，当然在这里，你的主题应该是使用了body\_class()这个标准函数的。  
　　/\*\*

\*WordPress实现中英文数字之间自动加空格排版-龙笑天下

\*https://www.jkys120.com/article/95496/

\*在body标签中加入han-la类

\*/

function lxtx\_add\_hanla\_to\_body\_class($classes)\{

$classes\[\]='han-la';

return$classes;

\}

add\_filter('body\_class','lxtx\_add\_hanla\_to\_body\_class');

另外，值得一提的是该函数也会暴露一个问题，具体见下文：

（全网独家）如何正确的避免你的WordPress管理员登录用户名被暴露

第二步：引入js文件

在jquery文件后面引入text-autospace.min.js或text-autospace.js，下载地址为：https://github.com/mastermay/text-autospace.js

/\*\*

\*WordPress实现中英文数字之间自动加空格排版-龙笑天下

\*https://www.jkys120.com/article/95496/

\*加入text-autospace.min.js文件

\*/

function lxtx\_styles\_scripts()\{

//全局加载js脚本

wp\_enqueue\_script('han-la-js',get\_template\_directory\_uri().'/includes/js/text-autospace.min.js',array('jquery'),'',true);

\}

add\_action('wp\_enqueue\_scripts','lxtx\_styles\_scripts');

注意修改代码中第8行的文件引用路径哦~

最后一步：添加CSS代码

将以下代码加入你的style.css文件中。

/\*han-la xtx\*/

body.han-la hanla:after\{

content:"";

display:inline;

font-family:Arial;

font-size:0.89em;

\}

body.han-la code hanla,body.han-la pre hanla,body.han-la kbd hanla,body.han-la samp hanla\{

display:none;

\}

body.han-la ol>hanla,body.han-la ul>hanla\{

display:none;

\}

当然，如果在第一步中，你是将han-la类class加到html标签中的话，在这一步中你需要将以上CSS代码中的body全改为html。

转载于:https://www.cnblogs.com/zqw111/p/11255235.html

发表评论取消回复

表情：

评论列表（有 0 条评论，170人围观）

还没有评论，来说两句吧...

相关阅读

相关 VScode 在变量与运算符之间自动添加空格的设置方法

方法一：在设置中搜索format on type，勾选✔该项即可。如下图： ![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_

柔光的暖阳◎/ 2022年11月25日 10:27/ 0 赞/ 227 阅读

相关 java区分中英文数字_Java统计字符串中英文字母及数字数量的方法

packageorg.zhy.demo.algorithm; /\\ \ 有一个字符串，其中包含中文字符、英文字符和数字字符，请统计和打印出各个字符的个数 \ \ @a

小鱼儿/ 2022年11月10日 01:17/ 0 赞/ 108 阅读

相关【wordpress】WordPress加速，取消加载Gravatar头像

最近通过Google插件Ghostery检测到网站在打开时有加载Gravatar头像，在网上看了一下，很多是在function.php里面增加屏蔽代码。这个方法在更新系统主题后

雨点打透心脏的1/2处/ 2022年11月07日 14:33/ 0 赞/ 210 阅读

相关 JAVA判断中英文,并根据中英文自动截取字符串

public class aaa { / @param args / public static void main(St

谁践踏了优雅/ 2022年07月14日 16:16/ 0 赞/ 203 阅读

相关原生js实现银行卡号每隔4位数字加一个空格案例

<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8

妖狐艹你老母/ 2022年06月12日 02:48/ 0 赞/ 222 阅读

相关 VisualStudio 自动排版等快捷键

VisualStudio2010自动排版快捷键：全部代码排版：1. ctrl+E,D 按住ctrl，相继按下E、D 2. ctrl+K,F 按住ctrl，相继按下K、

傷城~/ 2022年04月10日 09:55/ 0 赞/ 1002 阅读

相关 [Java中实现国际化] - 配合thymeleaf实现中英文自动切换(多语言)

[MOOC该链接第三章第二节][MOOC] 尚硅谷SpringBoot全集 web开发国际化 xjbo (7天,过期可以留言索取) ![1030087-201901

Myth丶恋晨/ 2021年12月14日 12:11/ 0 赞/ 391 阅读

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

　　通常来说中文与英文、中文和数字之间加上空格的排版会更加好看，但是如果让我们在编辑文章的时候人工添加，感觉非常繁琐和让人厌烦，所以今天龙笑天下就来跟大家介绍一下WordPre

迈不过友情╰/ 2021年11月17日 10:00/ 0 赞/ 171 阅读

相关代码之间为什么要加空格？

> 据我观察，大多数人写代码喜欢在符号两侧加空格，而且还会嘲讽不加空格的人。这些支持者认为，加空格可以让代码美观，增强代码的可读性。但是我不喜欢加空格，因为这么写对代码含义没有

朴灿烈づ我的快乐病毒、/ 2021年08月10日 17:17/ 0 赞/ 345 阅读

相关代码之间为什么要加空格？

> 据我观察，大多数人写代码喜欢在符号两侧加空格，而且还会嘲讽不加空格的人。这些支持者认为，加空格可以让代码美观，增强代码的可读性。但是我不喜欢加空格，因为这么写对代码含义没有

谁借莪１个温暖的怀抱￠/ 2021年06月22日 15:38/ 0 赞/ 400 阅读