浩子部落格 » WordPress http://haozer.com 为了逝去的纪念! Mon, 21 May 2012 12:11:08 +0000 en hourly 1 http://wordpress.org/?v=3.3.2 更改固定链接样式 http://haozer.com/permalink-redirect.html http://haozer.com/permalink-redirect.html#comments Sat, 30 Jul 2011 11:43:57 +0000 浩子 http://haozer.com/?p=194 以前博客刚转到 WordPress 的时候，就固定链接样式百度、谷歌，论坛搜索……看看哪种比较好，但是众说纷纭，萝卜白菜各有所爱。昨天我做了个艰难的决定，更改固定链接样式为：/%postname%.html，至于你信不信，我反正改了。

之所以说更改固定链接样式是个艰难的决定，因为更改后博客就会有很多的死链，轻则给博友造成访问404，重则导致搜索引擎K站（好怕怕~）。所以更改固定链接样式后的链接301重定向就格外重要了，可以写 .htaccess 来实现跳转。以前以为不可以，以为只能用插件解决！找了2个大家用的比较多的：

插播AD：
Ps.感谢翎峋大湿分享修改 .htaccess 来实现301跳转，参考：http://www.9mu.org/zhi/htaccess-301-rewrite.html

1、Permalink Redirect
官方地址：http://scott.yang.id.au/code/permalink-redirect/
功能貌似很强大，我只用了其中一个 Permalink Redirect，更多用法见说明，推荐使用。

2、Dean's Permalinks Migration
官方地址：http://www.deanlee.cn/wordpress/permalinks-migration-plugin/
就一个功能，对以前的固定链接形式做301跳转，但是我本地 WordPress 3.1.2和现在用的3.2.1版本均不能使用，不知道是主机问题还是 WordPress 程序不兼容的问题，囧。

坐等搜索引擎慢慢重新收录吧，悲催啊。

相关日志

]]> http://haozer.com/permalink-redirect.html/feed 70 WordPress wp_title 模版标签 http://haozer.com/wordpress-wp_title.html http://haozer.com/wordpress-wp_title.html#comments Wed, 15 Jun 2011 15:36:51 +0000 浩子 http://haozer.com/?p=190 一直以来，广大 WPer 都以 wordpress 强大模板引以为荣，选中自己喜欢的模板后，再进行微调至符合自己的口味。然后就是关注搜索引擎的收录，做相关的所谓 SEO 工作，比如优化标题、安装插件，但是有的模板默认的标题显示格式并不适合搜索引擎的口味，比如：博客标题》日志标题、所有分页页面标题都是博客标题、页面标题为博客标题》页面标题……这些都有个共同的特性就是博客标题显示在最前面，按照有些大湿的说法：重复标题是 SEO 大忌啊！有木有！

今天为大家介绍的就是 wp_title 模版标签，有很多的人都知道，但是未必有好多的人都用上了。自从 wordpress 重新默认 TwentyTen 主题开始到现在的 TwentyEleven 主题，因为均为官方开发的主题，因此很有指导学习意义。里面参考主题 header.php 文件 <title> 的写法，主题无论是首页博客标题，还是文章日志标题、页面标题都进行了优化，具体大家可以切换至默认主题围观。

1、WordPress 3.0版本后默认主题 <title> 的写法，请编辑模板 header.php 文件：

/* 用以下代码替换 header.php 文件 <title> */
<title><?php
    /*
     * Print the <title> tag based on what is being viewed.
     */
    global $page, $paged;

    wp_title( '|', true, 'right' );

    // Add the blog name.
    bloginfo( 'name' );

    // Add the blog description for the home/front page.
    $site_description = get_bloginfo( 'description', 'display' );
    if ( $site_description && ( is_home() || is_front_page() ) )
        echo " | $site_description";

    // Add a page number if necessary:
    if ( $paged >= 2 || $page >= 2 )
        echo ' | ' . sprintf( __( 'Page %s', '' ), max( $paged, $page ) );

    ?>
</title>

2、需要编辑模板 functions.php 文件的 <title> 的写法（实现效果和1效果一样）：

