分类：WordPress

萧涵主题不同颜色源码包括四个颜色版本：蓝色、红色、紫色和绿色。绿色版本的相信大家都非常熟悉了，这是萧涵主题3.0的默认颜色，因为萧涵主题SEO方面做得很好，使用人数众多，导致大家看到绿色版时已经视觉疲劳，而蓝色、红色和紫色版也就在网络上孕育而出，这些资源都是偶看在网络上整理的，所有版权归原作者。

具体文件说明

xiaohan3.zip
萧涵3.0原版

bgs.rar
是萧涵3.0原版绿色版的背景PSD文件，用于修改LOGO

萧涵3红色、萧涵3蓝色、萧涵3紫色，想要换成什么颜色就将images文件夹替换即可。（为了防止源代码被修改，偶看只保留了图片文件夹）

萧涵3蓝色/logo.zip
是蓝色版的背景PSD文件

萧涵主题蓝色红色紫色和绿色源代码下载地址：新浪威盘：http://vdisk.weibo.com/s/o9L0A

2013-07-12添加蓝色、红色和紫色版本的style.css样式表，下载地址：http://vdisk.weibo.com/s/JB284

2013-07-16添加绿色、蓝色、红色和紫色版本完整文件  http://vdisk.weibo.com/s/Ken5R 百度网盘：http://pan.baidu.com/share/link?shareid=4223958923&uk=2969853586

wordpress问答插件要想实现像百度知道那样的功能，真心不好找，至少国内偶看是没有发现免费的插件，有一款国人在出售的问答系统，价格是99元人民币，不知道具体功能如何，没有去研究。

偶看现在使用的问答系统是Question2Answer，一个开源的系统，能够和wordpress实现完美整合，用了几个月感觉也不错，就是有两个小小的问题没有办法解决：中文用户名无法正确显示在问答系统上，中文实在特殊；另一个问题是没有办法将图片通过编辑器上传到空间上，Question2Answer本身是有个编辑器可以上传图片，但是它竟然把图片上传到mysql数据库里面，真是没见过这么坑爹的功能，2005年玩ASP的时候有遇到过将图片上传到access数据库的情况，在那以后的cms、bbs和blog都是通过编辑器将图片上传到虚拟空间，没想明白为什么Question2Answer还没有开发出将图片上传到虚拟空间的动能。

wordpress是一个英文程序，老外对wordpress的插件开发比较完整，问答插件也有许多，免费的那就真没有好用的了。

一、wpmudev.com有一个Q&A Lite免费的精简版本，但是没有办法对问题进行分类，当然还是其他一些功能也比完整版少。完整版价格是19美刀，或者成为wpmudev的正式会员可以下载所有的插件和主题，价格是79美刀，其实价格都不贵，只是换成人民币就比较郁闷了。

二、enginethemes.com发布了JobEngine问答主题，功能强大，使用方便，价格是129美刀。

三、templatic.com/cms-themes/answers，这个问答插件功能我偶看现在用的Question2Answer差不多，价格是75美刀。

四、wp-answers.com，集成SNS功能（老外的两个网站Facebook和Twitter），可以兼容大部分主题，功能很多，价格是89美刀。

以上都是需要美刀的产品，偶看还是回来给大家继续介绍Question2Answer吧，毕竟这个一个开源免费的产品，虽然它不能嵌入在wordpress主题中（它使用自己的主题），但是功能真的很强大，而且插件不少。

关于Question2Answer与wordpress整合的演示站点就查看：偶看网络营销问答

萧涵主题3.0提供用户自定义微博客的功能，调用的是类似腾讯微博的模块。那么如何启用并设置微博客呢，偶看给大家详细解说下。

一、创建文章分类目录，分类名任意，创建好后，查看栏目ID（如何查看栏目ID？对栏目名点击右键“属性”，查看“地址（url）”,其中的tag_ID=多少的数字就是栏目ID，如果还是不会，请认真查看视频中的操作）。

二、WordPress管理后台–外观–主题设置，找到“功能设置”–微博设置（勾选）最新微博显示在首页的文章区域上方，输入你要做为微博栏目的ID（填入分类目录ID号）。

三。查看微博客的文章目录是否已经设置完成。查看偶看的微博客效果

四、如果导航条中没有启用菜单，请新建页面，并设置为微博客；如果启用菜单，请直接在“外观”–“菜单”中添加微博客分类目录即可。

偶看建立了关于萧涵主题修改交流的QQ群：已经解散，大家有问题可以在“问答板块”提问。，欢迎大家加入。有更多关于萧涵主题需要修改的部分，请查看萧涵主题修改。

wordpress侧边栏调用微博收听组件和微博秀，一般使用新浪微博或腾讯微博。

新浪微博开放平台 http://open.weibo.com/

