Life Studio » 电脑网络

美化 Feedburner 邮箱订阅

万戈 — Sat, 31 Jul 2010 13:01:20 +0000

　　感谢Boss方小盆友，就在我文囧不知道今天更新啥的时候，Boss方解救了我，因为他问了我一个问题：“老万，你文章页侧边栏最下面那个输入邮箱订阅是咋整的？求教程。。”其实这个很简单，一句话就可以搞定的，既然我文囧，好吧，我就发挥一下我吹水的实力，把这一句话可以解决的答案拉扯出洋洋洒洒一整篇。

　　还没有玩过我右下角这个邮箱订阅的新老朋友们，可以先试试，放心吧，不是一键订阅的，输入邮箱后还需要一个确认的过程，所以你可以输入并点击确定试试，就算你不小心订阅了本站，也可以通过邮件取消订阅（一般上了我的贼船，想下船的比较难，HIAHIA～）玩过的朋友应该都发现了吧，这是 Feedburner，我们都知道 Feedbuner 已经不幸遇难，不过它的邮箱订阅功能居然奇迹般地存活了下来，简单说来，这个邮箱订阅就是借用了 Feedburner 的功能并且加以美化。具体地、罗嗦地、详细地方法如下：

　　1、跨墙登陆 Feedburner，怎么跨墙请 Google 之。有童鞋抱怨 Feedburner 没有中文版，这也没啥好抱怨的，人家一头撞在墙上，连吭都不吭一声，已经很伟大了。而且嘛，Feedburner 也不是没有中文版，只是汉化得比较烂，Feedburner 都不好意思公开。对英文不太友爱，又不嫌弃 Feedburner 这汉化水准的童鞋，可以尝试这个链接。

　　2、获取邮箱订阅代码。在 Feedburner 的设置中，选择 Publicize — Email Subscriptions — Subscription Management，选择 Feedburner 中文版的用户请对照执行。这时候会得到类似如下的代码：

 style="border:1px solid #ccc;padding:3px;text-align:center;" action="http://feedburner.google.com/fb/a/mailverify" method="post" target="popupwindow" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=wange', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true">

    Enter your email address:

     type="text" style="width:140px" name="email"/>

     type="hidden" value="wange" name="uri"/>

     type="hidden" name="loc" value="en_US"/>

     type="submit" value="Subscribe" />

    Delivered by  href="http://feedburner.google.com" target="_blank">FeedBurner

　　但是懂一些 HTML 知识的同学应该不难看出，其中关键的有用的部分就只有 form 标签里的那一行，把它提取出来，其余全部扔掉。

　　3、美化邮箱订阅代码。美化的方法当然各有不同，我就根据自己的主题，修改觉得比较合适的样式，仅供参考：

 style="height:40px;position:relative;padding:3px;" action="http://feedburner.google.com/fb/a/mailverify" method="post" target="popupwindow" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=wange', 'popupwindow', 'scrollbars=yes,width=350,height=520');return true">

     type="text" style="width:220px;height:25px;position:absolute;left:20px;line-height:25px;font-family:'Courier New','Lucida Console','monospace';padding:5px;border:1px solid #ccc;" name="email" value="请输入您的邮箱" onfocus="if (this.value == '请输入您的邮箱') {this.value = '';}" onblur="if (this.value == '') {this.value = '请输入您的邮箱';}"/>

     type="hidden" value="wange" name="uri"/>

     type="hidden" name="loc" value="en_US"/>

     type="submit" style="width:60px;height:35px;position:absolute;right:20px;" value="确认订阅" />

　　比较懒，样式都内联了，童鞋们不要学我。不过这有一点方便，就是这么一坨代码扔哪里都可以，就算删掉，也不用担心有残留在样式表里的 CSS，我就把这串代码放在 Wordpress 的小工具里，当然放在 sidebar.php 也是可以的。最后上一张效果图，顺便打个小广告：小站订阅方式多多，不仅可以通过这个邮箱订阅，还可以通过 http://feed.wange.im 这个网址订阅我哟～还等什么，快上贼船吧！

» 转载请注明来源：Life Studio » 《美化 Feedburner 邮箱订阅》

» 本文链接地址：http://wange.im/landscaping-feedburner-email-subscriptions.html

» 订阅本站：http://feed.wange.im

Wordpress 向来自其他域的访客致欢迎词

万戈 — Fri, 30 Jul 2010 12:11:08 +0000

　　在 Wordpress 上对来自其他域的访客显示欢迎词，这个效果我之前写过一篇类似的，《Wordpress 高亮显示关键词及欢迎提示》，之前这一篇是对特定访客显示欢迎词，也就是只对来自搜索引擎的访客显示欢迎提示词，而且对常用的搜索引擎还需要我手工添加进数组，并不是很全面，对百度、Google、有道、必应这些之外的搜索引擎就无效了。而今天介绍的这个方法就很全面，不仅可以涵盖所有的搜索引擎，就连其他任何不加密的网站也都适用！