/* 用以下代码替换 header.php 文件 <title> */
<title><?php
    /*
     * Print the <title> tag based on what is being viewed.
     */
    global $page, $paged;

    wp_title( '|', true, 'right' );

    ?>
</title>

将以下代码丢入模板 functions.php 文件：

/* 将以下代码丢入 functions.php 文件 */
function mytheme_filter_wp_title( $title, $separator ) {
    // Don't affect wp_title() calls in feeds.
    if ( is_feed() )
        return $title;

    // The $paged global variable contains the page number of a listing of posts.
    // The $page global variable contains the page number of a single post that is paged.
    // We'll display whichever one applies, if we're not looking at the first page.
    global $paged, $page;

    if ( is_search() ) {
        // If we're a search, let's start over:
        $title = sprintf( __( 'Search results for %s', '' ), '"' . get_search_query() . '"' );
        // Add a page number if we're on page 2 or more:
        if ( $paged >= 2 )
            $title .= " $separator " . sprintf( __( 'Page %s', '' ), $paged );
        // Add the site name to the end:
        $title .= " $separator " . get_bloginfo( 'name', 'display' );
        // We're done. Let's send the new title back to wp_title():
        return $title;
    }

    // Otherwise, let's start by adding the site name to the end:
    $title .= get_bloginfo( 'name', 'display' );

    // If we have a site description and we're on the home/front page, add the description:
    $site_description = get_bloginfo( 'description', 'display' );
    if ( $site_description && ( is_home() || is_front_page() ) )
        $title .= " $separator " . $site_description;

    // Add a page number if necessary:
    if ( $paged >= 2 || $page >= 2 )
        $title .= " $separator " . sprintf( __( 'Page %s', '' ), max( $paged, $page ) );

    // Return the new title to wp_title():
    return $title;
}
add_filter( 'wp_title', 'mytheme_filter_wp_title', 10, 2 );

因为上述2种方法实现效果一样，所以本人强烈推荐用第1种方法优化标题。当然网上也有某人写了满满一页的代码就为优化博客标题显示，或许也有效果，但是代码也忒多了，我就不推荐了，有兴趣请 Google 然后自己试验。

相关日志

]]> http://haozer.com/wordpress-wp_title.html/feed 111 WordPress 插件 CodeColorer http://haozer.com/wordpress-plugins-codecolorer.html http://haozer.com/wordpress-plugins-codecolorer.html#comments Sat, 21 May 2011 06:28:49 +0000 浩子 http://haozer.com/?p=186 俗话说无折腾，无 WordPress，既然折腾就要有效果，有代码，有分享。众所周知，WordPress 后台编辑器不是很理想，插入的代码它会自动给格式化，非常影响代码的可读性，大家复制、粘贴的时候也不爽，有时候用默认的编辑器贴出来的代码，别人复制过去用的时候就给出错了，囧。今天就分享个 WordPress 插件 CodeColorer，当然好多高手都知道了，勿拍砖啊。

其实 WordPress 插件库中有很多 NB 的人开发了很多的代码高亮插件，但是其中绝大多数插件是用 <pre> 标签展示代码，这种情况要是哪天不用插件了，那些代码不是就给惨不忍睹啊，也有插件用的 <code> 标签来展示代码，但是当别人用其它阅读器浏览时无法实现高亮效果等。CodeColorer 插件就不会出现上面的问题，此插件可以用 [ cc] 标签，还可以用自带的 <code> 标签来展示代码，而且在阅读器中还可以实现高亮效果。

CodeColorer 安装及使用
1、下载和上传插件文件到 wp-content/plugins/codecolorer 目录下；
2、到插件管理面板启用 CodeColorer 插件；
3、在下拉菜单的 "设置"->"CodeColorer" 下面按照自行设置插件；
4、在撰写日志或页面时，请首先点击编辑框右上部的“HTML 源代码”按钮，切换到“HTML 源代码”模式，然后使用[ cc lang="lang"]code[ /cc]或者这样<code lang="lang">code</code>的语法在您的文章或者评论中插入源代码，您可以省略 lang="lang" 部分，这种情况下，代码会被包含在代码块中，并不进行语法高亮显示。

CodeColorer 代码示例

/**
 * Comment
 */
