效果图

使用方法

在sidebar.php文件中添加以下代码

<!-- 热搜 -->
<section class="widget widget_tag_cloud wrapper-md clear" id="hot">
    <h5 class="widget-title m-t-none text-md">热搜排行</h5>
    <div class="tab-container">
        <ul class="nav nav-tabs">
            <li class="active" style="width: 50%;"><a style="margin-right: 0px;text-align:center" href="" data-toggle="tab" data-target="#tab_baidu_hot" aria-expanded="true">百度<span class="badge bg-danger badge-sm m-l-xs" id="baidu_hot_num"><i class="animate-spin fontello fontello-refresh"></i></span></a></li>
            <li class="" style="width: 50%;"><a style="margin-right: 0px;text-align:center" href="" data-toggle="tab" data-target="#tab_douyin_hot" aria-expanded="false">抖音<span class="badge bg-danger badge-sm m-l-xs" id="douyin_hot_num"><i class="animate-spin fontello fontello-refresh"></i></span></a></li>
        </ul>
        <div class="tab-content" style="background-color: unset;border: unset;padding-top: 1px; ">
            <div class="tab-pane active" id="tab_baidu_hot">
                <ul class="list-group no-borders pull-in m-b-none" id="baidu_hot">
                
                </ul>
            </div>
            <div class="tab-pane" id="tab_douyin_hot">
                <ul class="list-group list-group-alt list-group-lg no-borders pull-in m-b-none" id="douyin_hot">
                    
                </ul>
            </div>
        </div>
    </div>
</section>

具体加在模板component文件夹中sidebar.php文件里
找到博客信息这个注释 在前面加上代码

在后台添加自定义JS代码

//百度热搜排行榜
function ss_hot(){
    if($("#sidebar").length > 0){
        if($("#baidu_hot").length){
            $.ajax({
                type:"get", 
                url:"https://api.gmit.vip/Api/BaiduHot",  
                async:true,   
                success:function(res){
                    if(res.code == 200){
                        $("#baidu_hot_num").html(res.data.length);
                        var html = '';
                        var htmls = '';
                        for (var i = 0; i < res.data.length; i++){
                            if(i < 10){
                                hot = '';
                                if(i < 3){
                                    hot = '<b class="badge bg-danger pull-left">TOP'+(i+1)+'</b>';
                                }
                                html += `<div class="list-group list-group-lg list-group-sp col-xs-12 col-sm-12 col-md-12 col-lg-12" style="margin-bottom: 0px;padding-right: 0px;"><a style="padding: 5px 5px 5px 5px;" href="`+res.data[i].url+`" target="_blank" class="list-group-item no-borders box-shadow-wrap-lg"><span class="clear"><span class="text-ellipsis">`+res.data[i].title+`</span><small class="text-muted clear text-ellipsis"><b class="badge bg-dark pull-left">No.`+(i+1)+`</b> <b class="badge bg-info pull-left">`+res.data[i].hot+`</b>`+hot+`</small></span></a></div>`;
                            }else{
                                htmls += `<div class="list-group list-group-lg list-group-sp col-xs-12 col-sm-12 col-md-12 col-lg-12" style="margin-bottom: 0px;padding-right: 0px;"><a style="padding: 5px 5px 5px 5px;" href="`+res.data[i].url+`" target="_blank" class="list-group-item no-borders box-shadow-wrap-lg"><span class="clear"><span class="text-ellipsis">`+res.data[i].title+`</span><small class="text-muted clear text-ellipsis"><b class="badge bg-dark pull-left">No.`+(i+1)+`</b> <b class="badge bg-info pull-left">`+res.data[i].hot+`</b></small></span></a></div>`;
                            }
                        }
                        $("#baidu_hot").append(html+'<div class="text-center" style="text-decoration: underline"><a id="all_baidu_hot" class="infinite-scroll-request">加载更多</a></div>');
                        $("#all_baidu_hot").click(function() {
                            $("#baidu_hot").html(html+htmls);
                        });
                    }
                }
            }); 
        }
        if($("#douyin_hot").length){
            $.ajax({
                type:"get", 
                url:"https://api.gmit.vip/Api/DouYinHot",  
                async:true,   
                success:function(res){
                    if(res.code == 200){
                        $("#douyin_hot_num").html(res.data.length);
                        var html = '';
                        var htmls = '';
                        for (var i = 0; i < res.data.length; i++){
                            if(i < 10){
                                hot = '';
                                if(i < 3){
                                    hot = '<b class="badge bg-danger pull-left">TOP'+(i+1)+'</b>';
                                }
                                html += `<div class="list-group list-group-lg list-group-sp col-xs-12 col-sm-12 col-md-12 col-lg-12" style="margin-bottom: 0px;padding-right: 0px;"><a style="padding: 5px 5px 5px 5px;" href="`+res.data[i].url+`" target="_blank" class="list-group-item no-borders box-shadow-wrap-lg"><span class="clear"><span class="text-ellipsis">`+res.data[i].title+`</span><small class="text-muted clear text-ellipsis"><b class="badge bg-dark pull-left">No.`+(i+1)+`</b> <b class="badge bg-info pull-left">`+res.data[i].hot+`</b>`+hot+`</small></span></a></div>`;
                            }else{
                                htmls += `<div class="list-group list-group-lg list-group-sp col-xs-12 col-sm-12 col-md-12 col-lg-12" style="margin-bottom: 0px;padding-right: 0px;"><a style="padding: 5px 5px 5px 5px;" href="`+res.data[i].url+`" target="_blank" class="list-group-item no-borders box-shadow-wrap-lg"><span class="clear"><span class="text-ellipsis">`+res.data[i].title+`</span><small class="text-muted clear text-ellipsis"><b class="badge bg-dark pull-left">No.`+(i+1)+`</b> <b class="badge bg-info pull-left">`+res.data[i].hot+`</b></small></span></a></div>`;
                            }
                        }
                        $("#douyin_hot").append(html+'<div class="text-center" style="text-decoration: underline"><a id="all_douyin_hot" class="infinite-scroll-request">加载更多</a></div>');
                        $("#all_douyin_hot").click(function() {
                            $("#douyin_hot").html(html+htmls);
                        });
                    }
                }
            }); 
        }
    }
}ss_hot();

pjax回调函数

如果开启pjax无刷新 需添加pjax回调函数

ss_hot();