首页 学习快乐📔,爱好兴趣🌌

现已经完美适配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这个文件,如果没有的话,可以调用本站的文件,放在</head>前即可

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

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




文章评论

    轻风记 访客ChromeWindows
    2021-02-28 8:45   回复

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

      小妖 站长ChromeWindows
      2021-02-28 10:25   回复

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

        轻风记 访客ChromeWindows
        2021-02-28 10:33   回复

        成了成了

          小妖 站长ChromeWindows
          2021-02-28 10:34   回复

            轻风记 访客ChromeWindows
            2021-02-28 10:35   回复

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

              小妖 站长ChromeWindows
              2021-02-28 10:49   回复

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

        轻风记 访客ChromeWindows
        2021-02-28 10:27   回复

    SolaKing 访客ChromeAndroid
    2020-12-31 14:48   回复

    先手抢座

      小妖 站长ChromeWindows
      2020-12-31 15:36   回复

      测试了一下