function hello() {
  echo "Hello!";
  return null;
}
exit();

CodeColorer 支持的语言
abap, actionscript, actionscript3, ada, apache, applescript, apt_sources, asm, asp, autoit, avisynth, bash, basic4gl, bf, bibtex, blitzbasic, bnf, boo, c, c_mac, caddcl, cadlisp, cfdg, cfm, cil, cmake, cobol, cpp-qt, cpp, csharp, css, d, dcs, delphi, diff, div, dos, dot, eiffel, email, erlang, fo, fortran, freebasic, genero, gettext, glsl, gml, gnuplot, groovy, haskell, hq9plus, html4strict, idl, ini, inno, intercal, io, java, java5, javascript, kixtart, klonec, klonecpp, latex, lisp, locobasic, lolcode, lotusformulas, lotusscript, lscript, lsl2, lua, m68k, make, matlab, mirc, modula3, mpasm, mxml, mysql, nsis, oberon2, objc, ocaml-brief, ocaml, oobas, oracle11, oracle8, pascal, per, perl, php-brief, php, pic16, pixelbender, plsql, povray, powershell, progress, prolog, properties, providex, python, qbasic, rails, rebol, reg, robots, ruby, sas, scala, scheme, scilab, sdlbasic, smalltalk, smarty, sql, tcl, teraterm, text, thinbasic, tsql, typoscript, vb, vbnet, verilog, vhdl, vim, visualfoxpro, visualprolog, whitespace, whois, winbatch, xml, xorg_conf, xpp, yaml, z80.

CodeColorer 插件下载地址：
1、http://kpumuk.info/projects/wordpress-plugins/codecolorer/
2、http://wordpress.org/extend/plugins/codecolorer/

Ps.开始想把 CodeColorer 提取出来，不安插件，直接调用里面的 Js、Css 文件，没想到要调用的太多了，而且效果不是很好，作罢！

相关日志

]]> http://haozer.com/wordpress-plugins-codecolorer.html/feed 59 非常实用的 jQuery 验证码 http://haozer.com/jquery-buttoncaptcha.html http://haozer.com/jquery-buttoncaptcha.html#comments Mon, 02 May 2011 09:07:46 +0000 浩子 http://haozer.com/?p=184 一直以来，WordPress Spam 问题愈来愈严重，即使有必装的 Akismet 插件，每个 WPer 还是会收到人或着 Robot 发的各式各样的垃圾广告。有人会安装各式的验证码插件来屏蔽垃圾，但我不喜欢插件，以前 WordPress 可以加点 算术代码 来防 Spam，现在版本升级越来越快，此方法早已行不通。

今天我向大家推荐的这款 jQuery 验证码，不仅仅 WordPress 可用，折腾折腾只要需要验证码的地方都可以安放。比如 WordPress 这样使用：
1、下载：jQuery.buttonCaptcha；
2、保存 jquery.buttonCaptcha.js，jquery.buttonCaptcha.styles.css 和 'images' 文件夹到 WordPress 主题某一路径下。记住，所有关于 buttonCaptcha 文件必须保存在同一目录，如果没有那么你就需要编辑 .css 文件；
3、将下面代码放到 <body> 里面：

/*如果没有 jQuery 文件请自行到官网下载*/
<script type="text/javascript" src="<?php bloginfo('template_url'); ?>/js/jquery-1.5.1.min.js"></script>
<script type="text/javascript" src="<?php bloginfo('template_url'); ?>/js/jquery-ui-1.8.12.custom.min.js"></script>
<link rel="stylesheet" type="text/css" href="<?php bloginfo('template_url'); ?>/js/buttonCaptcha/jquery.buttonCaptcha.styles.css" />
<script type="text/javascript" src="<?php bloginfo('template_url'); ?>/js/buttonCaptcha/jquery.buttonCaptcha.min.js"></script>
/*具体设置显示参数可以参考 jquery.buttonCaptcha.js 文件*/
<script type="text/javascript">
    $(function(){
        $("#submit").buttonCaptcha({ //#submit请修改为你评论提交按钮的ID
            codeWord:'H',
            codeZone:'aozer',
            captchaHeader:'你是 Robot 吗？// Are you a robot?',
            captchaTip:'拖动左边的字母到右边，直到出现 "%code_word%"。谢谢！<br>Drag letters from left to right, to get word "H". Thanks!',
            captchaUnlocked:'已解锁！// Unlocked!'
        });
    });
