本站主题分享 — Bug侠

其实我啥也不会，准确的说，应该是啥也不精。

如您所见，这套主题也只是东拼西凑做出来的东西，CSS框架用的是amazeui，所以整体的风格也是参照它的示例。

因为本来就是我自己用的，功能上没有什么设计方向，简单就好，所以也没有做后台的主题设置页面。

能注释的，我都在代码里注释了，有能力的话可以二次修改，有问题欢迎留言评论。

一些亮点

1.简洁，左右两栏

2.AJAX无刷新加载（带开关，cookie保存设置），AJAX评论提交

3.前端可选是否使用Gravatar头像（带开关，cookie保存设置）

4.评论、后台编写文章，均可以调用自定义表情

5.自适应

下载

https://file.bugxia.com/s/Da3GPTYCaLYprsg

需要注意的地方

插件（可选）

主题中会有 Pure Highlightjs 插件的检测代码，如果启用了该插件，则会执行相应的js代码以保障在ajax下代码高亮能正常渲染，若不存在该插件或未启用则不执行，避免报错

参照：解决AJAX(PJAX)下代码高亮无法渲染的问题

伪静态

首页的文章小图调用的是文章第一张图片，使用了timthumb作为缓存和裁剪工具，为了图片链接的美观（loop.php 第 5 行），所以使用了伪静态，我用的nginx，规则为：

rewrite "^(.*)/thumb/(.+?)/(.+?)/(.+?)/(.+?)/(.+?)__.jpg$" $1/wp-content/themes/bugxia/timthumb.php?w=$2&h=$3&zc=$4&q=$5&src=$6 last;

如果上述伪静态规则出现问题，导致图片无法显示，可以：

1.还原为真实路径（带裁切和缓存），修改 loop.php 第 5 行

修改为：

<img src="<?php echo get_bloginfo('template_directory')."/asset/img/loading_loop.gif";?>" data-original="<?php echo get_bloginfo("url")?>/wp-content/themes/bugxia/timthumb.php?w=400&h=200&zc=1&q=85&src=<?php echo base64_encode(catch_that_image());?>__.jpg" class="lazy lazy am-u-sm-12">

2.可以还原为还原为图片的真实地址（不做裁切和缓存），但是需要控制首图的尺寸和大小，不太推荐

修改 loop.php 第 5 行，修改为：

<img src="<?php echo get_bloginfo('template_directory')."/asset/img/loading_loop.gif";?>" data-original="<?php echo catch_that_image();?>" class="lazy lazy am-u-sm-12">

Gravatar头像缓存（functions.php 第 236 行）

百度收录提交（functions.php 第 65 行）

Server酱通知新评论（functions.php 第 388 行）

邮件通知默认关闭（去掉 functions.php 第 432 行 注释即可）