　　不信？可以先做个测试。如果我有在贵站留过言，或者你很给面子地给我做了一个友链的小盆友们，你们可以通过自己网站上任何一个可以通向本站的链接访问本站。进来之后，你看到了啥？右侧的那个浮动层瞧见没？就是这个了。再比如说通过我的 Twitter(@wange1228)的主页，上面有我博客的链接，点击进入我的网站后，如下图：

Twitter上的博客链接

从twitter来的欢迎词

　　现在应该明白我讲的是啥效果了吧，在道明方法之前，首先要感谢 illacrimo-plus 主题的作者，虽然我也不知道是谁。本文的方法就是从这个主题上扒下来的，方法如下：

1、把以下代码复制到 Wordpress 主题的 functions.php 中：

function show_refer_in(){

     $refer_info=$_SERVER['HTTP_REFERER'];

     $ban_list=array($_SERVER["HTTP_HOST"]);

     for($ii=0;$ii<count($ban_list);$ii++){

        if(strpos($refer_info,$ban_list[$ii])){

            return;

        }

    }

    if($refer_info){

        preg_match("/^(http:\/\/)?([^\/]+)/i",

        $refer_info, $matches);

        $host = $matches[2];

        echo "欢迎来自 ".$host." 的朋友！
推荐您 点击这里 订阅我的博客 o(∩_∩)o×
";

    }

}

2、在主题文件的任何部位调用以下函数，我建议是放在 footer.php 中：

 show_refer_in();?>

3、接下来样式部分仅供参考：

#hellobaby {

    background:#000000;

    border:1px solid #B3B3B3;

    color:#FFFFFF;

    font-size:14px;

    opacity:0.7;

    filter:alpha(opacity=70);

    padding:10px;

    position:absolute;

    right:0;

    top:250px;

}

　　基本完成了，本文提到的文法和 Wordpress 高亮显示关键词及欢迎提示中的提示词部分有点重复，不过高亮显示关键词还是很有用的，所以两者我都用上了，感觉还不错，你说呢？

　　Update：经热烈讨论，同学们普遍反映，如果每次跳转过来都会有这个欢迎词，就会显得有些烦人，有些碍眼。感谢小邪，提供了记住 Cookies 的方法，8过很遗憾，居然在我这里测试会报错。所以我用了另一种折衷的办法，加了个判断，对所有留过言的朋友不显示该欢迎词，其实也是借用了 Cookies 的概念，现在要看这个效果的小盆友们，就要先清除浏览器缓存才行咯。感谢，也欢迎大家提出更多宝贵意见～

» 转载请注明来源：Life Studio » 《Wordpress 向来自其他域的访客致欢迎词》

» 本文链接地址：http://wange.im/wordpress-say-hello-to-vistors.html

» 订阅本站：http://feed.wange.im

Jquery 实现 Wordpress 评论字数计数

万戈 — Tue, 27 Jul 2010 14:02:49 +0000

　　不好意思各位访客朋友们，因为去了合肥几天，博客也就搁置了，回来也没有一一回复童鞋们的留言，赶紧埋头把手头上的工作解决掉，晚上又挤了一点时间折腾 Wordpress，拳不离手，曲不离口，一天不折腾 Wordpress，手就痒痒，三天没碰代码，都感觉有点生疏了，差点找不到折腾的目标。

　　今天折腾的 Wordpress 目标是实现留言字数的实时计数功能。因为看到之前 qiqiboy 写过一篇文章介绍了，不过 qiqiboy 是自己写的 Javascript 脚本，虽然很简单，不过我还是嫌代码多，就一直没加上，今天折腾了一种 Jquery 实现的 Wordpress 对评论字数进行实时统计计数的功能。因为比较仓促，就只在留言板页面加上了这个效果，有兴趣的朋友可以先去留言板看看效果。样式也没有怎么修整过，比较粗糙，多多包涵啦～

　　接下来说方法：

1、加载 Jquery

　　这个是必须的，可以用 Google 托管的，也可以下载到本地服务器调用，Jquery 1.2X 的版本就够用了。

2、Jquery 的执行脚本

<script type="text/javascript" >

$(function(){

    var $comment = $('#comment');

    var $str  =  $('#str');

    var time;

    $comment.focus(function(){

        time = window.setInterval( substring,100 );

    });   

    function substring() {

        var val = $comment.val();

        var length = val.length;

        if( $str.html() != (length) ){

            if(length==0){

                $("#wordcount")[0].firstChild.nodeValue = "您已输入0";

                $str.html(length);

            }else{

                $("#wordcount")[0].firstChild.nodeValue = "您已输入";

                $str.html(length);

            }

        }

    }

});