</script>

就这样，具体演示就看文章后面评论下面的验证码吧，再改改还可以用到其它地方哦！本验证码出自：buttonCaptcha

相关日志

]]> http://haozer.com/jquery-buttoncaptcha.html/feed 73 WordPress 随机文章按钮 http://haozer.com/wordpress-random-button.html http://haozer.com/wordpress-random-button.html#comments Sat, 23 Apr 2011 09:00:30 +0000 浩子 http://haozer.com/?p=183 谷歌首页的“手气不错”按钮很是不错，好多 WordPress 的站点也弄有随机文章的按钮。Google、Baidu下大家分享的按钮代码都会显示出随机文章的链接，这可没有带来“随机”的神秘感，试想别人根据链接地址随机的文章不喜欢怎么办，我要的效果是：只显示 /?random 这样永远不知道下一次点击你会穿越到那篇文章，嘿嘿，有木有神秘感！

WordPress 随机文章按钮（推荐）
使用 Random Redirect 插件，Description:Allows you to create a link to yourblog.example.com/?random which will redirect someone to a random post on your blog, in a StumbleUpon-like fashion. 因此你可以安装此插件后建立个链接就好，或者像我不太喜欢安装太多插件的话，就将下面代码扔到主题 functions.php 文件，再建立链接就OK！

/* 随机阅读浏览 */
function matt_random_redirect() {
    global $wpdb;
   
    $query = "SELECT ID FROM $wpdb->posts WHERE post_type = 'post' AND post_password = '' AND   post_status = 'publish' ORDER BY RAND() LIMIT 1";

    if ( isset( $_GET['random_cat_id'] ) ) {
        $random_cat_id = (int) $_GET['random_cat_id'];
        $query = "SELECT DISTINCT ID FROM $wpdb->posts AS p INNER JOIN $wpdb->term_relationships AS tr ON (p.ID = tr.object_id AND tr.term_taxonomy_id = $random_cat_id) INNER JOIN  $wpdb->term_taxonomy AS tt ON(tr.term_taxonomy_id = tt.term_taxonomy_id AND taxonomy = 'category') WHERE post_type = 'post' AND post_password = '' AND     post_status = 'publish' ORDER BY RAND() LIMIT 1";
    }

    if ( isset( $_GET['random_post_type'] ) ) {
        $post_type = preg_replace( '|[^a-z]|i', '', $_GET['random_post_type'] );
        $query = "SELECT ID FROM $wpdb->posts WHERE post_type = '$post_type' AND post_password = '' AND     post_status = 'publish' ORDER BY RAND() LIMIT 1";
    }

    $random_id = $wpdb->get_var( $query );

    wp_redirect( get_permalink( $random_id ) );
    exit;
}

if ( isset( $_GET['random'] ) )
    add_action( 'template_redirect', 'matt_random_redirect' );

WordPress 随机文章代码（带有链接地址）
使用 WordPress 默认函数 get_posts 中的 orderby=rand 属性来随机选取文章链接。

<?php $rand_post=get_posts('numberposts=1&orderby=rand'); foreach($rand_post as $post) : ?><a href="<?php the_permalink(); ?>">随机</a><?php endforeach; ?>

WordPress 调用多篇随机文章代码
随机选择 10 篇文章，列表样式可以根据需要自定义。

<?php $rand_post = get_posts('numberposts=10&orderby=rand');
foreach( $rand_post as $post ) : ?>
<li><a href="<?php the_permalink(); ?>" title="<?php the_title(); ?>"><?php the_title(); ?></a></li>
<?php endforeach; ?>

