给置顶文章标题加个“置顶”(Sticky)图片:这是我这两天无聊给最新主题 zLEI 加的一个小功能,折腾过 WordPress 的朋友肯定会说很简单,但我逛了那么多博客,没发现有介绍这个小功能的文章,所以简单写出来给需要的朋友,并且解决一下日益严重的“文囧”问题。
不过真的很简单,因为 WordPress 内置了一个置顶文章的判断函数:is_sticky(),所以只要用它来判断哪篇文章置顶,然后加入图片的div,在css定义图片div的class即可。
效果请看我现在博客的首页置顶文章的日期旁边,或者如下图:(黄字sticky红底图片)
下面简单说一下方法
1. 当然制作图片啦,图片大小和样式根据自己的主题制作,这里拿我的置顶图片说明
图片大小:30×15(图中的 Sticky 即“置顶”)
图片命名:sticky.gif
把制作好的图片放在主题文件夹里面的 images 目录下
2. 设置显示图片位置的 css,这里我用名为 stick-post 的 class 来定义,我用绝对位置
(假如你的文章区是用 post 这个 class,所以记得在 post 这个 class 加个 position:relative; 属性)
.post .sticky-post{ position:absolute; top:0; left:17px; width:30px; height:15px; background:url("images/sticky.gif") no-repeat 0 0; }
(top:0; 是图片距离post上边边距,left:17px; 是图片距离post左边边距)
3. 用文本编辑器打开主题文件 index.php
在类似 <div id="post-<?php the_ID(); ?>"> 下面加入下面代码
<?php if (is_sticky()) {echo '<div class="sticky-post"></div>';} ?>
ok,简单吧,无聊吧,那就玩玩吧。
zww
赏
oooo
or
- 本文标题:给置顶文章标题加个“置顶”提示图片
- 本文链接:https://zww.me/archives/25133
- 发布时间:2010年04月12日 19:30
- 版权声明:除非注明,文章均为 zwwooooo 原创,转载请以链接形式标明本文地址!
恩 挺好看的 呵呵~·
又学到一样。
@Vicia 嘻嘻,小小折腾下
五蛋大大,我博客挂逼了~~~居然说我“错误:无效用户名”~~但是找回密码又能找得到~诡异啊~
@托尔·银月 呃~给攻击了?还是数据库出错了?
@zwwooooo 不知道啊~~~很费解~~~
在向博客精细化发展了,大爱
@Jinwen 又开始懒了,所以就小修小改一下
哇...好细节...
@MOPVHS 这个的确够细了
为何要加置顶
@对讲机 因为这个是主题功能,很多主题没有提示“置顶”文章,而且很多来访这以为你一直没更新 - -
呵呵~PHP是简单~不过css就不会写了
@老饕 呵呵,css稍微学一下就懂了
嘎嘎,收藏先。
有直接制定判断代码啊 加上小标志 不错~
@海天 这个不耗资源,当然也是可有可无的
[...] 备注:本文的方法特适用于WP默认主题的扩展版本的使用,如果你的主题完全自定义,请移步:ZWW的教程。 [...]
有米有把置顶文章的字样调出来的功能,后台只能设置置顶功能。
@向日葵媒体设计
定制吧
试了一下 失败了!!
@软件库小智 这个应该很简单的,再尝试下吧