WordPress为网站添加new图标文字方法教程

wordpress为网站添加new图标文字方法教程,很多朋友都想要像我的站一样,在文章页的右上角加个图标,所以今天就教大家这种方法,让它看起来漂亮。

效果图:

WordPress为网站添加new图标文字方法教程 技术教程 第1张

在主题的excerpt.php中添加:

我们要想使得首页文章列表中显示 NEW 图标则需要编辑这个文件。在该文件下搜索下面这段代码:

echo '<h2><a'._post_target_blank().' href="'.get_permalink().'" title="'.get_the_title().get_the_subtitle(false)._get_delimiter().get_bloginfo('name').'">'.get_the_title().get_the_subtitle().'</a></h2>';

然后在其后添加如下代码:

date_default_timezone_set('PRC');
$t1=$post->post_date;
$t2=date("Y-m-d H:i:s");
$diff=(strtotime($t2)-strtotime($t1))/3600;
if($diff<24){echo "<span class='new'>New</span>";} //数字24表示文章发布24小时内的添加标记
else{echo "";} //如果超过设定的时间则显示为空白

在主题的main.css中添加如下代码:

.excerpt {
 position: relative;
}
.excerpt .new {
 position: absolute;
 right: -38px;
 top: -16px;
 display: block;
 width: 67px;
 height: 20px;
 line-height: 20px;
 background: #f0473ad4;
 color: #fff;
 font-size: 13px;
 font-weight: 400;
 text-align: center;
 transform: rotate(45deg);
 transform-origin: 0% 0%;
}

以上就是降温资源网分享的“WordPress为网站添加new图标文字方法教程”的全部内容了,对于很多想要完美的朋友来说,这个教程不错。

赞(2)
如有侵权请联系我,未经允许不得转载:降温资源网 » WordPress为网站添加new图标文字方法教程
分享到: 更多 (0)

评论 抢沙发

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址