相关日志

]]> http://haozer.com/wordpress-random-button.html/feed 33 两种实现 WordPress 相关日志代码 http://haozer.com/wordpress-related-posts-code.html http://haozer.com/wordpress-related-posts-code.html#comments Wed, 17 Nov 2010 03:18:59 +0000 浩子 http://haozer.com/?p=177 曾经几何为了这个相关日志弄的我头的大了，如果说安装插件当然很容易就能实现，但是如果用代码来实现 WordPress 相关日志呢？网上也有很多的版本，什么文章关键词匹配、分类匹配、查询数据库的方式……插件和代码方式不外乎都是这几种方式来实现，对插件以及代码的使用后个人觉得还是代码方便，不想折腾的就安装插件吧。以下就分享下收集的代码版。

一、提取 WordPress Related Posts 插件代码（推荐）
此方法来自 Hacklog 可以去他那下载文件直接调用或者直接在主题 functions.php 文件中添加如下代码：

/* 相关日志 */
   $wp_rp=array(
    'limit'=>6, //显示几条相关文章
    'wp_rp_rss'=>true, //在rss feed 中显示相关文章
    'wp_no_rp'=>'random', //无相关文章时的选择：text 或random （random为显示随机文章)
    'wp_rp_date'=>false, //显示日志发布日期
    'wp_rp_comments'=>true, //显示日志评论数
    'wp_rp_title_tag'=>'h3',//相关日志标题标签(h2 ,h3 ,h4 ,p ,div)
    );
function wp_get_random_posts ($limitclause="") {
    global $wpdb, $post;
       
    $q = "SELECT ID, post_title, post_content,post_excerpt, post_date, comment_count FROM $wpdb->posts WHERE post_status = 'publish' AND post_type = 'post' AND ID != $post->ID ORDER BY RAND() $limitclause";
    return $wpdb->get_results($q);
}

    function wp_get_related_posts()
    {  
    global $wpdb, $post,$wp_rp;
    $limit =$wp_rp["limit"];
    $wp_rp_title='<I><B>相关日志</B></I>';  
    if(!$post->ID){return;}
    $now = current_time('mysql', 1);
    $tags = wp_get_post_tags($post->ID);
   
    $taglist = "'" . $tags[0]->term_id. "'";
   
    $tagcount = count($tags);
    if ($tagcount > 1) {
        for ($i = 1; $i < $tagcount; $i++) {
            $taglist = $taglist . ", '" . $tags[$i]->term_id . "'";
        }
    }
   
    if ($limit) {
        $limitclause = "LIMIT $limit";
    }   else {
        $limitclause = "LIMIT 10";
    }
   
    $q = "SELECT p.ID, p.post_title, p.post_content,p.post_excerpt, p.post_date,  p.comment_count, count(t_r.object_id) as cnt FROM $wpdb->term_taxonomy t_t, $wpdb->term_relationships t_r, $wpdb->posts p WHERE t_t.taxonomy ='post_tag' AND t_t.term_taxonomy_id = t_r.term_taxonomy_id AND t_r.object_id  = p.ID AND (t_t.term_id IN ($taglist)) AND p.ID != $post->ID AND p.post_status = 'publish' AND p.post_date_gmt < '$now' GROUP BY t_r.object_id ORDER BY cnt DESC, p.post_date_gmt DESC $limitclause;";
   
    $related_posts = $wpdb->get_results($q);
   
    $output = "";
    //不存在相关日志则显示随机日志
    if (!$related_posts)
    {
        if($wp_rp['wp_no_rp'] == "text")
        {
            $output  .= '<li>无相关日志</li>';
        }
        else
       
        {
            if($wp_rp['wp_no_rp'] == "random")
            {
            $wp_no_rp_text= '<I><B>随机日志</B></I>';
            $related_posts = wp_get_random_posts($limitclause);
            }  

            $wp_rp_title = $wp_no_rp_text;
        }
    }
   
    foreach ($related_posts as $related_post )
    {
        $output .= '<li>';
        if($wp_rp['wp_rp_date'])
        {
        $dateformat = get_option('date_format');
        $output .= mysql2date($dateformat, $related_post->post_date) . "  //  ";
        }
        $output .=  '<a rel="bookmark" href="'.get_permalink($related_post->ID).'" title="'.wptexturize($related_post->post_title).'">'.wptexturize($related_post->post_title).'</a>';
        if ($wp_rp["wp_rp_comments"])
        {
        $output .=  " (" . $related_post->comment_count . ")";
        }
    $output .=  '</li>';
    }
    $output = '<ul class="related_post">' . $output . '</ul>';
    $wp_rp_title_tag = $wp_rp["wp_rp_title_tag"];

        if(!$wp_rp_title_tag)
        $wp_rp_title_tag ='h3';
        if($wp_rp_title != '')
        $output =  '<'.$wp_rp_title_tag.'  class="related_post_title">'.$wp_rp_title .'</'.$wp_rp_title_tag.'>'. $output;
    return $output;
}

   
    function wp_related_posts_attach($content)
    {
       global $wp_rp;
          if (is_single()||(is_feed() && $wp_rp["wp_rp_rss"]))
          {
          $output = wp_get_related_posts();
          $content = $content . $output;
           }
   
    return $content;
    }

