首先在Hosico\core\Klass\Post\
目录下新建Post.php
代码如下
<?php
/**
* Copyright (c) 2020-2021, Polywoo Inc.
* All right reserved.
*
* @author Zhiyan
*/
?>
<?php
namespace Polywoo\Hosico\Core\Klass\Post;
class Post{
public static function get_post_tags($number){
$tags = get_tags(array('orderby' => 'count','order'=>'desc','hide_empty' => false, 'number'=>$number,'public'=> true));
$tags_list = array();
if($tags){
foreach ($tags as $k => $v) {
//$img = get_term_meta($v->term_id,'b2_tax_img',true);
//if($img){
// $img = tl_get_thumb(array('thumb'=>$img,'width'=>120,'height'=>80));
//}
$tags_list[] = array(
//'img'=>$img,
'name'=>esc_attr($v->name),
'link'=>esc_url(get_tag_link( $v->term_id )),
'count'=>$v->count
);
}
}
unset($tags);
return $tags_list;
}
}
Hosico\core\Template\page
目录下新建tpl.Tags.php
<?php
/**
* Template Name: 关键字
*
* Copyright (c) 2020-2021, Polywoo Inc.
* All right reserved.
*
* @author Zhiyan
*/
use Polywoo\Hosico\Core\Klass\Post\Post;
use Polywoo\Hosico\Core\Utils\General;
tl_get_header();
$tags = Post::get_post_tags(198);
?>
<div class="container no-aside pt-3 pb-3">
<main id="main" class="site-main">
<h1 class="text-center mt-4 mb-4"><?php echo __('热门标签','b2'); ?></h1>
<?php if($tags){
echo '<ul>';
foreach ($tags as $k => $v) {
echo '<li>
<a href="'.$v['link'].'" target="_blank" class="box radius m-3" rel="noopener">
<h2 title="'.$v['name'].'">'.$v['name'].'</h2>
<p>'.__('共','b2').General::short_num_text($v['count']).__('篇文章','b2').'</p>
</a>
</li>';
}
echo '</ul>';
?>
<?php
}else{
echo '这里什么也没有';
} ?>
</main>
</div>
<?php
tl_get_footer();
?>
CSS
.site-main ul {
display: flex;
flex-flow: wrap;
}
.site-main ul li {
width: 16.66667%;
}
.site-main ul li a {
display: block;
padding: 20px 10px;
text-align: center;
border-radius: 3px;
background-color: #35bdc7;
border: 2px solid rgba(255, 255, 255, 0);
}
.site-main ul li a:hover {
box-shadow: 0 3px 10px #ccc;
border: 2px solid #fff;
}
.site-main ul li:nth-child(7n+2) a {
background-color: #fca61e;
}
.site-main ul li:nth-child(7n+3) a {
background-color: #e65a4f;
}
.site-main ul li:nth-child(7n+4) a {
background-color: #a1c15c;
}
.site-main ul li:nth-child(7n+5) a {
background-color: #76cba2;
}
.site-main ul li:nth-child(7n+6) a {
background-color: #8f82bc;
}
.site-main ul li:nth-child(7n+7) a {
background-color: #f29c9f;
}
.site-main ul li h2 {
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 1;
height: 25px;
overflow: hidden;
margin-bottom: 10px;
font-weight: 600;
font-size: 17px;
color: #fff;
line-height: 1.4;
}
.site-main ul li p {
font-size: 12px;
color: rgba(255, 255, 255, 0.63);
}
演示页面:https://demo.gihut.com/tags
OK!
本文由我的自留地作者:随之长风原创,转载请注明出处来自https://demo.gihut.com/2510.html