</script>

　　是不是看起来更精简一些呢？这个一定要放在 Jquery 的后面，代码的顺序问题。

3、HTML 部分

 id="wordcount">

    您已输入 id="str">0字

　　这部分代码就是要 wordcount 和 str 这两个 id 和第二步中的相匹配，包括第二步中的 #comment 也要和评论框的 id 相匹配，否则获取不到。

　　好了，就写到这里吧，也不多写了，重点都说到了，接下去就看各位的悟性了，哈哈～

» 转载请注明来源：Life Studio » 《Jquery 实现 Wordpress 评论字数计数》

» 本文链接地址：http://wange.im/comment-count-in-wordpress-with-jquery.html

» 订阅本站：http://feed.wange.im

WordPress 显示访客最近评论次数

万戈 — Tue, 20 Jul 2010 12:29:52 +0000

　　暑假本来是我静下心来好好折腾 Wordpress 的时候，可是俺们领导疯了，暑假加班还要死命地拖着我一起，已经连续两天了，明天还要加班，哥的假期就这样被他活生生地给毁了。所以最近都没有太多的时间折腾 Wordpress 好玩的新功能，看到有啥新鲜的东东就顺手牵羊地加上了，比如说 Winy 小盆友的 WordPress 显示最近评论次数。加上后自我感觉效果还不错，就分享一下这个方法啦～

　　说的简单点，Wordpress 显示最近评论次数的功能就在于，显示访客30天发表留言的数量。Winy 小盆友的代码写的不错，我啥也没改就扔上来了（8好意思啊 Winy 童鞋，我连 URL 都赤果果地照搬过来了，HIAHIA～）。

　　把以下代码复制到 Wordpress 主题文件夹的 functions.php 中：

//copy下面的代码到主题functions.php里调用
/**
* welcome message
* @param unknown_type $email
* @return void|string
*/
function WelcomeCommentAuthorBack($email = ''){
        if(empty($email)){
                return;
        }
        global $wpdb;
        $past_30days = gmdate('Y-m-d H:i:s',((time()-(24*60*60*30))+(get_option('gmt_offset')*3600)));
        $sql = "SELECT count(comment_author_email) AS times FROM $wpdb->comments WHERE comment_approved = '1' AND comment_author_email = '$email' AND comment_date >= '$past_30days'";
        $times = $wpdb->get_results($sql);
        $times = ($times[0]->times) ? $times[0]->times : 0;
        $message = $times ? sprintf(__('过去30天内您评论了%1$s次，感谢关注~' ), $times) : '您很久都没有留言了，这次想说点什么吗？';
        return $message;
}

　　使用方法：在　comments.php　合适的地方，比如留言框上面调用这个函数：

 echo WelcomeCommentAuthorBack($comment_author_email); ?>

　　基本的使用方法就是这样啦，之前留过言的童鞋可以在下面评论的欢迎提示词中看到效果，把鼠标移到你的昵称上，就会弹出一个留言次数的小提示了。截图如右图，不看不知道，一看吓一跳，在过去的30个月里，我居然盖了2082层楼，平均每天70层楼，我才是当之无愧的水王呀，哈哈哈哈。

　　不过要声明一下，我另外还用了 Jquery 的方法先把这个提示消息隐藏了起来，需要鼠标有一个 mouseover 的事件才会显示出来，需要加上此效果的朋友可以看这篇文章，这里就不重复说明了。

　　围观 Winy 原创：http://winysky.com/wordpress-shows-the-number-of-recent-comments

» 转载请注明来源：Life Studio » 《WordPress 显示访客最近评论次数》

» 本文链接地址：http://wange.im/wordpress-shows-the-number-of-recent-comments.html

» 订阅本站：http://feed.wange.im

Wordpress 站内搜索高亮显示关键词

万戈 — Sun, 18 Jul 2010 12:00:26 +0000

　　被 Qiqiboy 刺激后，我阴差阳错地折腾出了非插件的 Wordpress 高亮显示关键词及欢迎提示，但是这个搜索关键词高亮提示仅仅是针对来自 Google、百度等搜索引擎的访客，貌似对用站内搜索的朋友就有些不公平了，所以昨天考完试，我今天又马不停蹄地折腾起来，誓言要把 Wordpress 站内搜索高亮显示关键词的功能搞定！结果，还真搞定了，哈哈～

　　无论是用 PHP 还是 Javascript 来实现 Wordpress 站内搜索高亮关键词，都不可避免地会用到正则表达式，而偏偏这又是我的软肋，汗颜～先是参考了网上流传最多的 Jquery 实现站内搜索高亮关键词的方法，很可惜，这是一个老外的成果，完全没有考虑到我们非英语为母语的国家，所以这个高亮方法仅支持英文单词开头的关键词，用中文就杯具了。