add_filter('the_content', 'wp_related_posts_attach',100);

之所以推荐此代码，因为它直接提取 WordPress Related Posts 插件核心代码，取其精髓而且能达到定制的功能，具体参见代码头部的设置选项。

二、网上搜罗的修改代码（据说出自Willin Kan）
直接将如下代码贴进主题 functions.php 文件中：

<h3>相關文章:</h3>
<ul>
<?php
$post_num = 5; // 數量設定.
global $post;
$tmp_post = $post;
$tags = ''; $i = 0; // 先取 tags 文章.
$exclude_id = $post->ID;
$posttags = get_the_tags();
if ( $posttags ) {
  foreach ( $posttags as $tag ) $tags .= $tag->name . ',';
  $tags = strtr(rtrim($tags, ','), ' ', '-');
  $myposts = get_posts('numberposts='.$post_num.'&tag='.$tags.'&exclude='.$exclude_id);
  foreach($myposts as $post) {
    setup_postdata($post);
    ?>
    <li>&#9829; <a href="<?php the_permalink(); ?>"><?php the_title(); ?></a> (<?php comments_number(); ?>)</li>
    <?php
    $exclude_id .= ','.$post->ID; $i ++;
  }
}
if ( $i < $post_num ) { // 當 tags 文章數量不足, 再取 category 補足.
  $post = $tmp_post; setup_postdata($post);
  $cats = ''; $post_num -= $i;
  foreach ( get_the_category() as $cat ) $cats .= $cat->cat_ID . ',';
  $cats = strtr(rtrim($cats, ','), ' ', '-');
  $myposts = get_posts('numberposts='.$post_num.'&category='.$cats.'&exclude='.$exclude_id);
  foreach($myposts as $post) {
    setup_postdata($post);
    ?>
    <li>&#9829; <a href="<?php the_permalink(); ?>"><?php the_title(); ?></a> (<?php comments_number(); ?>)</li>
    <?php
    $i ++;
  }
}
if ( $i == 0 ) echo '<li>尚無相關文章</li>';
$post = $tmp_post; setup_postdata($post);
?>
</ul>

当哪儿需要使用相关日志的时候，调用：

<?php if(function_exists('RelatedPosts')){RelatedPosts(5);} ?>

这种代码亦可设置显示多少相关日志以及设置显示输出的格式，但是相比我还是推荐第一种，因为第二种方法我试验后相关日志不够就会调用原文来充当相关日志，会出现重复；而使用第一种是不会出现这种情况的，而且相关日志不足不会重复显示原文，没有相关日志的时候可以自定义显示随机文章或者没有相关日志的文字，甚至自己折腾显示其他东东。

相关日志

]]> http://haozer.com/wordpress-related-posts-code.html/feed 23 用代码实现 WordPress 邮件表单 http://haozer.com/wordpress-email-form-code.html http://haozer.com/wordpress-email-form-code.html#comments Tue, 05 Oct 2010 05:33:29 +0000 浩子 http://haozer.com/?p=172 在博客2岁了里曾说过浩子部落格添加了邮件发送表单，今天把添加方法贴出来，或许对于有的博主来说会有用吧。添加到邮件联系表单的好处不言而喻，不用再像以前那样建立单独页面然后以评论方式来联系，评论多了就不好处理了而且别人通过邮件联系你可以直接通过邮件回复。当然也有人会选择插件来生成邮件表单~额~这个嘛，因为我个人不想为了一个页面就安装个插件，那不是大材小用么。

