Loading... ## <span style='color: #FF69B4'>**我现在单身 但是不妨碍我以后会脱单!!!!!**</span> ## 先来看看效果图 ![恋爱天数效果](https://www.hawait.cn/usr/uploads/2022/03/720386254.png) ## 下面是步骤以及代码 ### 1、新建html文件并赋值修改代码 <span style='color:#FFD700'>文件按照自己方式命名 并复制以下代码到文件中</span> <div class="panel panel-default collapse-panel box-shadow-wrap-lg"><div class="panel-heading panel-collapse" data-toggle="collapse" data-target="#collapse-852733ae755057d0575c336a2fe52e9e49" aria-expanded="true"><div class="accordion-toggle"><span>代码如下 点击展开</span> <i class="pull-right fontello icon-fw fontello-angle-right"></i> </div> </div> <div class="panel-body collapse-panel-body"> <div id="collapse-852733ae755057d0575c336a2fe52e9e49" class="collapse collapse-content"><p></p> ```html <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <link rel="stylesheet" href="https://cdn.bootcss.com/font-awesome/4.7.0/css/font-awesome.css"> <link rel="stylesheet" href="https://www.hawait.cn/LOVE/LOVE.css"> <style type="text/css"> .widget_text .aplayer {margin: -12px -16px } .widget_text .aplayer .aplayer-info {padding: 7px 7px 7px 10px} .widget_text .aplayer .aplayer-info .aplayer-music {margin: 0 0 13px 0} .giligili-item { position: relative; width: 100%; background: #fff; border-radius: 4px; overflow: hidden; /*margin-bottom: 8px;*/ /*阴影*/ padding: 12px 16px; -webkit-box-shadow: 0 1px 3px rgba(26,26,26,.1); box-shadow: 0 1px 3px rgba(26,26,26,.1) } </style> </head> <body style="background-color: #FFFFFF;"bgcolor="#FFFFFF"> <div class="widget_text giligili-item"> <div class="textwidget custom-html-widget"> <div style="text-align: center;"> <img src="https://a-oss.zmki.cn/20190601/img_9879.jpg" style="width: 50px;height: 50px;vertical-align: -20px;border-radius: 50%;margin-right: 5px;margin-bottom: 5px;-webkit-box-shadow: 1px 1px 1px rgba(0,0,0,.1), 1px 1px 1px rgba(0,0,0,0.1), 1px 1px 1px rgba(0,0,0,0.1);box-shadow: 1px 1px 1px rgba(0,0,0,.1), 1px 1px 1px rgba(0,0,0,0.1), 1px 1px 1px rgba(0,0,0,0.1);border: 2px solid #fff;" /> <i class="fa fa-heart throb" aria-hidden="true" style="color:red"></i> <img src="https://a-oss.zmki.cn/20190601/img_9878.jpg" style="width: 50px;height: 50px;vertical-align: -20px;border-radius: 50%;margin-left: 5px;margin-bottom: 5px;-webkit-box-shadow: 1px 1px 1px rgba(0,0,0,.1), 1px 1px 1px rgba(0,0,0,0.1), 1px 1px 1px rgba(0,0,0,0.1);box-shadow: 1px 1px 1px rgba(0,0,0,.1), 1px 1px 1px rgba(0,0,0,0.1), 1px 1px 1px rgba(0,0,0,0.1);border: 2px solid #fff;" /> <br/> <span id="htmer_time"></span> </div> <script type="text/javascript" language="javascript">function setTime() { var create_time = Math.round(new Date(Date.UTC(2018, 10, 26, 6, 45, 0)).getTime() / 1000); var timestamp = Math.round((new Date().getTime() + 8 * 60 * 60 * 1000) / 1000); currentTime = secondToDate((timestamp - create_time)); currentTimeHtml = currentTime[0] + ' 年 ' + currentTime[1] + ' 天 ' + currentTime[2] + ' 时 ' + currentTime[3] + ' 分 ' + currentTime[4] + ' 秒'; document.getElementById("htmer_time").innerHTML = currentTimeHtml; } function secondToDate(second) { if (!second) { return 0; } var time = new Array(0, 0, 0, 0, 0); if (second >= 365 * 24 * 3600) { time[0] = parseInt(second / (365 * 24 * 3600)); second %= 365 * 24 * 3600; } if (second >= 24 * 3600) { time[1] = parseInt(second / (24 * 3600)); second %= 24 * 3600; } if (second >= 3600) { time[2] = parseInt(second / 3600); second %= 3600; } if (second >= 60) { time[3] = parseInt(second / 60); second %= 60; } if (second > 0) { time[4] = second; } return time; } setInterval(setTime, 1000);</script> </div> </body> </html> ``` <p></p></div></div></div> 头像链接自行修改 <div class="tip inlineBlock warning"> **代码中恋爱天数需提前一个月** </div> ### 2、在侧边栏广告用ifram插入html文件 在handsome<CODE>**主题设置-开发者设置-全局右侧广告**</CODE> 填入以下代码: <div class="panel panel-default collapse-panel box-shadow-wrap-lg"><div class="panel-heading panel-collapse" data-toggle="collapse" data-target="#collapse-a16c4439aff5c78e6563a36e28baf61413" aria-expanded="true"><div class="accordion-toggle"><span>代码如下 点击展开</span> <i class="pull-right fontello icon-fw fontello-angle-right"></i> </div> </div> <div class="panel-body collapse-panel-body"> <div id="collapse-a16c4439aff5c78e6563a36e28baf61413" class="collapse collapse-content"><p></p> ``` <iframe src="https://www.xxxx.cn/love.html" width="100%" height="100" frameborder="0" scrolling="No" align="center"><span data-mce-type="bookmark" style="display: inline-block; width: 0px; overflow: hidden; line-height: 0;" class="mce_SELRES_start"></span></iframe> ``` <p></p></div></div></div> <div class="tip inlineBlock error"> **请修改链接为自己新建html文件链接** </div> ### 3、自定义js修改广告文字 由于handsome主题全局右侧广告自定义html显示的文字是<CODE>**广告**</CODE> 为了方便后续主题升级,我们选择自定义js来修改广告标题 在<CODE>**主题设置-开发者设置-自定义JS**</CODE> 中填入以下代码: ```js <!--恋爱天数广告标题修改--> if(document.getElementById("a_d_sidebar")){ document.getElementById('a_d_sidebar').innerHTML=document.getElementById('a_d_sidebar').innerHTML.replace("广告","LOVE"); } ``` 其中的LOVE可以自定义自己想要的文字 ### 4、添加PJAX回调函数 此时我们发现在打开任何一个页面的时候广告栏显示的文字还是**广告**,所以我们需要继续在PJAX中加入回调函数 在<CODE>**主题设置-PJAX-PJAX回调函数**</CODE> 中填入以下代码: ```js if(document.getElementById("a_d_sidebar")){ document.getElementById('a_d_sidebar').innerHTML=document.getElementById('a_d_sidebar').innerHTML.replace("广告","LOVE"); } ``` 最后保存设置刷新网页就可以查看效果啦 最后修改:2023 年 10 月 29 日 © 允许规范转载 赞 10 如果觉得我的文章对你有用,请随意赞赏
此处评论已关闭