　　所以最终还是参考了 Qiqiboy 的 wordpress高亮搜索结果+实现关键字前后截断显示。。。，他用的是 PHP 正则表达式的方法，最大的特点就是可以完美支持中文，而且比 Jquery 的方法执行速度也更快，最让我喜欢的一点是，非插件！哈哈～于是就拿来根据自己的主题修改了一番，方法如下：

　　在 Wordpress 主题文件的 search.php 搜索结果文件中的主循环中加入以下代码：

    $title = get_the_title();

    $content = mb_strimwidth(strip_tags(apply_filters('the_content', $post->post_content)), 0, 600,"......");

    $keys = explode(" ",$s);

    $title = preg_replace('/('.implode('|', $keys) .')/iu','\0',$title);

    $content = preg_replace('/('.implode('|', $keys) .')/iu','\0',$content);

?>

　　调用高亮的标题用以下代码：

 echo $title; ?>

　　调用高亮的日志内容用以下代码：

 echo $content;?>

　　就这样，效果还是蛮不错的，大家可以去我头部导航右上角的站内搜索输入一些关键词试试，中文的、英文的都可以。另外我的 PHP 实力很菜，这修改过程可能不太完美，而且以上代码是根据我自己主题的需要修改的，并不完全通用。大家有同样需要 Wordpress 站内搜索关键词高亮显示功能的，可以直接去 Qiqiboy 的原文学习：http://www.qiqiboy.com/2010/07/16/wordpress-highlighted-keyword-search-results.html

　　最后贴一张站内搜索关键词高亮的截图：

Wordpress 站内搜索高亮显示关键词

» 转载请注明来源：Life Studio » 《Wordpress 站内搜索高亮显示关键词》

» 本文链接地址：http://wange.im/highlight-keywords-in-wordpress-search.html

» 订阅本站：http://feed.wange.im

Wordpress 高亮显示关键词及欢迎提示

万戈 — Fri, 16 Jul 2010 12:01:57 +0000

　　写这篇文章绝对是受了 Qiqiboy 的刺激，该小盆友说我的 Wordpress 站内搜索没有用关键词高亮，而且还有图有真相的，巨受打击。好吧，我顶着明天两门考试可能挂彩的压力，今天就不复习了，全心投入到研究 Wordpress 关键词搜索高亮显示的行列中，什么 PHP 啊、JQuery 啊、CSS 啊、正则啊、获取 Cookies 啊，反正能用的我都用上了，8 过神奇的是，折腾出来的不是 Wordpress 自带的站内搜索的关键词高亮，而是来自 Google、百度等搜索引擎的关键词高亮显示，并且对访客显示欢迎提示词。

　　这样说是很难让人理解的，你可以先试试用百度或者 Google 搜索本站的关键词“万戈”，再通过搜索引擎的结果点击进入本站，就可以看到效果了，在右侧栏的位置可以看到一个可以随滚动条上下浮动的弹出层，显示“欢迎来自 *** 的朋友！推荐您 点击这里 订阅我的博客 o(∩_∩)o ”，这里的 *** 是可以显示通过哪个搜索引擎入口来访的，很亲切哟。

　　另外，用我的一些其他的关键词，如“Wordpress 读者墙”之类的，通过搜索引擎点击进入本站，则会看到你搜索的关键词已经加粗高亮，这样也就强调了访客希望看到的重点内容，提高了访客的体验。

　　以下两张分别是搜索引擎的关键词高亮和来自搜索引擎的访客欢迎提示词的截图。

搜索高亮显示关键词

搜索访客显示欢迎提示词

　　好了，废话到此结束，下面是代码部分，首先要感谢一下 landing-sites 插件的作者，我就是在此研究成果上精简修改并折腾出了非插件版本的、更适合中国本土搜索引擎、再加上我无敌美化的代码～

　　一、首页是 PHP 的函数部分，老规矩，把以下代码复制到 Wordpress 主题目的 functions.php 中：