注意我介绍的此邮件表单代码只适用于 WordPress 程序，当然你可以参考修改代码使用到其它地方。添加步骤：
1、下载文件包：WordPress 邮件表单，解压将里面的 contact.php、sendemail.php、yz_img.php 放到正在使用的主题文件夹；
2、后台建立一页面，模板选择：联系(Contact)即 contact.php 文件；
3、自己修改美化，测试收工。

本博的效果请参见：关于页面。如果有什么交流的欢迎五湖四海的朋友来信来函~~~
Ps.由于 wordpress 后台贴代码操作不便，原本准备贴出代码来，未遂。请需要的朋友自己下载后研究吧！

相关日志

]]> http://haozer.com/wordpress-email-form-code.html/feed 23 博客2岁了 http://haozer.com/blog-two-years-old.html http://haozer.com/blog-two-years-old.html#comments Mon, 04 Oct 2010 11:39:38 +0000 浩子 http://haozer.com/?p=171 时间过的可真快啊，一晃就2年过去了。自己都觉得难得啊，期间虽说不像有的博主那样轰轰烈烈人气相当旺，也不像有的博主开了几个月就给关闭了……浩子平平淡淡的坚持下来了，翻翻回头的这些日志差不多都是生活的记录，或许就是浩子部落格所描述的那样为了逝去的纪念！

今天就算是为了纪念写的这篇日志吧，人们过生日都要庆祝下，博客满岁当然也得纪念下了。国庆这些天没怎么出去玩，但不像以前那些国庆长假感觉无聊、无趣、无意义，这段时间发生的事多少思考了点，纠结过、抱怨过、气馁过……想罢国庆后将会是个全新的开始，或许！一定！利用这些天的时间把博客给折腾了下下，用代码加上了邮件发送表单、鼠标悬浮显示 @ 评论、日志分页导航、日志底部加上了文章信息，还有主题其它方面一些小改动。

不用插件实现wordpress邮件表单
参考 PhilNa 修改实现，围观请点击顶部导航栏关于页面。老早就想添加个邮件发送表单来代替留言本，但是一直都苦于不想为了一个页面就安装个插件，网上搜索的代码都不能用，找到 PhilNa 的这篇文章后才开始按照他所说的弄却没给鼓捣成功，作罢。这些天下载了他的主题研究下才给折腾出来，热烈欢迎各位通过此邮件表单联系我。

鼠标悬浮显示 @ 评论
这个没什么好多说的，具体参考 NeoEase 实现，自己再把 css 修改下就搞定，添加此效果一是为了好看，二嘛就是能方便的看到回复的是哪条评论。

另外日志分页导航参考(木木木木木)、日志底部加上了文章信息参考(万戈)分别实现，这些就权当这些天折腾的记录，方便日后查阅！国庆快过一半了，祝各位接下来的节日继续玩的┢┦aΡｐy，顺祝浩子部落格生日快乐！

相关日志

]]> http://haozer.com/blog-two-years-old.html/feed 23 用代码实现WordPress Lightbox特效 http://haozer.com/wordpress-lightbox-code.html http://haozer.com/wordpress-lightbox-code.html#comments Mon, 27 Sep 2010 03:12:22 +0000 浩子 http://haozer.com/?p=168 如果你用 WordPress 搭建的是图片博客，那么如何才能让访客面对繁多的图片有个良好的体验呢？或许你会选择插件来展示图片，亦是其它的什么 jQuery 特效。比如：jQuery Lightbox Plugin、Fancybox、Shadowbox、ThickBox、Slightly Thickerbox、Fancy Zoom、Facebox、nyroModal、Interface Imagebox Demo、piroBox、Greybox Redux、prettyPhoto……

虽然我的博客图片很少（少的可怜⊙﹏⊙b）再者我又不喜欢为了几张图片安装个插件，所以就用代码东拼西凑弄个 LightBox 特效来玩玩，当然觉得安装插件好的童鞋那请自便了。试过网上好多推荐的那些插件，都觉得大材小用了。去看了上面所说的那些效果很炫很漂亮，但还是觉得 Lightbox 很中意，而且相对来说比较小折腾起来也容易。

