正在我敲完我的第一篇博客并且发布之后,浏览了一下又发现了一个问题,那就是段首的空格不能生效,不论在可视化编辑器还是在文本编辑器里,敲了空格之后浏览或者是直接发布,空格都会消失不见。
![](https://mu-mu.cn/blog/wp-content/uploads/2020/06/image-17.png)
如此影响文章美观性的bug怎么能够不解决呢。在一顿上网搜索之后,据说好像是wordpress没有这个规范。既然如此,那只能我们自己动手来解决了!
解决方案一:使用HTML编辑模式。在HTML编辑模式中,我们可以直接将想要段首空格的内容放在一个p标签中,然后加上text-indent:2em 的样式,这样子在这个p标签中的内容就能段首有空格了,或者是使用HTML当中的空格符号 ,一个 对应的是一个空格,四个则对应我们日常的段首空格习惯。当然对于会前端的小伙伴来说,HTML模式可以做得各种花里胡哨,小小的空格自然不在话下。虽然这样子解决起来方便,而且灵活,可以在任意自己想要的地方加上空格,但是想想每次都要敲这几个代码,还是有点麻烦。
![](https://mu-mu.cn/blog/wp-content/uploads/2020/06/image-21.png)
![](https://mu-mu.cn/blog/wp-content/uploads/2020/06/image-20.png)
网上还有很多说法是敲全角空格也能够出现,而在我这里全角空格在段落中是可以正常显示的,但在段首仍然无效。
解决方案二:直接在主题编辑器的style.css中加上 .content p{text-indent:2em;}。这就是一个简单的css语句,我们的一个段落就是一个content下的p标签,加上这句就可以直接让所有段落前面都出现空格了。这个方法虽然方便,但是灵活性有欠缺。
解决方案三:将以下代码写入到主题目录 functions.php 的最后一个 ?>当中,不然不会被解析成PHP。第一段代码是将<p替换成带有空格的p标签,其实和方案二是同一种方法,而且还比方案二麻烦那么一点点。第二段代码是作用再Tiny编辑器,也就是wordpress的原生编辑器上的,也是暴力地应用于所有的段落,不够灵活。
function Bing_text_indent($text){ $return = str_replace('<p', '<p style="text-indent:2em;"',$text); return $return; } add_filter('the_content','Bing_text_indent'); 或者 add_filter(‘tiny_mce_before_init’, ‘preserve_nbsp_chars’); function preserve_nbsp_chars($initArray) { $initArray[‘entities’] = ‘160,nbsp,’.$initArray[‘entities’]; return $initArray; }
当然还可以通过安装插件来解决,但是好像大部分插件都是和方法二三一样,暴力地给p标签加上段首空格。虽然还有些瑕疵,但是好在问题是解决了,以后有更好的办法再更新吧!
另外,如果你有兴趣,或者是有问题想要与我探讨,欢迎来访问我的博客:https:mu-mu.cn/blog