打造简洁优雅的WordPress主题

时间:2015-08-25 | 分类:个人日志 | 浏览:5282 | 评论:9 | 发表评论

最近利用加班后的空余时间把主题优化了一下,主要优化了以下一些内容:

更换新的主题风格

主题打算更改为简洁优雅的风格,说到优雅,当之无愧的就是苹果的产品,向乔布斯致敬!
所以我把主题色改为MacBook铝合金的颜色,再参考Mac系统的配色方案,结合一些扁平化的元素,打造出一种清新淡雅的感觉。可能有些地方还不太和谐,不过这个以后可以再慢慢调整。
此外还去掉很多华而不实的功能:

  • 侧边栏的自动滑动功能
  • 二维码扫码登录
  • flash标签云
  • 文章图片框等等等

采用响应式布局

几年前制作旧主题的时候,我的显示器分辨率为1024*768,所以博客的内容区域最多只能分配660px的宽度。
由于我的博客主要是分享一些代码,如果代码比较长的话,660px的宽度很导致代码换行,看起来很不舒服。所以增大内容区域的宽度是很有必要的,这也是这次主题修改的首要工作。
不过现在只是做了简单的修改,判断屏幕宽度大于1200px的话,内容区域的宽度就变为800px。
修改方法:下载一些响应式主题,参考里面的css代码。

支持AJAX请求

AJAX的好处是每次点击文章时,只加载了内容区域的数据,网页的头部、脚部和侧边栏都不会重新加载,既节省了流量,又提高了访问速度。
因为侧边栏不用重新加载,所以在侧边栏放一个音乐播放器的话,就可以一边浏览网站一边聆听美妙的音乐了。
这篇文章能教你快速地让wordpress支持AJAX:WordPress的全站Ajax加载

使用Markdown写作

有一位不愿意透露姓名的程序员说过:“我要用Markdown像写代码一样写文章。”
作为一个程序员,怎么能去使用那么笨重的富文本编辑器呢?所以用Markdown写文章是很有必要的。
这篇文章可以教你怎么在WordPress里使用Markdown:使用Markdown写作WordPress
如果Jetpack链接不成功,可以参考这篇文章:Jetpack无法连接到WordPress
附上Markdown语法说明:Markdown 语法说明

修复自定义的评论表情

WordPress4.2采用了更改了emoji表情,导致旧版本自定义的评论表情失效,这篇文章可以比较方便地修复:
WordPress4.2升级修复补丁:解决大量404请求以及评论表情路径及尺寸异常问题

标签: ,
本文链接: 打造简洁优雅的WordPress主题
版权所有: 破博客, 转载请注明本文出处。

9个评论

  1. Alick.Li
    2015/10/08 21:51:15

    不错, 非常不错的QQ风格!!! :evil:

  2. robert
    2015/09/23 13:24:35

    求此皮肤共享

    • admin
      2015/09/23 18:31:31

      不好意思,暂时没有分享皮肤的打算

  3. 孤军奋战
    2015/09/16 09:06:33

    看样子像是大神。

    • admin
      2015/09/16 18:29:40

      我不是大神,只是菜鸟

  4. 陶心昊
    2015/09/03 04:53:23

    变化蛮大的,感觉也变得简洁了不少,边栏直接用css替换图片了,我想这样确实给也算速度上的优化之一吧。向乔布斯致敬~

    • admin
      2015/09/03 18:29:07

      是的,之前为了兼容低版本的ie只能使用图片背景,现在不打算兼容了,直接用css

  5. figo
    2015/08/26 18:34:33

    过来看看,比以前的qq风格好的多了

发表评论

您的昵称: *

您的邮箱: * (显示gravatar头像)

联系方式: