闲得蛋疼移植一个B2主题的关键字页面

首先在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

点点赞赏,手留余香
给TA打赏
共0人
还没有人赞赏,快来当第一个赞赏的人吧!

参与评论

请登录后操作...
Top