一、下载：jQuery Lightbox Plugin
解压缩后取其中的：jquery.lightbox-0.5.js、jquery.js、jquery.lightbox-0.5.css、 lightbox-blank.gif、lightbox-ico-loading.gif、lightbox-btn-close.gif、 lightbox-btn-prev.gif、lightbox-btn-next.gif，这些文件归类放到 WordPress 主题文件夹中。

二、加载 jQuery 库（如果网站已有无视这一步骤）
可以选择使用 Google jQuery 库(推荐)：

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>

或者使用本身自带的 jQuery 文件：

<script type="text/javascript" src="<?php bloginfo('template_url'); ?>/js/jquery-1.5.1.min.js"></script>

三、添加 Lightbox 文件
在顶部 (header.php)中添加：

<link rel="stylesheet" type="text/css" href="<?php bloginfo( 'template_url' ); ?>/js/jquery.lightbox-0.5.css" media="screen" />
<script type="text/javascript" src="<?php bloginfo( 'template_url' ); ?>/js/jquery.lightbox-0.5.js"></script>
<script type="text/javascript">
    $(function() {
        $(".post a:has(img)").lightBox({
        imageBlank:"<?php bloginfo( 'template_url' ); ?>/images/lightbox-blank.gif",
        imageLoading:"<?php bloginfo( 'template_url' ); ?>/images/lightbox-ico-loading.gif",
        imageBtnClose:"<?php bloginfo( 'template_url' ); ?>/images/lightbox-btn-close.gif",
        imageBtnPrev:"<?php bloginfo( 'template_url' ); ?>/images/lightbox-btn-prev.gif",
        imageBtnNext:"<?php bloginfo( 'template_url' ); ?>/images/lightbox-btn-next.gif"    //这里注意一定不要再加“ , ”号了在 IE6 下会报错；
        });
    });
</script>

这些文件中的路径随文件位置而参考。

OK，如果你点击上面这张图片可以显示而且不是在新窗口打开就说明成功了！
Ps.第一段中的那些有很多炫丽的 jQuery 特效，有空继续用代码折腾看看……

相关日志

]]> http://haozer.com/wordpress-lightbox-code.html/feed 19 WordPress升级到3后的那点破事 http://haozer.com/upgrade-wordpress-3.html http://haozer.com/upgrade-wordpress-3.html#comments Mon, 16 Aug 2010 10:01:08 +0000 浩子 http://haozer.com/?p=164 2010年8月14日wordpress中文站“官方”终于更新了，发现后果断从后台升级更新至3.0.1，升级后一下舒坦了觉得心里一块石头放下去了。我偷偷的乐~~~真不是我说的，这CN.WordPress.ORG的速度那真是蜗牛般，差不多都快等到花儿都谢了，瞧！别人用英文版+民间语言包的早就体验上了，囧。

后台升级唯一怕的就是中途断了，如果没有备份数据那就糟了。14号晚上升级的时候我就属于那个如果，不过幸好升级平稳进行，一步到位。前段时间看到wordpress3刚刚发布出来的时候那个默认主题简洁明了！So，接下来就是断断续续的折腾这个TwentyTen主题了，如果盆友们还有什么意见请提出来哦~~~

另外升级到wordpress3后有些文件改了，2.9.2版本以前的禁用自动保存的方法已经不再合适了，Goolge了下找到了wordpress3的禁用自动保存程序修改版。下面就分享下：WordPress 3.0 禁止修订版本、草稿自动保存且序号连续的方法。
一、在 wp-config.php 中添加以下代码：

define('WP_POST_REVISIONS', false);
define('AUTOSAVE_INTERVAL', false);

二、在 wp-admin\post-new.php 和 wp-admin\post.php 的两个文件中：
删除（注释）掉

//wp_enqueue_script('autosave');

三、找到 wp-admin\includes\post.php 这个文件，这一步很关键：
在

$create_in_db = false;

上面添加

if ( $create_in_db ) {

OK，就这样解决了wordpress个人认为比较烦人的自动保存功能，当然或许你不这样认为。那又怎么样呢……

相关日志

]]> http://haozer.com/upgrade-wordpress-3.html/feed 60