解决wordpress文章首行缩进问题

/ 57评 / 1

下午,ONC问我“wordpress编辑文章的时候是怎么首行缩进哦?两个空格?”我回答是的。因为我平时就是这么干的。然后我又联想到博客页面在百度快照中文章段落前的空格都变成了诸多的“?”,这个应该有很大的联系吧。

之前知道可以用修改主题中的style.css文件来达到预期目的,但自己并没有动手去实践,每次编辑文章都是按几个空格了事。今天既然提出来了,就不能再放过了吧。要修改的“p”并不好找,花了一点时间,先找到了post类,然后content类,都是按着自己的理解去 ,因为自己并不清楚主题是怎么表达的,各个主题又有差异。结果如下:

.post .content p {
	margin-bottom:10px;
}

在上面添加了一句:

text-indent:2em;

变成:

.post .content p {
	margin-bottom:10px;
         text-indent:2em;
}

这样每一段落首行都会缩进,成为中国式的段落标准,另一种方法就每次手动添加CSS代码,在html编辑器里编写需要缩进的段落前先加上下面一句:

《p style="text-index:2em》

然后继续文章内容。这里就又有偷懒的方法了,既然是在html编辑模式下添加代码,何不遵照以前代码高亮显示插件+DIY按钮的方法再来做一个按钮呢,打开wp-includes/js/quicktags.js,在上次添加的后面又加了一句:

edButtons[edButtons.length]=new edButton("ed_kong","kong",'《p style="text-indent:2em"》',"《/p》","kong");

代码中所有的“《”“》”都改成“< ”“>”。

 

总结一下:第一种方法改的是主题,一劳永逸,简单方便,但会随着主题的更换,效果也会消失;第二种方法改的是编辑框,嵌在WordPress中,也可能会因为升级之类的而被覆盖,相对变动会少很多,看自己喜欢了。

  1. wordpress系统好像很好用是吗

  2. 集思说道:

    我也试过加text-indent属性,但是图片他也会缩进的。

    • hesiway说道:

      @集思 @集思, 换行的它都缩了,总感觉编辑这块做的不完美呢~

  3. 流年说道:

    另提示一下,文中想显示<只需要输入&lt(后面加个英文分号;)即可,而>号不用处理,直接输入即可

    • hesiway说道:

      @流年 @流年, 我打《》而不用<>是因为文章直接把代码转换成html中的意义了,如《p》变成了换段而不显示了~

      • 流年说道:

        @hesiway @hesiway, 所以用我上面说的那个实体来代替<就可以啦;至于>号就直接输不会被转义的

        • hesiway说道:

          @流年 @流年, 恩,我在html编辑中看到可视化编辑转过来的<成了&lt,,发布后都是不转义的~下次注意了

          • 流年说道:

            @hesiway @hesiway, 你应该是用上了代码插件的,直接按照说明copy进去就可以了,一般不需要进行处理的了;
            另,建议修正一下评论框,将style.css文件第907行的width改为99%;要不嵌套的时候会撑破

          • hesiway说道:

            @流年 @流年, 好像我都是直接考进去的,下次写的时候注意下;
            评论框问题我一直想解决,本来想把框放在嵌套的下方,不调用到嵌套中,把固定宽改成百分数应该能解决了,不用那么麻烦了;
            多谢诸多建议~ :微笑:

  4. 流年说道:

    无需刻意追求缩进,缩进的目的主要是为了使段落分隔明显。而对于web文本来说,一般段落间距比段间行距宽得多,很容易区分出来

    • hesiway说道:

      @流年 @流年, 首行缩进已是中国人的习惯了,就应为之前有部分文章段落间隔已经和行距一样了,完全分不出才有这个~

  5. sky说道:

    不错不错,学习了啊

  6. miracle说道:

    使用几乎任何网站程序,我都要为内容中的P加上text-indent:2em

  7. 3q博客说道:

    这个很实用,简单

    • hesiway说道:

      @3q博客 @3q博客, 恩,可是以前自己打的空格还在,现在首行空四格了~ :哭:

  8. 大少说道:

    我比较倾向于第一种,不会让CSS污染文本,而且一旦定义了行间样式,以后主题的更改应用都会受到一点点的影响。而第一种就没有这种问题。

  9. TTkea说道:

    玩代码的都是高手呀,呵呵~

  10. jszby说道:

    我使用的是宽屏,比你的宽很多。呵呵

    • hesiway说道:

      @jszby @jszby, 要是页面宽度按百分比输出就好了~ :微笑:

  11. jszby说道:

    呵呵,使用的是QQ主题皮肤呀,不错,我也是使用的这个主题,但是背景为蓝色的。

  12. 冷轩信说道:

    一直用的是第一种方法,第二种不错哦

    • hesiway说道:

      @冷轩信 @冷轩信, 第二种用时还是烦了点,每次要点,还会污染文章~

  13. Ebo说道:

    偶还是习惯插入空格吧。

    • hesiway说道:

      @Ebo @Ebo, 他也不是按几个空格就空几格的,所以每次都要调整~

  14. merror说道:

    囧 这个倒是没注意
    直接顶行写了。

    • hesiway说道:

      @merror @merror, 每段开头空两个,我们小学语文老师就开始教了~ 一直如此:偷笑:

  15. 权子说道:

    来踩踩~~~

  16. 岸边说道:

    哎,我都是手动打空格 :偷笑:

  17. 集趣说道:

    嗯~换其他的方式也哦!

  18. 本地智慧说道:

    很有见地,本地智慧虚拟团队正在寻找各类起源于草根的互联网专家,请您加入和支持

  19. PARA说道:

    看来还是直接修改CSS的方法比较方便~

  20. 人好哇!说道:

    我也一直在想为啥不符合中文格式,原来还需要改点代码。哎。。。WP还真难搞~

  21. 河海浪子说道:

    emlog,是直接html编辑。

  22. 迎接说道:

    第一次来你这就转载你的文章了 呵呵“`

  23. C度空间说道:

    学习一下!

  24. 迎接说道:

    原来还会变成问号的啊,改改去“`

    • hesiway说道:

      @迎接 @迎接, 我以前的百度快照是这样,改完过天我再看看,呵呵

  25. 小松说道:

    不错,我就是用css办法实现的~

Comments have been closed.