网站调用网易云热评

现已经完美适配Cutten4.x主题。代码及样式自取,可以说是上手即用。如有成功实现,还烦请点赞留言

1、在侧边栏sidebar.php文件中合适的地方加入代码

<div class="sidebar-box">
<div class="p-3">网易云热评</div>
<script>
$.ajax ({
    type:"GET",
    url:"https://tenapi.cn/comment",
    dataType:"json",
    scriptCharset: 'utf-8',
    success:function (data) { 
    $("#text").html('<div class="wyycontent">'+data.data.content+'</div><br><div class="wyysong">——《'+data.data.song+'》下的评论</div>');
                        },
                });
</script>
        <wyy id="text" style="padding-left:15px;font-size:15px">思考中……</wyy>
</div>

2、可以在文件底部加入样式

<style>
}
.wyycard{
    margin: 30px;
    padding: 15px;
    color: #f2e6e0;
}
.wyycontent{
    text-align: center;
    font-size: 14px;
    padding-right: 15px;
    padding-left: 15px;
    margin-top: -20px;
}
.wyysong{
   
    text-align: right;
    font-size: 12px;
    padding-right: 15px;
    padding-bottom:15px;
}
.wyycomment{
    padding:20px 20px; 
    padding-bottom: 0px;
    margin: 10% 30% auto 30%;
    border:2px solid #fff; 
    position:relative;    
    border-radius: 4px;
    background: #af2c31;
    box-shadow:  10px -10px 0px #fcfcfc85, 
                -10px 10px 0px transparent;
}
@media screen and (max-width: 700px){
    .wyycomment{
    padding:20px 20px; 
    margin: 10% 1% auto 1% ;
    border:2px solid #fff; 
    position:relative;    
    border-radius: 4px;
    }
}
.wyycomment span{
    width:0; 
    height:0; 
    font-size:0; 
    overflow:hidden; 
    position:absolute;
}
.wyycomment span.bot{
    border-width:20px; 
    border-style:solid dashed dashed; 
    border-color:#fff transparent transparent; 
    left:15px; 
    bottom:-41px;
}
.wyycomment span.top{
    border-width:20px; 
    border-style:solid dashed dashed; 
    border-color:#af2c31 transparent transparent; 
    left:15px; 
    bottom:-38px;
} 
</style>

3、温馨提示

如果显示“思考中” 一直不显示评论的话,先看自己网站是否有调用jquery.min.js这个文件,如果没有的话,可以调用本站的文件,放在前即可

<script src="https://blog.yshgg.cn/usr/themes/Cuteen/static/js/jquery.min.js"></script>

以上效果皆是本人精心调试过的完美适配Cutten版本,如有其它主题,请自行修改

评论区
头像
    头像
    轻风记
    2021年02月28日 08:45
    回复

    为啥他一直思考中
    https://www.3328bk.cn/959

      头像
      小妖
      2021年02月28日 10:25
      回复

      你网站有调用jquery.min.js这个文件没 你先加上我的试试
      https://blog.yshgg.cn/usr/themes/Cuteen/static/js/jquery.min.js
      放到head.php 前

        头像
        轻风记
        2021年02月28日 10:33
        回复

        成了成了

          头像
          小妖
          2021年02月28日 10:34
          回复

            头像
            轻风记
            2021年02月28日 10:35
            回复

            博主的邮件模板有问题,模板下方链接是致远博客且无法打开,修改一下

              头像
              小妖
              2021年02月28日 10:49
              回复

              啊这 谢谢了 我还没注意这点

        头像
        轻风记
        2021年02月28日 10:27
        回复

    头像
    SolaKing
    2020年12月31日 14:48
    回复

    先手抢座

      头像
      小妖
      2020年12月31日 15:36
      回复

      测试了一下