WordPress Theme O’Connor 修改记录日志

O’Connor是一个付费主题,但它值得购买。因为它的优点在于:全站AJAX(真正的)、Web App(不依赖任何插件)、单栏双栏(不启用任何小工具即为单栏模式,后台可设置主题宽度)、星评(非插件优雅版)、BOX文章列表、可能是SEO最牛逼的主题、所有设备(网页自适应),所以在Bigfa发布正式版时第一时间购入。

但任何一个主题都不可能满足所有的人,所以主题修改是不可避的。虽然Bigfa的Q群有技术支持,但这些可不是在售后服务范围的,所以问了几次Bigfa后也不好意思再麻烦他这小伙子了,于是把这次修改的记录下面,方面自已往后的修改。

1、评论头像圆形显示,只需要在CSS文件最后加上以下代码既可。

.comhead .zlazyload{border-radius:100%}

2、调整右边栏宽度。由于主题右边栏默认为240,不适合Google AD的250*250的标准展示。同样在CSS文件中

找到#content{float:left;width:660px;width:calc( 100% - 270px );_margin-right:20px}并修改成:

#content{float:left;width:650px;width:calc( 100% - 280px );_margin-right:20px}

再找到#sidebar{float:right;width:240px;font-size:12px}并修改成

#sidebar{float:right;width:250px;font-size:12px}

完成。剩下的就是加入广告代码。

3、恢复浏览器下拉条原状,主题默认对浏览器下拉条进行了美化。可惜我是一个追求原生态的,所以把下拉条恢复成原状。在CSS文件中搜索到以下代码,并将其删除既可。

::-webkit-scrollbar-track-piece{width:15px;border-right:1px solid #EEE;border-left:1px solid #e4e4e4;background-color:#f0f0f0;background-image:-webkit-linear-gradient(left,#f0f0f0,#FFF)}
::-webkit-scrollbar{width:15px;height:15px}
::-webkit-scrollbar-thumb{position:relative;min-height:25px;border-radius:9999px;background:linear-gradient(#f36639,#efcc43) repeat scroll 0 0 #f36639;background-clip:padding-box}
::-webkit-scrollbar-thumb:vertical{border-top:0 solid transparent;border-right:2px solid transparent;border-bottom:0 solid transparent;border-left:3px solid transparent}
::-webkit-scrollbar-thumb:horizontal{border-top:3px solid transparent;border-right:0 solid transparent;border-bottom:2px solid transparent;border-left:0 solid transparent}

4、把主题的橙色风格改为蓝色

把CSS文件中的#f36639全部换成#3b5998,剩下的为边栏图片修改。

5、头部增加蓝色条样

搜索:

#pre-header {
  background-color:#E9E9E9;
  border-bottom-color:#F6F6F6;
  border-bottom-style:solid;
  border-bottom-width:5px;
  color:#888888;
  font-size:12px;
  height:40px;
}

更换成:

#pre-header {
  background-color:#E9E9E9;
  border-bottom-color:#3B5998;
  border-bottom-style:solid;
  border-bottom-width:5px;
  color:#888888;
  font-size:12px;
  height:40px;
  overflow:hidden;
}

剩下的就是在主题设置里面进行设置了,WordPress Theme O’Connor主题后台主题设置选项非常强大,详见下图。

O-Connor

2014-04-07增补:删除主题自带的Lightbox效果,因为不支持多张图片显示。删除themes/O-Connor/js/global.js中的以下代码。

  $(document).on("click", "a.fancybox",
  function() {
    pagesize = bigfa_getPageSize(),
    bigfa_img_url = $(this).attr("href"),
    css_bigfa_bg = "z-index:9999;overflow:hidden;position:fixed;left:0;top:0;width:100%;height:100%;background-color:#000;",
    css_bigfa = "z-index:99999;position:fixed;left:50%;top:50%;",
    css_bigfa_img = "display:none;border:8px solid #fff;box-shadow:0px 0px 10px rgba(0,0,0,0.6)",
    css_bigfa_p_n = "display:none;cursor:pointer;position:absolute;top:50%;line-height:80px;margin:-40px 0 0 0;color:#eee;text-shadow:1px 3px 5px #000;font-size:40px;font-family:Arial,Tahoma;";
    if (typeof document.body.style.maxHeight === "undefined") {
      alert("\u4E0D\u652F\u6301IE6\uFF01\u8BF7\u4F60\u4EEC\u653E\u8FC7IE6\u5427\uFF0C\u5B83\u592A\u8001\u4E86\uFF0C\u5C31\u8BA9\u5B83\u5B89\u5FC3\u7684\u53BB\u5427\u2026\u2026");
      return false
    } else {
      $("body").append('<div id="bigfa_bg" style="' + css_bigfa_bg + '"></div><p id="zshowbox_loading" style="' + zl_style_1 + 'font-size:22px;background-color:#000;"></p><div id="bigfa" style="' + css_bigfa + '"><img id="bigfa_img" style="' + css_bigfa_img + '" /></div>');
      $("#bigfa_bg").fadeTo(600, .8);
      zloading = 0;
      $zshowbox_loading = $("#zshowbox_loading");
      $zshowbox_loading.fadeTo(1, .85).zloading();
      bigfa_img("#bigfa_img", bigfa_img_url, pagesize);
      $("#bigfa_prev,#bigfa_next").click(function() {
        if ($(this).attr("id") == "bigfa_prev") a--;
        else a++;
        $("#bigfa").find("img").remove().end().append('<img id="bigfa_img" style="' + css_bigfa_img + '" />');
        bigfa_img_url = $("#bigfa-" + a).attr("href");
        bigfa_img("#bigfa_img", bigfa_img_url, pagesize, a, d);
        return false
      });
      $("#bigfa_bg,#bigfa_img").click(function() {
        zloading = 1;
        $zshowbox_loading.remove();
        $("#bigfa_bg,#bigfa_img").unbind("click");
        $("#bigfa_bg,#bigfa").fadeOut(400,
        function() {
          $(this).remove()
        });
        return false
      })
    }
    return false
  });

发表评论

电子邮件地址不会被公开。 必填项已用*标注

WordPress Theme O’Connor 修改记录日志》上有20条评论

      1. 佐仔 文章作者

        不过还好,Google AD 自身还可以设置过滤一些不想展示的广告类别。这一点值得夸奖。我全过滤了,嘻嘻。

        回复

发表评论

电子邮件地址不会被公开。 必填项已用*标注