function ls_get_delim($ref) {
    $search_engines = array    (
                            'google.com' => 'q',
                            'google.com.hk' => 'q',
                            'baidu.com' => 'wd',
                            'search.yahoo.com' => 'p',
                            'cn.search.yahoo.com' => 'p',
                            'cn.bing.com' => 'q',
                            'search.lycos.com' => 'query',
                            'youdao.com' => 'q',
                            'search.aol.com' => 'query',
                            'ask.com' => 'q',
                            'hotbot.com' => 'query',
                            'overture.com' => 'Keywords',
                            'search.netscape.com' => 'query',
                            'search.looksmart.com' => 'qt',
                            'search.earthlink.net' => 'q',
                            'search.viewpoint.com' => 'k',
                            'mamma.com' => 'query'
                            );
    $delim = FALSE;
    if (isset($search_engines[$ref])) {
        $delim = $search_engines[$ref];
    }
    return $delim;
}
function ls_get_terms($d) {
    $terms = null;
    $query_array = array();
    $query_terms = null;
    $query = explode($d.'=', $_SERVER['HTTP_REFERER']);
    $query = explode('&', $query[1]);
    $query = urldecode($query[0]);
    $query = str_replace("'", '', $query);
    $query = str_replace('"', '', $query);
    $query_array = preg_split('/[\s,\+\.]+/',$query);
    $query_terms = implode(' ', $query_array);
    $terms = htmlspecialchars(urldecode($query_terms));
    if (!seems_utf8($terms)){
        $terms=iconv("GBK", "UTF-8", $terms);
    }
    return $terms;
}
function ls_get_refer() {
    if (!isset($_SERVER['HTTP_REFERER']) || ($_SERVER['HTTP_REFERER'] == '')) return FALSE;
    $referer_info = parse_url($_SERVER['HTTP_REFERER']);
    $referer = $referer_info['host'];
    if (substr($referer, 0, 4) == 'www.')
        $referer = substr($referer, 4);

    return $referer;
}
function ls_getinfo($what) {
    $referer = ls_get_refer();
    if (!$referer) return FALSE;
    $delimiter = ls_get_delim($referer);

    if ($delimiter)
    {
        $terms = ls_get_terms($delimiter);

        if ($what == 'isref') {
            return ($terms != ''?true:false);
        }
        if ($what == 'referrer') {
            $parsed = parse_url($_SERVER['HTTP_REFERER']);
            echo '.$parsed['host'].'">'.$parsed['host'].'';
        }
        if ($what == 'terms') { echo $terms; }
       
    }
}
function  ls_terms_filter($content){
$referer = ls_get_refer();
$output = '';
$delimiter = ls_get_delim($referer);
if($delimiter)
{
$terms = ls_get_terms($delimiter);
$terms= array_unique(preg_split("/[\s,]+/", $terms));
$contentarr = preg_split("/(<.*>)/U", $content, -1, PREG_SPLIT_DELIM_CAPTURE);
$stop = count($contentarr);
for ($i = 0; $i < $stop; $i++) {
$content = $contentarr[$i];
if ((strlen($content) > 0) && ('<' != $content{0})) {
foreach ($terms as $term) {
if (strlen($term)>1)
$content=eregi_replace("($term)","\\1", $content);
}
}
$output .= $content;
}
return $output;
} else{
return $content;
}
}
add_filter('the_content', 'ls_terms_filter');
add_filter('comment_text', 'ls_terms_filter');
function ls_set_header() {
    if (ls_getinfo('isref')) header('Vary: Referer', FALSE);
}
add_action('init', 'ls_set_header');

　　可以看到在搜索引擎的数组中，我加入了 google.com.hk、百度、有道、必应等适合中国网民的搜索引擎，当然你也可以按照这样的格式再添加几个。

　　二、是 HTML 和调用以上函数的部分，可以放在任何地方，个人建议放在 footer.php 中，最后用样式定一下位嘛就可以了：

 if (ls_getinfo('isref')) : ?>

 id='hellobaby'>欢迎来自  ls_getinfo('referrer'); ?> 的朋友！ />推荐您  href='http://feed.wange.im' target='_blank'>点击这里 订阅我的博客 o(∩_∩)o

 class="closebox"> href="javascript:void(0)" onclick="$('#hellobaby').slideUp('slow');$('.closebox').css('display','none');" title="关闭">×

endif; ?>

　　三、最后是样式部分，这个各位可以发挥各自所长，下面我就提供一下我的样式表，仅供参考：

#hellobaby {

    background:#000000;

    border:1px solid #B3B3B3;

    color:#FFFFFF;

    font-size:14px;

    opacity:0.7;

    filter:alpha(opacity=70);

    padding:10px;

    position:absolute;

    right:0;

    top:250px;

}

　　写到这里，功能上已经实现了，剩下的就是美化工作，最后的最后，你也可以像我这样，给旁边的欢迎提示词用 JQuery 加一个滑动效果，那就更炫了，不过因为篇幅有限，我这里就不多介绍了。

　　最后的最后的最后，还要感谢 http://www.chinawp.com/2009/10/106/ 此文，给了我很大的帮助，本文的灵感就来源于此。

» 转载请注明来源：Life Studio » 《Wordpress 高亮显示关键词及欢迎提示》

» 本文链接地址：http://wange.im/highlight-keywords-and-hellobaby-in-wordpress.html

» 订阅本站：http://feed.wange.im

一句话实现双击滚屏效果

万戈 — Thu, 15 Jul 2010 12:15:19 +0000

