WordPress实用：给博客加入漂亮的Feed订阅

wordpress 博客应用实例

如左面图您看到的那样，通过CSS样式表、PNG透明图片效果，把一个漂亮的Feed图标放置在博客右上角，这里可以加入您Feed链接，方便RSS订阅者订阅。或者开拓你的思维，放置一个GuestBook图标，然后链接到你的留言栏。大而醒目的图片，加上华丽而有个性，肯定会吸引用户点击。这是不是一个很好的创意呢？

事情很简单，咱们一步一步来。这里以我的WordPress博客为例说明。通过需求分析，我知道，我需要在博客的header部分加入代码，在ID为logo的DIV标签里。

第一、找到当前模板的CSS样式表，这里为style.css，并找到header定义处，加入如下CSS样式。absolute定义的是绝对位置，不因浏览器放缩而改变位置；width、height的125px 是图片的大小；margin-left是距离左侧820px，至于为什么要把设置成下面的大小——完全是因为我经过测试，这样我认为最好看，^_^。

#header #head_rss_feed a {
 display: block;
 position: absolute;
 background-image: url(images/feed.png);
 width: 125px;
 height: 125px;
 margin-left: 820px;
 margin-top: 0px;
 text-indent: -1900px;
 overflow: hidden;
}

第二、打开你的ie.css,给你的IE6，加入css hack，加入的原因是，用户的IE6不支持PNG图片的透明格式。代码比较简单直接复制即可，这里唯一要说的是，图片地址请用绝对链接，至于原因，自己测试就会知道答案：

#header #head_rss_feed a {
	BACKGROUND: none transparent scroll repeat 0% 0%; FILTER: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/wp-content/themes/inove/images/feed.png')
}

给你的博客加入漂亮的Feed订阅

第三、在header.php里找到我认为合适的地方，加入下面代码。这里我在ID为logo的DIV容器里加入。加入时请在你的浏览器里测试，确定代码的排版缩进良好，别把好好的代码搞的乱乱的。这里“Subscribe RSS”中文意思是“订阅 RSS”，如果你想使用中文，请确保你的编码保存为utf8格式——ANSI格式会让你的中文编程乱码。右图则是我在制作底部四栏时加入的，如果你喜欢底部四栏那种表现思维（不是说你喜欢我那DIY出来的丑陋风格）请移步《给您的WordPress博客加个底边框》

    <div id="head_rss_feed">
      <a href="<?php bloginfo('rss2_url'); ?>"><?php _e('Subscribe RSS', 'budeyan') ?></a>
    </div>

PGN透明Feed RSS订阅图片

PGN透明Feed RSS订阅图片