网站接入–微博组件–关注按钮

1.在HTML标签中增加XML命名空间

2.在HEAD头中引入WB.JS

3.在需要部署微博关注按钮的位置粘贴WBML代码，查看更多参数

新浪微博秀，进行样式自定义设置

腾讯微博开放平台 http://dev.t.qq.com/

网站接入：微博收听组件和微博秀

一、侧边栏使用小工具

wordpress管理后台–外观–小工具，将“文本”小工具拖动到右边，

粘贴微博秀的代码即可。

二、侧边栏使用代码

打开萧涵主题下的sidebar.php，将新浪或腾讯微博秀的代码复制到

<div class="block search_form"></div>

后面。

侧边栏微博秀和微博收听组件就添加完毕，具体效果查看下图：

偶看建立了关于萧涵主题修改交流的QQ群：已经解散，大家有问题可以在“问答板块”提问。，欢迎大家加入。有更多关于萧涵主题需要修改的部分，请查看萧涵主题修改。

萧涵模板网页背景图默认使用的是纯色背景，很多朋友为了增加网站的吸引力想将背景颜色修改成图片，偶看在这里介绍下萧涵模板更换背景图的方法。

第一种办法：直接在管理后台修改

在wordpress找到“外观”–“背景”，在这里可以直接选择从本地中上传一张背景图，还是从媒体库中选择一张背景图，或是直接设置一个纯色背景。任选一种办法，设置好后点击“保存更改”，然后访问网站刷新查看结果，背景图是不是已经更改了呢？

偶看介绍再一种修改修改CSS文件的办法。

第二种办法：修改CSS文件

1、找到心仪的背景图图片，要求图片不可太大，否则会影响网站加载速度。

找到背景图片后，保存在萧涵模板下的 images 文件夹，具体地址为：wp-content/themes/xiaohan3/images

2、打开萧涵模板文件夹下的style.css 找到代码

 background:#cded9a;

这个代码在CSS文件中只有一个，将其修改为

background:url(images/bgtu.jpg)

偶看使用的图片文件名为bgtu.jpg，您也可以根据自己的图片文件名写入。

3、查看更换网页背景图后博客的效果，偶看只是随意在网上下载了一张图片，大家在寻找图片的时候还要考虑网站整体配色。

偶看建立了关于萧涵主题修改交流的QQ群：已经解散，大家有问题可以在“问答板块”提问。，欢迎大家加入。有更多关于萧涵主题需要修改的部分，请查看萧涵主题修改。

偶看今天帮朋友分析网站的流量，他说在最近一两个月，网站流量都会超过25GB，但是网站的日IP只有几十，空间商反馈没有受到DDOS攻击或是其他攻击。一个月25GB的流量是对于一个博客来说是相当恐怖的，偶看博客一个月流量都不过5GB。

通过对本月的网站日志分析，本月到16号为止使用网站流量12.72GB，正常带宽11.78GB，蜘蛛带宽689.07MB，盗链带宽272.08MB

这样的网站流量构成非常奇怪，一般说来，蜘蛛带宽和正常带宽的差距不会如此之大，有些网站的蜘蛛带宽甚至会超过正常带宽。

消耗网站流量异常之大的文件是Image Files，被点击185,953，占全部点击数的71.24%，消耗带宽11.56 GB，占全部流量的90.87%。

通过查看消耗带宽最多的访客，竟然是本服务器的IP。

那么一切问题就又简单了，朋友的博客使用的是wordpress，wordpress本身在正常情况下是不可能产生如此之多的网站流量的，那么一般说来问题就出在插件上。在该博客上安装的几个插件中，有一个插件最为可疑：simple-lazyload，官方的解释和插件的功能是：

This plugin automatically copy image’s src value to file attribute, replace src value with a blank image’s url before showing, when the page is loaded, lazyload js will decide to load the images’ actual content automatically, only when user wants to see them.

This plugin has a more perfect performance working with the “auto-highslide” plugin.

Also, you can use another combined pugin “auto-lazyload-and-auto-highslide” instead of the two above.

本插件实现真实的图片迟加载功效，自动保存、替换图片的实际地址，只有当用户需要看到时，才会向服务器去请求图片内容，否则是一张空白图片，对服务器没有负担。

本插件可以与【auto-highslide】插件配合使用，效果更佳。

当然你也可以使用另一个组合插件【auto-lazyload-and-auto-highslide】来取代它俩的功能。

朋友博客使用的是1.2版本，目前最新的是2.2版本。

毫不犹疑，先停用并卸载该插件，那么网站流量异常的问题能否顺利解决呢？

关于网站流量异常分析结果，偶看要过两天再分析下网站日志，才能知道判断是否正确。