　　双击滚屏的效果大家应该都见过吧，特别是在一些在线电子书的网站上，为了方便读者，都加上了双击鼠标自动滚屏的效果，单击鼠标则停止滚动，这应该也算是一种访客体验吧。包括我们最常见的百度百科，它也是用了双击自动滚屏的效果，可见这个效果比较适合于文字较多的网站，可便于阅读，省得滚动鼠标了。

　　鉴于本站取消了 Wordpress 的评论分页后，这评论数量一下子显的就多了起来，这也是为了方便童鞋们看之前的留言嘛，不过这样一来页面也就被拉长了，怕童鞋们把鼠标滚轮滚坏了来找我赔，所以我也就D调加上了这双击滚屏的效果。很快就被细心的木木小盆友发现了，于是就分享探讨了一下啦。

　　实现页面双击鼠标自动滚屏的效果无非是用 Javascript 脚本咯，这是大多数网站的作法，包括百度百科的，不过我对代码的要求是少而精，只要能实现同样的效果就行。于是我就找到了这么一段，应该说是一句代码，只要将其放在头部的 body 标签里就可以实现全站的双击自动滚屏的效果。

 onDblClick="s=setInterval('scrollBy(0,2)',50)" onMousedown="clearInterval(s)" onload="s=0;">

　　这样就 OK 了，这句代码不仅短小，更难能可贵的是，它还支持 Firefox、IE、Safari、Opera、Chrome 等所有主流浏览器，现在这年头测试网站能不用担心兼容还真是一件稀奇事呀，可喜可贺。说到这里，你可以双击一下页面试试，在本版面的任何一个角落双击鼠标都可以实现自动滚屏，单击鼠标左键则停止。

　　说到这里还没完，木木又问了一个问题，如何排除某区域的双击事件？呃。。。对，想起来了，木木也是比较能折腾的主，他用 JQuery 实现了双击回复评论的功能，所以如果在他的评论区域双击的话就可能冲突了，同一个双击事件，到底是滚屏还是回复评论呢？我捉摸着，既然双击滚屏的代码可以放在 body 标签里，那么能不能放在普通的 div 标签里呢？如果可以的话，那不就有办法排除掉评论区域了嘛。后来在本地测试了一下，还真行耶～这里就提供这么一个思路，就不再写代码了，原理和加在 body 中的一样，懂的朋友应该懂了。

　　话又说回来了，一句话的代码实现的滚屏效果毕竟不如百度百科那样大段的 Javascript 脚本实现的完美，页面往下滚动的时候可以发现细微的抖动，不是很平滑，几经调试才选择了以上代码中感觉最为合适的参数，将就着看还是可以接受的。

　　写完才发现原来自己这么话唠，不就一句代码嘛，居然写了这么一长串……

» 转载请注明来源：Life Studio » 《一句话实现双击滚屏效果》

» 本文链接地址：http://wange.im/scroll-for-double-click.html

» 订阅本站：http://feed.wange.im

Wordpress 实现“您的足迹”功能

万戈 — Mon, 12 Jul 2010 12:03:45 +0000

　　今天手贱，又小小地折腾了一下 Wordpress，我也不知道该怎么描述这个功能，可能标题让你有点晕，我们还是先看效果吧。如果是之前留过言的访客，请看内页侧边栏，我新添加了一个“您的足迹”，可以看到，这里列出了留言访客的最近10条评论，当然，只能看到你自己的最近10条评论，原理就是调用记录在你浏览器中的 Cookies，如果你是第一次来访，或者刚刚清空了浏览器的缓存，那就看不到“您的足迹”这个板块了。

　　这其实就是一个最新评论功能的修改版，最新评论中指定隐藏管理员评论，而在“您的足迹”中正好是相对的，要指定显示某一个访客的评论，这里的访客就是指当前浏览器 Cookies 中记录的上一次评论者的信息。明白了原理，实现这个功能也就不难了，在最新评论代码的基础上，把 Cookies 中的访客信息作为变量传递给 comment_author 这个字段就可以了。

　　把以下代码复制到 Wordpress 主题文件中需要的地方，比如说 sidebar.php：

    if($_COOKIE["comment_author_" . COOKIEHASH]!=""){

        global $wpdb;

        $sql = "SELECT DISTINCT ID, post_title, post_password, comment_ID, comment_post_ID, comment_author, comment_date_gmt, comment_approved, comment_author_email, 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 comment_author = '".$_COOKIE["comment_author_" . COOKIEHASH]."' AND post_password = '' ORDER BY comment_date_gmt DESC LIMIT 10";

        $comments = $wpdb->get_results($sql);

        foreach ($comments as $comment) {

            $output .= "\n\"" .get_permalink($comment->ID)."#comment-".$comment->comment_ID. "\" title=\"" . $comment->post_title . " 上的评论\">".strip_tags($comment->comment_author)."： ". strip_tags($comment->com_excerpt) ."
";

        }

        $output = '您的足迹'.$output.'';

        $output = convert_smilies($output);

        echo $output;

    }

