Big front-end DUX theme beautification: add NEW icons to articles updated within 24 hours on the list page

888u

Last update at :2024-03-14,Edit by888u

How to add NEW icons on the homepage of the DUX theme for articles updated within the current 24 hours. The method is very simple. You only need to modify the two files "excerpt.php and main.css" of the DUX theme.

1. Modify excerpt.php

Open the theme's excerpt.php file and search for the following code.

echo '

'.get_the_title().get_the_subtitle().'

';

Then add the following code after the above code, and the step of modifying the excerpt.php file is completed.

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 'New';} else{echo "";}

2. Modify main.css

Look for the main.css file in the theme file and add the following code at the end. Then clear the local cache or CDN cache and you will see the same effect as this site.

/** Modify summary list positioning method */ .excerpt { position: relative; } /** NEW icon text version style **/ .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%; }

Recommended site searches: virtual space host, virtual host provider, how much does server defense cost, cheap virtual host, American independent host, 6 yuan a year cloud server, Ministry of Industry and Information Technology registration inquiry, asp.net virtual host, dual-line server Hosting, server space,

Big front-end DUX theme beautification: add NEW icons to articles updated within 24 hours on the list page

All copyrights belong to 888u unless special state
取消
微信二维码
微信二维码
支付宝二维码