偶看最近在折腾老外的wordpress主题，老外的主题不但美观大方，而且功能强大，就是满屏幕的英文有点点纠结。

偶看使用infocus主题时发现，标题中如果含有中英文，那么英文可以显示，中文无法显示，经过一番搜索是由于字体的渲染造成的，网上没有专门针对infocus的渲染删除进行解说，偶看只好自己研究。

网上的一般方法是在header.php文件中查找Cufon.replace，并删除即可，可是偶看在header.php完全没有找到Cufon.replace。

研究了一会代码，偶看发现一个有关Cufon的IF语句，马上返回后台主题设置，偶看认真查看infocus的常规选项，竟然有一个“全局禁用Cufon字体替换”的选项，勾选改选项后，中文字体正常显示。

不认真的孩子伤不起！朋友们以后设置wordpress后台一定要认认真真把所有的选项的看完，老外的主题博大精深。

偶看在半年前写过一篇代码实现WP侧边栏调用最新评论并显示Gravatar头像，那时候并不是专门针对萧涵模板写的。现在，偶看针对萧涵模板，写一篇非插件侧边栏显示Gravatar头像最新评论，修改的流程为：

以下修改基于wordpress3.4.2，萧涵模板3.0版本

一、修改萧涵模板文件夹下的 sidebar.php 找到代码

<div class="block comment"><h3><?php _e('最新评论' ,'xiaohan'); ?></h3>
         	<ul>
             	<?php
                 global $wpdb;
 				$sql = "SELECT DISTINCT ID, post_title, post_password, comment_ID,comment_post_ID, comment_author, comment_date_gmt, comment_approved, comment_type,comment_author_url, SUBSTRING(comment_content,1,25) AS com_excerpt FROM $wpdb->comments LEFT OUTER JOIN $wpdb->posts ON ($wpdb->comments.comment_post_ID = $wpdb->posts.ID) WHERE comment_approved = '1' AND comment_type = '' AND post_password = '' ORDER BY comment_date_gmt DESC LIMIT 10";
 				$comments = $wpdb->get_results($sql);
 				$output = $pre_HTML;
 				foreach ($comments as $comment) {
 					$output .= "\n<li class=\"new\">" . $comment->comment_author . "  评论道：<br /> <a href=\"" . get_permalink($comment->ID) . "#comment-" . $comment->comment_ID . "\" title=\"". $comment->comment_author. ":" . $comment->post_title . "\">" . strip_tags($comment->com_excerpt) ."</a></li>";
 					}
 					$output .= $post_HTML;
 					echo $output;
 				?>
 
                 
             </ul>
         </div>

将其修改为

<div class="block comment"><h3>最新评论</h3>
             <ul>
              <?php
                  global $wpdb;
                  $sql = "SELECT DISTINCT ID, post_title, post_password, comment_ID,comment_post_ID, comment_author,comment_author_email,comment_date_gmt, comment_approved, comment_type,comment_author_url, SUBSTRING(comment_content,1,15) AS com_excerpt FROM $wpdb->comments LEFT OUTER JOIN $wpdb->posts ON ($wpdb->comments.comment_post_ID = $wpdb->posts.ID) WHERE comment_approved = '1' AND comment_type = '' AND post_password = '' ORDER BY comment_date_gmt DESC LIMIT 10";
                  $comments = $wpdb->get_results($sql);
                  $output = $pre_HTML;
                  foreach ($comments as $comment) {
                      $output .= "\n<li>".get_avatar($comment, 32)."" . $comment->comment_author . ": <br /> <a href=\"" . get_permalink($comment->ID) . "#comment-" . $comment->comment_ID . "\" title=\"". $comment->comment_author. ":" . $comment->post_title . "\">" . strip_tags($comment->com_excerpt) ."</a></li>";
                  }
                  $output .= $post_HTML;
                  echo $output;
              ?>
              </ul>
          </div>

二、修改萧涵模版文件夹下的CSS文件 style.css 将

.sidebar .block.comment{}
.sidebar .block.comment li{background:url(images/ico-com.png) 0 -245px no-repeat;padding-left:20px;color:#777;border-bottom:1px #d0d4c8 dashed;}
  .sidebar .block.comment li a{color:#436206;}

修改为

.sidebar .block.comment{}
  .sidebar .block.comment li{clear:both;color:#649315;margin-top:5px;padding:0 0 3px 0;border-bottom:1px #ddd dashed;}
  .sidebar .block.comment li img{float:left;margin:5px 8px 0 0 ;}

这样即可实现侧边栏显示Gravatar头像最新评论，具体效果查看偶看博客的侧边栏。

偶看建立了关于萧涵主题修改交流的QQ群：已经解散，大家有问题可以在“问答板块”提问。，欢迎大家加入。有更多关于萧涵主题需要修改的部分，请查看萧涵主题修改。