?>

　　因为我水平有限，就不一一解释以上代码的意思了，怕误导大家，另外样式表我也不提供了，每个主题的样式都各不相同，这个大家自由发挥吧。如果你嫌以上代码太累赘，可以把代码封装起来放在 Wordpress 主题的 functions.php 里，然后在需要的地方调用，这个扩展也不在本文讨论范围。

　　下面给第一次来访而看不到效果的朋友截了一张图，也欢迎新来的朋友踊跃留言测试呀～

» 转载请注明来源：Life Studio » 《Wordpress 实现“您的足迹”功能》

» 本文链接地址：http://wange.im/show-your-recent-comments-in-wordpress.html

» 订阅本站：http://feed.wange.im

获取 Live Skydrive 的真实地址

万戈 — Sun, 11 Jul 2010 13:38:14 +0000

　　我们都知道，国外网站好的服务大多惨遭不幸，国内网站就没有什么出彩的服务可以和国外同类网站相比，就算偶尔冒出两个也维持不了多久，等翅膀长硬了，于是就纷纷搞收费服务，或者变向甚至不加掩饰地压缩用户现有的空间或者服务产品等。比如说自以为土皇帝的网易就这么干过，曾经应允了永久免费且支持外链的网易相册，在一夜之间，没有任何通知的情况下，就压缩了我所有高清的照片，分辨率和原图像素、大小都被大大压缩，这是何等的卑劣！所以之后我就毅然地放弃了网易相册，国内网站一般黑，我一刻也呆不下去了，之后我就选择了可靠的微软的服务，也就是现在的 Live Skydrive 作为图床。

　　为了不给服务器造成太大的压力，相信很多朋友都把图片和多媒体等比较大的文件放在第三方的服务器上，比如说 dropbox、skydrive 等，不过就如同之前所说的，国外很多优秀的网络服务都被墙奸了，现在稳定且还未被墙的第三方存储服务就要算 Skydrive 比较知名的了，我现在博客上的所有外链图片都是存放在 Skydrive 上的，比较满意。

　　不过用久了 Skydrive 就会发现一个问题，其外链地址是会改变的，这个让人比较囧，以至于上次发布了一本 w3school 离线版电子书教程的下载点，这本电子书存放在了 Skydrive 上，然后三天两头有人来提醒我说链接地址无效，我还经常去更新一下呢。知道 Skydrive 有这个问题（不知道是 bug？还是微软故意为之），但是一直不知道怎么解决。

　　那天看到灰狼兄的一篇文章，才恍然大悟，原来这是有解决办法的，是任平生大哥的杰作，严重怀疑任兄是微软的内部工作人员，居然能开发出 Live 服务这么多好的优化产品，我们是受益匪浅啊。以下就记录一下如何获取 Live Skydrive 外链的真实不变的地址。

　　在 Skydrive 登陆后，选择需要得到外链的文件页面，在浏览器的地址栏里粘贴以下代码：

javascript:var%20n=document.title.replace('%20-%20Windows%20Live','');var%20id=((location.hash=='')?window.selfPageData.currentItemHash:location.hash).replace('#resId/','');var%20u='http://storage.live.com/items/'+id+'?filename='+encodeURI(n);var%20p='http://'+document.location.host+'/redir.aspx?page=self&resId='+id;var%20e=';var%20f='%22%20style=%22width:580px%22%20type=%22text%22%20/>
';var%20d='by%20(Rpsh)';var%20c='\u5916\u94FE\u5730\u5740:'+d+e+u+f+'\u5206\u4EAB\u5730\u5740:'+e+p+f;var%20a=document.getElementById('content');var%20g=(a.getElementsByTagName('p')[0]);var%20b=g?g:document.createElement('P');b.innerHTML=c;a.insertBefore(b,a.firstChild);void(0)

　　此时会得到一个形如：http://storage.live.com/items/……这样的地址，这才是上传文件真正的、不变的、唯一的外链地址，很明显，这比原来那又臭又长的 URL 要干净清爽很多。如下图：

　　这张截图我就用了这唯一外链地址，另外我还想作个小测试，因为 Skydrive 的外链在某些网络下被墙的，比如在我学校的校园网内就无法看到在 Skydrive 上的外链图片，老七也是经常吼着看不到我的图，不知道现在换了新的不变的外链地址能不能看到这图呢？我明天去学校测试看看，也请大家帮忙测试啊，特别是七叔，能不能看到上面这张图？如果能看到的话就太好了，一下子解决了我两个问题。

