作者:WPdesigner.com 来源:幸福收藏夹   酷勤网收集 2008-04-20

摘要
  我们都看到,一些博客的主题拥有非常漂亮的显示日期的按钮。你是一个WP主题的爱好者,也想制作一个自己喜欢的风格,也希望有这样的按钮。今天就让我们来看看如何制作一个显示日期的按钮吧。本文是WPdesigner.com的一个教程

我们都看到,一些博客的主题拥有非常漂亮的显示日期的按钮。比如下面的这个:

你是一个WP主题的爱好者,也想制作一个自己喜欢的风格,也希望有这样的按钮。今天就让我们来看看如何制作一个显示日期的按钮吧。下面是WPdesigner.com的一个教程

第一步 - 写代码

(不要COPY,然后粘粘,自己把它写出来)

<div class="post-date">
<div class="month"> <?php the_time('M') ?> </div>
<div class="day"> <?php the_time('d') ?> </div>
</div>

为了方便管理,你的源代码应该看起来像下面这一段:

这些代码意味着什么呢:

关于DIV的就不用多解释了吧。<?php the_time('M') ?><?php the_time(''d) ?>分别指显示WP中的月份和日期。

(更多显示样式?猛击—> php.net.)

第二步 - 制作背景图片

你将会需要某些像Photoshop这样的软件来制作这个显示日期的背景图片。下面是我使用的图片:

第三步 - 个性化它

这一步需要你懂一些CSS知识,并且完全依赖于你自己的喜好,因为你的图片会和我不一样。但下面这些是基本的代码:

.post-date{
float: left;
display: inline;
margin: 0 10px 0 0;
background: url(images/date_button_template.gif) no-repeat;
}

date_button_template.gif 必需是你图片的名称。 images/ 是你主题的图片文件夹。如果你的图片在不同的文件夹。images/ 必需符合你自己的地址。

来自:http://www.happinesz.cn/archives/399/

分类: 站长经验 Web开发 网页设计



关于酷勤 | 联系方式 | 免责声明 | 友情链接