• zAlive主题已在Github开源

    其实zAlive主题一直都是开源的并且在WordPress官方主题目录提供下载,最近将其放在Github上面,原因有二

    • 使用Git版本控制,这样妈妈再也不用担心文件丢失之类的问题了
    • 装装逼
  • WP Super Cache预缓存可能已失去响应问题

    最近经常会收到WP Super Cache发送的邮件(从9月23号开始收到第一封,然后10月多开始频率增加,不过最多也就1天1封,但是现在1天竟然收到了5封)。

    邮件如下:

  • WordPress中is_front_page()和is_home()的用法及区别

    最近在WordPress论坛里有朋友在反馈zAlive主题 的幻灯片设置有问题,具体表现为设置了幻灯片为只在首页显示,但是在博客页面还是会显示(WordPress可以将首页设置为一个静态页面,用另外一个页面显示博客,详见>>Creating a Static Front Page)。

    这就让我想到了is_front_page()is_home(),因为前一段在做主题的时候就查过(囧,当时没认真看),为什么现在还有问题?既然不知道那就再查一下,先来看下两者的官方文档吧。

  • 给[Subscribe to Comments Reloaded]插件创建真实管理页面

    Subscribe to Comments Reloaded是什么

    Subscribe to Comments Reloaded是一款WordPress评论订阅通知及管理插件,用户可以通过邮件接收文章的评论更新通知,当然也可以通过设置取消所有通知。

    为什么要创建真实管理页面(real management page)

    原因很简单,我使用了文章自动摘要插件,而订阅管理页面(虚拟页面)默认使用的并不是page模板,而是一个列表页,想要看详情就要点击[阅读全文]链接,不过最重要的是这个:

  • 独立网站启用Chrome插件内联安装教程

    关于Chrome插件想必用Chrome浏览器的童鞋都很清楚,不过这标题写的说实话有点让人晕,要解释清楚标题,首先要了解一下Chrome插件的安装机制。

    Chrome插件安装机制

    目前据我的了解,你可以用这3种方法安装Chrome插件

    1. 在Chrome Web Store查找插件或者是打开某一个插件在Chrome Web Store上的链接,点击安装即可,这是最常用最通用的方法
    2. 获得扩展名为crx的插件 > 打开Chrome浏览器的扩展程序页面 > 将获得的文件直接拖拽至上一步所述页面 > 安装
    3. 拥有插件的zip压缩包 > 解压文件 > 打开Chrome浏览器的扩展程序页面 >启用开发者模式 > 点击“加载正在开发的扩展程序”并选择刚才解压出来的文件目录

    然而本文所介绍的插件安装方法并不属于上述任意一种,这就是下面要说的第4种安装方法

    内联安装(Inline Installation)

    这内联安装我用一句话概括就是:你制作了一个插件并且已经在Chrome Web Store上发布,同时你还想让你网站内的用户也能够直接在你的网站上安装插件而不用再跑到Chrome Web Store那里。

    如果还是不太明白的话可以看看下面人家官方的原文

    Once you’ve published your app or extension, you may be wondering how users will find and install your app. For users who browse the Chrome Web Store and find your item, its a very easy one-click process to install it. However, if a user is already on your site, it can be cumbersome for them to complete the installation – they would need to navigate away from your site to the store, complete the install process, and then return.Chrome插件内联安装图片

    As of Google Chrome 15, you can initiate app and extensions installations “inline” from your site. These apps and extensions are still hosted in the Chrome Web Store, but users no longer have to leave your site to install them.

    When users install the app, they will see an installation confirmation dialog similar to the one pictured on right. Just like the dialog displayed when installing directly from the Chrome Web Store, it lists all of the permissions that your app or extension is requesting. Additionally, this dialog includes the average Chrome Web Store rating and the number of users, giving users extra confidence about what they are about to install.

    内联安装的必要条件

    • 插件已经在Chrome Web Store上发布
    • 内联安装的页面地址必须是插件在Chrome Web Store上发布时所关联网站的子域或子页面(比如插件发布时关联的网站是http://www.zenoven.com,那么内联安装页面的地址可以是http://chrome-extensions.www.zenoven.com或者http://www.zenoven.com/chrome-extensions)

    内联安装页面的制作

    1、在页面的head内插入一个Chrome Web Store link

    即将下面的代码插入页面<head></head>之间

    <link rel=”chrome-webstore-item” href=”https://chrome.google.com/webstore/detail/itemID“>

    itemID可以在打开一个插件的Chrome Web Store链接后找到,下面是我的查看源码Chrome插件的link

    <link rel=”chrome-webstore-item” href=”https://chrome.google.com/webstore/detail/ggkbiakmiljlbbfhjajlpjgckcjanbab“>

    2、触发内联安装

    原文里面写的比较多,按照我的理解其实很简单也就是用JS写些判断代码,增强用户体验,下面是我个人的一些逻辑步骤

    1. 在页面合适的地方插入一个按钮或链接或者是你想用的元素,用于触发安装,这里假设为一个button
    2. 用JS判断浏览器是否是Chrome,如果不是则将button设为disabled并且button内的文本修改为“只适用于Chrome浏览器”,如果是的话就直接进入下一步
    3. 判断该插件是否已安装,如果已安装则修改button文本为“已安装”并且设为disabled,如果未安装则进入下一步
    4. 调用安装函数,修改button文本为“正在安装…”并且设为disabled
    5. 根据安装结果修改button(安装成功则修改button文本为“安装成功”并且设为disabled,否则将button状态及文本恢复到点击button之前)

    说了那么多,其实就是这段JS代码(需jQuery,另外上面所说的button已经在页面内插入,并且button的id为install-button)

    (function($){
      var e = $('#install-button')
        ,originalText = e.html()
        ,itemURL = $('link[rel=chrome-webstore-item]').attr('href')
        ,isChrome = /chrom(e|ium)/.test(navigator.userAgent.toLowerCase());
      checkAndSetButton();
      e.click(function(){
        e.html('正在安装...').attr('disabled',true);
        chrome.webstore.install(
          itemURL
          ,function(){
            e.html('安装成功!').attr('disabled',true);
          }
          ,function(){
            e.html(originalText).attr('disabled',false);
          }
        );
      });
      function checkAndSetButton(){
        if(isChrome){
          if (typeof chrome !== "undefined" && typeof chrome.app !== "undefined" && chrome.app.isInstalled) {
            e.html('已安装').attr('disabled',true);
          }
        }else{
          e.html('只适用于Chrome浏览器').attr('disabled',true);
        }
    
      }
    })(jQuery);
    

    好了,上面就是独立网站启用Chrome插件内联安装教程的主要内容了。

    PS:有的童鞋可能会问怎么样才能在指定页面的指定位置插入任意代码呢?我的办法是安装一个插件:Code Insert Manager ,该插件就可以在不改动任何代码的情况下完成上述任务。

    另附一些我制作的Chrome插件:

  • 用get_comments实现WordPress带头像最新评论

    前一段在制作zAlive主题的时候需要一个带头像最新评论widget,网上Google了一大圈发现用的最多的是SQL,我也就直接拿来用了,而且神奇的是通过了WP的主题审核,但是后来在更新主题的时候怕不给通过,就索性找别的方法,也就是今天的主角,get_comments()

    其实用get_comments()实现WordPress带头像最新评论zww很早就有一篇文章介绍,但是从2010年到现在WP已经升级了N多个版本,原来的参数有的已经失效,于是我就重新翻阅文档,用新版的get_comments实现WordPress带头像最新评论。

    我写的这个可以指定获取的评论数,头像尺寸,评论字符数

    function zAlive_recentComments($count,$avatarSize,$excerptLength){
        $comments;
        if( $count != 0 ){
          //新版的get_comments()不能直接获取指定类型的评论(比如会获取到pingback/trackback),+30是为了多获取一些评论,从而减少获取不到指定数量的评论的机会
          $comments = get_comments( apply_filters( 'widget_comments_args', array( 'number' => $count + 30, 'status' => 'approve', 'post_status' => 'publish' ) ) );
        }
        $valid_comments_number = 0;//有效评论数
        $output = '';
        if( !empty ( $comments ) ){
          foreach ($comments as $comment) {
            $post = get_post( $comment->comment_post_ID );
            //评论不是pingback或trackback并且评论所属文章没有密码保护
            if( empty ($comment->comment_type ) && empty ( $post->post_password ) ){
              $output .= '<li class="clearfix">'. get_avatar($comment, $avatarSize) .'<div class="comment-data"><a class="title" href="' . get_permalink($comment->comment_post_ID) . "#comment-" . $comment->comment_ID . '" title="on ' . strip_tags( $post->post_title) . '">' . wp_html_excerpt( strip_tags ( $comment->comment_content), $excerptLength ) . '</a>' .'<span class="comment_author detailed visible-desktop">From <span class="author">' . $comment->comment_author . '</span>&nbsp;&nbsp;<span class="date">' . $comment->comment_date . "</span></span></div></li>";
              $valid_comments_number++;
              if( $valid_comments_number == $count )
                break;
            }
          }
        }
        $output = convert_smilies($output);
        echo $output;
      }
    

    然后就是调用了,比如zAlive_recentComments(10,40,100)

  • WordPress主题提交及审核

    想必有很多同学想制作一款属于自己的主题并将其提交给WordPress主题官方目录,我曾经这样想过并且现在已经成功提交了一款主题(zAlive主题),这篇文章就以我提交zAlive主题的过程来总结下WordPress官方主题提交及审核。

    提交前应做的准备

    • 阅读主题制作规范及审核要等文档

      虽说本文不设计具体的制作教程,但是因为阅读这些文档直接关系到主题的最终命运,并且能避免你走弯路,甚至是掉进自己挖的坑(比如我早期的主题中很多需要翻译的文字我用的是中文,而非英文,而人家文档中早早的就说明了需要用英文(Themes must provide all public-facing text strings in English.),然后再翻译成多语言版本)。为了你的主题能够光荣的通过审核并应用于千万WordPress用户,自己点下面的链接进去看看吧。

    • 主题检查及测试

      测试主题能让你知道自己主题的问题,还能够缩短审核流程。至于具体的测试流程我就不再说了,提供几个有用的链接:

    • 一个正常能用的WordPress.org网站账号
    • 一个常用邮箱(因为主题提交好的feedback都会发到这个邮箱)
    • 一个制作好并zip打包的WordPress主题(文件最好带上版本号比如zAlive.1.2.1.zip,并且style.css也同样改好版本号)
    • 几个浏览器(个人意见,我用Chrome及Firefox都无法提交所以最终完成任务的是IE,WordPress官方推荐用Chrome)

    上传主题

    前面说的准备好之后就可以正式提交你的主题了:

    1. 打开链接>>WordPress主题上传
    2. 登陆你的WordPress账号
    3. 选择文件并上传

    在上传成功之后网页上会提示主题是否上传成功,还会给一些其他的信息(和WordPress主题测试插件产生的测试信息基本一样),如果有Fail(失败)或Required(必须):XXX之类的信息,你一定要修改好并上传新版本,如果是Recommended(推荐)之类的信息能修改的也修改吧(比如我的zAlive主题最初在上传后有4个Recommended信息,其中一个是让在style.css里面加上.bypostauthor的定义,开始我不愿意加后来审核的时候审核员也让我加我才给加上了)

    审核

    主题上传成功后你的邮箱会收到封邮件(比如我的邮件标题是[WordPress Themes] zAlive – feedback),里面有你主题上传后WordPress网站自动生成的ticket链接,以后主题审核过程中的反馈都在该ticket里面。 生成了ticket并不代表已经有人在审核(废话),你可以点击这里>>查看你的ticket在队列中的位置,新上传的主题会在下面蓝色的区域。另外ticket被系统自动分为4种优先级,按下面顺序依次降低:

    1. 审核通过的主题(Currently Approved Themes,通常是由于主题升级产生的)
    2. 审核队列里超过两星期的(Tickets Older Than 2 Weeks)
    3. 之前已审核过但未通过的(Previously Reviewed, Not-Approved Themes)
    4. 新上传未审核的主题(New Themes, Never Reviewed)

    由于你的主题是新上传的,所以优先级最低,是第四优先级(不过现在也不用担心,现在审核速度很快的,我的是在1天后被分给审核员的)。在被人工审核前你可以正常修改代码并上传新版本,这并不影响你的ticket在队列中的位置。 如果之后收到邮件提示被人工审核了,那么就等待吧,人家说什么了就看看并给出回复,然后修改主题上传新版本(与之前上传主题一样,不是在ticket页面上传附件,另外记得修改版本号),直到通过审核前都是这么个流程。

    吐槽

    我在等待zAlive主题审核过程中曾经遇到过一位差劲的审核员,完全属于站着茅坑不拉屎的人(被他占了两个星期的坑,而我的主题从提交到审核通过共用了三个星期),在我的第3个ticket创建后被分配给了他(hiddenpearls),但是呢,分配后1星期没有任何反馈,直到另外一位审核员(chipbennett,好像是管理员)询问他为毛没有任何反应的时候,这家伙说他在度假,下周一会回来并审核!!!好吧,度假,那我就等吧,可是结果呢,在他说的日期过了两天后还是没有任何反应,我艹,这不完全是坑爹嘛!我知道审核主题都是义务劳动,没有酬劳的,我完全理解,我完全可以等,但是呢,你就不能给我回复下或者是给别的审核人员说下然后再分配给别人?另外言而无信这样的行为你又该作何解释呢? 无奈之下,我到主题审核人员邮件列表里面订阅了邮件,并发了邮件说明问题,结果分分钟人家就给了邮件回复并发邮件给其他人员看是否有空可以把ticket分配出去,然后没过多久ticket就成功被再次分配并审核了,所以嘛,你看人家这素质,再对比下之前那位,呵呵~~ 看到了吧~ 参差不齐啊! 所以如果你也遇到类似的问题,或者在主题审核上有问题也可以订阅这个邮件列表并发邮件(一般情况下不需要的,在ticket里面有问题的话回复给审核员,他是会给你回复的)。

  • WordPress升级到3.6

    其实我很早就知道最近WordPress要升级了,因为前几天在提交zAlive主题的时候在WordPress主题目录里面看到了Twenty Thirteen主题的ticket,当时还在纳闷这货是咋回事,等到第二天WordPress发布3.6更新后才恍然大悟(够迟钝,不过话说我当时也没多想嘛~

第1页,共2页12