　　参考自：http://rpsh.net/archives/get-direct-url-of-files-on-live-skydrive/

» 转载请注明来源：Life Studio » 《获取 Live Skydrive 的真实地址》

» 本文链接地址：http://wange.im/real-url-in-skydrive.html

» 订阅本站：http://feed.wange.im

PHP 实现的静态世界时钟功能

万戈 — Fri, 09 Jul 2010 12:19:24 +0000

　　昨天有个博友的网站上需要加上显示世界时钟的功能，于是向我求助，因为是用在 Wordpress 主题上的，所以要用 PHP 来实现，硬着头皮答应了下来。不过说实话，我的 PHP 水平还不如我的英语水平，就是只会看不会写的那种，Wordpress 主题以内的一些 PHP 函数我还算比较熟悉，但是 Wordpress 以外的 PHP 我就有些傻眼了，每次写 PHP 都是咬着笔头，翻着 PHP 手册，搜着 Google，挤牙膏一样才挤出那么一点东西。

　　关于这个世界时钟的功能，原理上是很简单的，只要设置一个基准的默认时间，然后把其他地区的时间加上时间差就可以了，但是用什么函数呢？翻呀翻，搜呀搜，终于被我搞定了，贴出来留个纪念。先看 DEMO～

　　以下是世界时钟完整的 PHP 代码：

//设置默认时区

date_default_timezone_set('Etc/GMT-8');

//当地时间，即北京时间

$localtime = date('Y-m-d H:i:s');

//伦敦时间

$london = date('Y-m-d H:i:s',strtotime("-8 hours $localtime"));

//柏林时间

$berlin = date('Y-m-d H:i:s',strtotime("-7 hours $localtime"));

//开罗时间

$cairo = date('Y-m-d H:i:s',strtotime("-6 hours $localtime"));

//莫斯科时间

$moscow = date('Y-m-d H:i:s',strtotime("-5 hours $localtime"));

//新德里时间

$newdelhi = date('Y-m-d H:i:s',strtotime("-3 hours $localtime"));

//曼谷时间

$bangkok = date('Y-m-d H:i:s',strtotime("-1 hours $localtime"));

//东京时间

$tokyo = date('Y-m-d H:i:s',strtotime("+1 hours $localtime"));

//悉尼时间

$sydney = date('Y-m-d H:i:s',strtotime("+2 hours $localtime"));

echo '伦敦时间：' . $london. '
';

echo '柏林时间：' . $berlin. '
';

echo '开罗时间：' . $cairo. '
';

echo '莫斯科时间：' . $moscow. '
';

echo '新德里时间：' . $newdelhi. '
';

echo '曼谷时间：' . $bangkok. '
';

echo '北京时间：' . $localtime. '
';

echo '东京时间：' . $tokyo. '
';

echo '悉尼时间：' . $sydney. '
';

?>

　　看代码还是很好理解的，但是却花了我近一个小时来研究时间函数，才写出这么几行。尤其是这个 date_default_timezone_set() 函数，刚开始我没有写这个函数，输出的时间和实际时间相差了8个小时，我想那一定是时区的问题了，一查果然如此。因为北京时间是东8区的，而从 php5.1.0 开始，php.ini 里加入了 date.timezone 这个选项，默认情况下关闭的，也就是显示的时间都是格林威治标准时间（GMT），这和我们的北京时间正好相差8小时。

　　这样就做好了，看着自己的成果，还算不错，哈哈～不过有些遗憾，这个 PHP 实现的时钟只是静态的，只有刷新页面才能更新时钟，如果可以动态实时的显示世界时钟的功能就更完美了，不过动态的应该需要 Javascript 脚本的配合使用吧，这个更高级了，我还不会。不知道有没有现成的世界时钟的 API 可以调用呢？这样也免去了自己写代码的麻烦。

　　今天算是小有收获，又学会了一个 PHP 函数，另外感谢所有向我提问的童鞋，是你们给了我一个折腾的目标。

» 转载请注明来源：Life Studio » 《PHP 实现的静态世界时钟功能》

» 本文链接地址：http://wange.im/world-clock-with-php.html

» 订阅本站：http://feed.wange.im

Life Studio » 电脑网络

美化 Feedburner 邮箱订阅

相关日志

Wordpress 向来自其他域的访客致欢迎词

相关日志

Jquery 实现 Wordpress 评论字数计数

相关日志

WordPress 显示访客最近评论次数

相关日志

Wordpress 站内搜索高亮显示关键词

相关日志

Wordpress 高亮显示关键词及欢迎提示

相关日志

一句话实现双击滚屏效果

相关日志

Wordpress 实现“您的足迹”功能

您的足迹

相关日志

获取 Live Skydrive 的真实地址

相关日志

PHP 实现的静态世界时钟功能

相关日志