美化大前端DUX主题 - 新发布的文章加上NEW图标

在WordPress圈内我们应该比较熟悉大前端的，老蒋个人也是比较喜欢他们家的主题的。目前有购买过他们家的DUX、XIU主题，之前还有人质疑老蒋部落使用的盗版主题，后来截图XIU购买订单后台就直接让人无话可说。今天我们需要做一件事情，就是在对DUX主题修改首页的新文章，加上NEW标志。

第一、修改主题的excerpt.php

找到主题目录中的excerpt.php文件，然后找到对应代码：

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_t he_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-icon">New</span>';} else{echo "";}

第二、修改样式

找到样式文件：main.css，在最后添加：

/** 修改NEW标志样式 itbulu.com */ .excerpt { positiON: relative; } /** NEW 图标文字版样式 **/ .excerpt .new-icon{ position: absolute; right: -38px; top: -16px; display: block; width: 76px; height: 20px; line-height: 20px; background: #4caf50; color: #fff; font-size: 14px; font-weight: 400; text-align: center; transform: rotate(45deg); transform-origin: 0% 0%; }

然后我们再刷新CDN或者缓存看看效果。

本文出处：老蒋部落 » 美化大前端DUX主题 - 新发布的文章加上NEW图标 | 欢迎分享