先来看下改造前和改造后的代码吧:

1. pre标签被两层div嵌套，代码冗余
2. pre标签内被硬植入字族的inline stylesheet，覆盖了我的CSS设置
3. 插件自带的CSS文件重置了我的CSS设置
4. 自动转义<, >, &这类代码，问题是稍有经验的coder都会事先自己主动转义过的，所以之前已经转义过了的代码反而会以<, >, &这类形式输出

首先改造代码嵌套的问题

找到插件目录下的wp-syntax.php文件，搜索wp_syntax_highlight函数，将以下几行注释掉(注释行前加了//符号):

function wp_syntax_highlight($match)
{
    global $wp_syntax_matches;
    ......
    if ($escaped != "false") $code = htmlspecialchars_decode($code);

    $geshi = new GeSHi($code, $language);
    $geshi->enable_keyword_links(false);
    do_action_ref_array('wp_syntax_init_geshi', array(&$geshi));

    //$output = "\n<div class=\"wp_syntax\">";

    if ($line)
    {
    ......
    }
    else
    {
	//$output .= "<div class=\"code\">";
        $output .= $geshi->parse_code();
	//$output .= "</div>";
    }
	//return

	//$output .= "</div>\n";

    return $output;
}

转义问题

还是wp_syntax_highlight函数，将这句:

if ($escaped == "true") $code = htmlspecialchars_decode($code);

替换成

if ($escaped != "false") $code = htmlspecialchars_decode($code);

就是了，也就是说除非手动在<pre>里加入escaped="false"参数，输出的代码是不会自动转义的。

硬植入CSS问题

由于WP-Syntax可以方便的调用wp_syntax_init_geshi来修改geshi的初始设置，解决CSS问题可以不需要修改WP-Syntax本身的插件代码，全部在主题文件夹下的functions.php里就可以搞定了。

首先解决往pre里插入字族设置的问题，在functions.php里加入一函数:

function my_custom_geshi_styles(&$geshi) {
    $geshi->set_overall_style('');
    $geshi->set_code_style('');
};

它会把geshi预设的inline stylesheet全部清除为空，然后再利用Wordpress的add_action hook重新初始化geshi的设置，在functions.php里加入这句:

add_action('wp_syntax_init_geshi', 'my_custom_geshi_styles');

至于去掉WP-Syntax自带的CSS文件就更简单了，还是往functions.php里添加一句remove_action的hook就是了:

remove_action('wp_head', 'wp_syntax_head');

其实WP-PageNavi带的那两三行代码的CSS文件也可以这么干掉:

remove_action('wp_head', 'pagenavi_css');

小结

其实Wordpress主题文件夹下的functions.php文件是相当有用的，利用Wordpress本身提供的Plugin API, 很多东西都可以直接在functions.php下直接用一个函数挂上action或者filter的钩子就搞定了。

Douban and PHP

按照之前QQ签名秀的原理把豆瓣的个人广播系统也给提取出来了，效果请见此test页面。

使用方法是把以下代码添加到你的页面里:

<script type="text/javascript" src="http://punkid.org/glade/douban/request.php?userid=username&numbers=5"></script>

其中userid后面跟的是你的豆瓣用户名，numbers后面是显示条目数(最多10条)。至于怎么polish这个douban的miniblog纯粹是你的CSS活。对了，输出编码是UTF-8。

PHP tips: 用addslashes这个函数可以对字符串进行转义。

Linux

1. Tired of emerging the world?

emerge $(eix -Iuc --format-compact "<category>/<name>" dev-libs/* | head -n -1)

可以用来更新某一category(例如dev-libs)下的已安装软件。

2. Ape转mp3

emerge shntools 和 mac-port (gentoo-china overlay提供) 后运行:

shnsplit -f filename.cue -t "%n - %t" -o "cust ext=mp3 lame --preset extreme - %f" filename.ape

会根据cue文件对ape进行切割成按tracknumber - trackname命名的mp3文件，不过ID3信息没法保存进去，交给Musicbrainz搞定吧。

3. 使用Aria2下载器

原来用的axel不知何故在我的电脑上经常出现Initialing download就停滞不前的情况，无奈…换了个稍微大点的Aria2。顺便把Gentoo Mirror的默认下载也换成了aria2。更改make.conf如下:

FETCHCOMMAND="/usr/bin/aria2c -c -s 4 -d ${DISTDIR} -o ${FILE} ${URI}"
RESUMECOMMAND="${FETCHCOMMAND}"

至于在firefox里用flashgot启用aria2下载，在Executable path里填/usr/bin/rxvt (任意虚拟终端，别用xterm就是了，那个启动太慢了)，然后在Command line arguments template里填-e aria2c -s 5 -d [FOLDER] [URL]

WordPress

1. 只显示当日评论数

不明白我的意思的，留个言在到首页看下就知道了，当日有留言的日志会格外用类似于3 comments today方式显示。方法很简单，抽数据而已。修改你的模板的index.php，再最顶端添加:

<?php
	$nowtime = current_time('timestamp');
	$today = date('Y-m-d G:i:s', mktime(0, 0, 0, date('m',$nowtime), date('d',$nowtime), date('Y',$nowtime)));
?>

然后是修改loop部分:

<?php if (have_posts()) : ?>
	<?php while (have_posts()) : the_post(); ?>

		<?php $today_comments = $wpdb->get_var("SELECT COUNT(*) FROM $wpdb->comments WHERE comment_post_ID = $id AND comment_date >= '$today' AND comment_approved = '1'"); ?>
		<div class="entry"
		<h2 id="post-<?php the_ID(); ?>" class="entrytitle"><a href="<?php the_permalink() ?>" rel="bookmark" title="Permanent Link to <?php the_title(); ?>"><?php the_title(); ?></a></h2>
		<p class="metadata clearfix">
		<span class="cmt"><?php if ($today_comments > 0) { ?><a class="todaycmt" href="<?php the_permalink() ?>#comments" title="Comment on <?php the_title(); ?>"><?php echo $today_comments; ?> Comment<?php if ($today_comments>1) echo 's'; ?> Today</a><?php } else { ?><?php comments_popup_link('No Comments', '1 Comment', '% Comments'); ?><?php } ?></span>
		</p>
		...
		</div>

		<?php } ?>

		...

<?php endif; ?>

加重部分是关键。

2. 过滤某category的feed输出

在模板的function.php里添加这段代码:

<?php
function RssFilter($query) {
     if ($query->is_feed) {
         $query->set('cat','-22');
     }
         return $query;
}

add_filter('pre_get_posts','RssFilter');
?>

其中22为你的category ID。

CSS

CSS的代码书写风格我倾向于单行式，用缩进表明元素的从属关系。例如:

#secondary div.modules {margin-bottom:40px;}
	#secondary div.modules a {color:#888;}
	#secondary div.modules a:hover {color:#FF32B3;text-decoration:underline;}
	#secondary div.modules h3 {color:#94C742;border-bottom:1px dotted #94C742;}
	#secondary div.modules ul li {padding:3px 8px;border-bottom:1px dashed #FF80D0;}
	#secondary div.modules ul li:hover {background:#F0F8E2;}

#bottom_wrapper h3 {color:#FDF262;border-bottom:1px solid #FDF262;}
	#bottom_wrapper div.modules {width:300px;margin:0 10px;float:left;position:relative;display:inline;}
	#bottom_wrapper div.modules ul li {height:1.6em;padding:3px 2px;border-bottom:1px dotted #528F08;overflow:hidden;}
	#bottom_wrapper div.modules ul li:hover {background:#528F08;}
	#bottom_wrapper div#misc table.calendar {width:300px;margin-bottom:20px;border-collapse:separate;border-spacing:1px;}
		table.calendar td {padding:3px 0 2px;text-align:center;}
		table.calendar td.calendar_h {display:none;}
		table.calendar td.today {background:#528F08;}
		table.calendar td.week {background:#528F08;color:#FDF262;}
	#bottom_wrapper div#tags ul li {margin-right:5px;padding:0;display:inline;border:0;}
		#bottom_wrapper div#tags ul li span, #bottom_wrapper div#tags div {display:none;}

也许这种单行的方式不利于阅读，但是类似block的书写方式最大的问题是一旦CSS代码上个几百行的，要找到某一行翻页是件很痛苦的事，而单行定义加上适当的缩进即便不看HTML源代码也能对页面结构有个基本的认识。还有就是…在VIM下用w,b进行整词跳跃是件很惬意的事，即便是单行也能很快的跳跃到需要修改查看的property。

English

1. take with a pinch of salt

Radiohead的A Wolf at the Door里有句歌词是Take it with the love its given, take it with a pinch of salt, take it to the taxman。

那take it with a pinch of salt真的是抓把盐吗? 真实的意思有点类似于姑且相信，半信半疑的意思，例如Regarding what you said yesterday, I would take it with a pinch of salt意思就是你昨天说的那些我姑且相信吧。

Tia Dalma and I go way back

在电影Pirates of the Carribean : The Man’s Chest (加勒比海盗2:聚魂棺)，Jack船长带着众人去找女巫Tia Dalma时说: No worries, mates. Tia Dalma and I go way back.。我记得当时我看的思路的版本翻译成了伙计们，别担心，Tia Dalma和我待会就回来。这其实是错误的，go back way的意思是表示两人认识很久了，交情很好。

糟糕的Tag体验

WP提供了原生的tag支持，不过这个the_tags()函数实在是有够弱的，一是它必须是strictly in the loop，而我的模板single page里的metadata都是显示在sidebar中的，the_category()，the_time()都能工作的很好，就the_tags()显示为空。我又不想把tag放到日志的loop里，最后只能在sidebar里做个rewind操作了，代码如下:

<?php if(is_single()) { ?>
<?php rewind_posts(); ?>
<?php while(have_posts()): the_post(); ?>
<h2 id="metadata">Metadata</h2>
<dl>
<dt>Metadata</dt>
<dd class="date" title="postdate"><?php the_time('Y.n.j') ?> / <?php the_time('ga') ?></dd>
<dd class="category" title="category"><?php the_category(', ') ?></dd>
<dd class="tag" title="tag"><?php the_tags('',', ','') ?></dd>
<?php endwhile; ?>
<?php } ?>

原本在UTW下，对于没有tag的日志可以指定相应的tag替代文字，例如”No Tag”，但是在WP里，the_tags()弱到没有tag也输出个null值来。我自然是希望在没有赋予日志tag的情况下，tag栏里显示”No Tag”信息啦。看了下wordpress wp-includes目录下的category-template.php文件里get_the_tags()函数，其中有这么一段:

if ( empty( $tags ) )
	return false;
return $tags;

get_the_tags()函数在没有找到tag的情况下会返回为false值。我把the_tags()的调用改成了以下这句，这样就能在没有tag的情况下显示”No Tag”了:

<?php if(!(get_the_tags())) echo 'No Tag'; else the_tags('',', ',''); ?>

删除UTW

用WP2.3导入了UTW的tag之后，就可以把UTW彻底移出了，UTW在数据库里添加了wp_post2tag, wp_tag_synonyms, wp_tags 这三个表，在mysql里用以下命令直接删除吧(建议先备份数据库):

mysql> DROP TABLE wp_post2tag,wp_tag_synonyms,wp_tags;

插件相关

不喜欢WP-PageNavi新版自作多情添加CSS样式文件，我的CSS文件都是用gzip压缩过的了，再说我更愿意自己定义WP-PageNavi的样式。编辑pagenavi.php文件，注释掉以下这段就是了:

### Function: Page Navigation CSS
#add_action('wp_head', 'pagenavi_css');
#function pagenavi_css() {
#       echo "\n".'<!-- Start Of Script Generated By WP-PageNavi 2.20 -->'."\n";
#       echo '<link rel="stylesheet" href="'.get_option('siteurl').'/wp-content/plugi
ns/pagenavi/pagenavi-css.css" type="text/css" media="screen" />'."\n";
#       echo '<!-- End Of Script Generated By WP-PageNavi 2.20 -->'."\n";
#}

Tiger Style Administration是个很漂亮的WP后台主题，不过在2.3下显示似乎有点问题，最明显的就是footer位置偏了。我稍微修改了下它的css文件，喜欢这个插件的又想在2.3下正常使用的直接下载我修改过的CSS文件吧。

QQ签名秀网站 : http://punkid.org/qqsign/

功能/Features

• 只需要简单的插入一行代码就能实现QQ签名的输出，而此过程的实现不需要你的主机支持php，也无须对XHTML有太多了解，一切我都替你完成了
• 支持UTF-8和GB18030两种编码输出
• 可定义显示最近QQ签名的条目数
• 发表时间显示为更人性化的”XX月XX天XX小时前”
• 可以通过CSS改变输出样式
• 可通过前台页面生成你需要的脚本代码，无须手动配置
• 前台页面配合预览功能，以验证输出的正确与完整

FAQ/疑问解答

• 为保证顺利抓取到你的”心路历程”xml文件，请确保你开启了QQ空间功能，并没有设置访问密码；与此同时，你还需要在Q-zone下设置把最新签名添加到”心路历程”下
• UTF-8/GB18030该选择哪个编码呢? 国内很多网站都还在使用GB(GB2312,GBK,GB18030)码，而时下的趋势是使用UTF-8码，用什么编码取决于你的页面编码。例如blogbus用的就是UTF-8码。
• 显示条目数究竟能设置多大值? 因为QQ的xml文件并没有一次性输出所有历史签名，所以条目数不宜设置过大。当然，即使你设置值已经超过了最大实际值也不要紧，程序最自动输出到最大实际值后停止的

程序实现过程

这个程序的原理很简单，读取Q-zone里的”心路历程”的XML文件，经过数据处理后再输出为javascript形式。写这个程序遇到了四个困难:

1. Q-zone的代码实在太乱太dirty了，腾讯又没有官方明确申明有RSS，而Q-zone又没法在非IE浏览器下浏览，我没办法使用FF下的firebug来inspect它的XML文件，最后通过从IE临时文件中找到js文件，把xml文件地址给揪了出来
2. 我本打算采用php的SimpleXML/DomDocument直接读取QQ的XML文件，但是DH主机不支持URL-file-access mode，不得不放弃了这种最简单的方法，好在我曾经在给自己的blog写个wordpress插件时发现可以用MagpieRSS来读取XML文件，并最终通过MagpieRSS实现了成功读取
3. 第三个困难是编码问题，QQ的xml输出的编码是GB2312，在我用MagpieRSS之前我曾考虑过用curl下载XML文件并储存为字符型数据，结果curl把GB码的汉字全丢掉了，更糟糕的是，我测试用的几个朋友的QQ签名里因为各式各样的非汉字/非英文特殊文字弄得读取出错，换成MagpieRSS后，发现指定输出编码的话也会出这样的问题，最终的办法是使用早先的MagpieRSS版本，不指定输出编码，直接读取XML数据储存为数组
4. 最后一个问题是怎么把php执行的结果由javascript方式输出，研究了下livid的project babel程序ing模块代码，通过直接在php里写入javascript的document.write格式输出搞定了。

最后，特别感谢Druggo和我熬夜奋斗啊，很多东西都是他帮忙想辙的! And dont forget to send some feedbacks to me if you have some better ideas or suggestion.

我利用的是php方式来实现获取图片功能，代码如下 (其实我还是个php beginner，获取文件的代码是google来的)

<?php
function get_feedburner($url) {

        //Initiate the curl //
	$ch = curl_init();

	//Set the curl option//
	curl_setopt ($ch, CURLOPT_URL, $url);
	curl_setopt ($ch, CURLOPT_HEADER, 0);

	ob_start();

        //Lets get the file//
	curl_exec ($ch);
	curl_close ($ch);

        //Retrieve the file got from the remote url//
	$string = ob_get_contents();
	ob_end_clean();
	return $string;
}

$content = get_feedburner("http://feeds.feedburner.com/~fc/punkid?bg=BCF16C&fg=404040&anim=0");
$fp=fopen("feedburner.jpg", "w");
fwrite($fp, $content);
fclose($fp);
?>

保存代码到get_feedburner.php文件中，其中get_feedburner()中的地址是你的feedburner计数器图片地址，而fopen()里是你将要保存到远程主机的图片名。想知道这个script到底有用不? ssh到远程主机执行php get_feedburner.php，然后用浏览器查看下保存的图片地址就知道了。

然后我们要做的是让这个script每天执行一次 (feedburner每天更新一次计数器数据)，ssh到远程主机运行crontab -e，添加如下一行:

01 9 * * * /usr/local/bin/php home/path/get_feedburner.php #请替换为你的get_feedburner.php保存地址。

这个cron job指示远程主机在每天9点01分时运行一次该script。为什么是9点捏? 我用的DH主机和我们这时差15个小时!

最后你要做的就是更改feedburner的计数器图片地址为你的主机上的图片地址吧。

1. Gentoo 使用笔记 Part 1
2. Gentoo 使用笔记 Part 2
3. Gentoo 使用笔记 Part 3

在Gentoo下打造LAMPP

最终还是选择了自己编译LAMPP平台，放弃了已整合好的XAMPP For Linux，执行效率和启动速度有了很大的提高。

安装LAMPP

添加以下use到 /etc/portage/package.use 中

net-www/apache apache2
dev-lang/php apache2 bzip2 gd mysql xml xmlrpc zip ctype pcre session unicode
#其中php里的有些use不一定是必须的，不过这些use基本上都是常用的或是将来可能会用到的

编译apache和mysql

# emerge apache mysql

在编译php前先修改下/etc/conf.d/apache2，加入php5的模块选项

APACHE2_OPTS="-D DEFAULT_VHOST -D PHP5"

然后编译php和phpmyadmin吧

# emerge dev-lang/php phpmyadmin

设置LAMPP

Gentoo下的Apache已经设置的很好了，基本上无须修改就能使用了。

在使用MySQL前还需要进行初始化设置，执行#emerge --config mysql进行设置，然后启动MySQL，进行安全设置:

# /etc/init.d/mysql start
# mysql_secure_installation

设置phpMyAdmin:

# mysql -u root -p< /usr/share/webapps/phpmyadmin/2.10.0.2/sqlscripts/mysql/2.10.0.2_create.sql
# mkdir /var/www/localhost/htdocs/phpmyadmin/config
# chmod o+rw /var/www/localhost/htdocs/phpmyadmin/config
# cp /var/www/localhost/htdocs/phpmyadmin/config.sample.inc.php /var/www/localhost/htdocs/phpmyadmin/config/config.inc.php
# chown -R apache:apache /var/www/localhost/htdocs/phpmyadmin/config

OK,启动Apache和MySQL试试看，看看能不能进入phpMyAdmin进行数据库操作，你也可以建立一个内容为<?php phpinfo() ?>的php文件来查看apache是否正常启用了php。

小技巧

我实在不喜欢那个/var/www/localhost/htdocs的目录，操作起来太不方便，我也不愿意去修改httpd.conf文件。我的做法是在/home目录下新建个web文件夹，设置owner为自己的普通日常用户，然后做个链接到htdocs目录里就是了。

# mkdir /home/web
# chown -R punkid:apache /home/web
/*我选择把wordpress什么的都放到这个web目录下了，并设置所有者为apache组和个人用户*/
# chmod ug+rw -R /home/web
/*给予apache组和个人用户读写权限*/

然后切换到htdocs文件夹下做几个链接进来吧

# cd /var/www/localhost/htdocs
# ln -sf /home/web/wordpress wp
# ln -sf /home/web/drupal drupal

这样我输入http://localhost/wp时就可以访问/home/web/wordpress下的wp blog了，同理http://localhost/drupal则进入了/home/web/drupal的目录操作

顺带把win下的几个音乐，电影资源文件夹也链接进来以便给我的朋友们下载

# ln -sf /mnt/win_f/Audio Audio
# ln -sf /mnt/win_f/Movie Movie

如果你不想别人从外部访问的话，在你不希望别人访问的文件夹下建立个.htaccess的隐藏文件，输入以下内容:

Order deny,allow
Deny from all
Allow from 127.0.0.1

如果你不愿意把apache和MySQL都加入开机启动程序，而又嫌分别输入/etc/init.d/apache start和 /etc/init.d/mysql start麻烦的话，可以在/etc/init.d/下建立一个lampp启动脚本。你在该目录下输入vi lampp会自动帮你填补好脚本框架的，我的脚本是这样的(有点粗糙，不过能用:D )

#!/sbin/runscript
# Copyright 1999-2007 Gentoo Foundation
# Distributed under the terms of the GNU General Public License v2
# $Header: $

depend() {
    need net
}

svc_start() {
    ebegin "Starting LAMPP"
    /etc/init.d/apache2 start && /etc/init.d/mysql start
    eend ${?} "Failed to start LAMPP"
}

svc_stop() {
    ebegin "Stopping LAMPP"
    /etc/init.d/apache2 stop && /etc/init.d/mysql stop
    eend ${?} "Failed to stop LAMPP"
}

svc_restart() {
    ebegin "Restarting LAMPP"
    /etc/init.d/apache2 restart && /etc/init.d/mysql restart
    eend ${?} "Failed to restart LAMPP"
}

执行/etc/init.d/lampp start,/etc/init.d/lampp stop,/etc/init.d/lampp restart即可启用，停用以及重新启动apache和MySQL。

另外，我自己用python写了个小程序，用来监视apache的访问记录的。你可以copy以下代码到任意.py文件中，加入执行权限( chmod +x logmonitor.py )就可以运行了

#!/usr/bin/python
import os,time

today = time.strftime('%d/%b/%Y') #specify the date format
log_path = '/usr/lib/apache2/logs/access_log' #如果你更改了apache log存放路径设置的话，请更改此处地址
logline = os.popen("cat %s | grep '%s' | wc -l" %(log_path,today)).read()
showlog = "tail -f -n 20 %s | grep '%s'" %(log_path,today)

if logline.startswith('0'):
   print 'no activies recently' #如果当天没有活动记录，则不显示
else:
   os.system(showlog)

实现方法之Javascript篇

假设我们有个id名为 list 的无序列表ul，其下有5项item (li)。我们可以用getElementById和getElementsByTagName先找到这些item，然后通过for循环筛选出奇数项并赋予class值。再通过CSS定义该奇数项class样式从而达到交替样式的目的。javascript代码如下:

 function alterItem() {
 var list=document.getElementById('list');
 var items=list.getElementsByTagName('li');
 for (var i=0;i<items.length;i++) {
   if(i%2==0)
   items[i].className='odd';
   }
 }

 window.onload=alterItem;

最后用通过CSS定义 .odd样式就行了。

实现方法之PHP篇

此方法来源于WordPress论坛的这篇日志。我曾经在PP的sidenotes部分就是用这种方法实现交替背景的(WP的comment部分已经有oddcomment函数了，无须再费周折)，我直接照搬原来PP theme里的sidenotes部分代码。

<?php query_posts('category_name=sidenotes&showposts=3'); ?>
     <?php while (have_posts()) : the_post(); ?>
     <div id="p<?php the_ID(); ?>" class="<?=($i%2)?"even":"odd";$i++;?>">
     <a href="<?php the_permalink() ?>" rel="bookmark" title="Permanent Link to <?php strip_tags(the_title()); ?>" class="title"><?php the_title(); ?></a>
     <?php the_content(); ?>
     </div>
<?php endwhile;>

注意其中加粗部分，先在模板文件顶部插入如下代码<?$i;?>，然后在class里加入这句判断语句就够了<?=($i%2)?"even":"odd";$i++;?>。学过C语言的都知道这是个if..else判断语句的缩写形式– If (Expression) ? true : false，如果满足表达式，则执行? 部分，否则执行 : 部分。也就是说，满足 $i%2等于0，即$i为偶，则赋予class为even值，然后$i 加一，滚动到下一item上进行第二次判断。

实现方法之CSS篇

CSS2有个:nth-child的选择器，这是个非常非常强大的选择器，你可以定义Element:nth-child(3)来找到为其父元素下的第三个子元素，你也可以定义Element:nth-child(odd) 或者Element:nth-child(even) 来查找其父元素下的奇偶子元素，甚至可以用Element:nth-child(3n+2) 来找到其父元素下的第3n+2个元素( n=0,1,2…)。通过CSS方法定义那太简单了!

ul#list li:nth-child(odd) {background:#000;color:#fff}

ul#list li:nth-child(even) {background:#fff;color:#000;}

不过，这么好的方法…目前只有linux下的konqueror浏览器支持(注:Konqueror是目前唯一100%通过CSS3所有选择器测试的浏览器)，好在Opera已经开始落实支持该选择器的工作了。

我个人比较喜欢这种cutting edge的方式! 如果你想让你的网站/blog做的更先锋的话就用这种方式吧!

顺带说句: 其实linux下的konqueror是款相当棒的浏览器，他们对CSS的支持一向都是做的最棒的(目前还有个opacity没解决)，连multiple-backgrounds他们都支持了!