扒自Shawn 在售的主题超级漂亮!!喜欢的可以去看看。
使用方法.
在wordpress后台 外观-小工具 添加自定义html即可
/*代码中的时间需提前一个月*/
<div style="text-align: center;"> <link type="text/css" media="all" href="https://a-oss.zmki.cn/20190606/love.css" rel="stylesheet"> <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;"/> <svg viewbox="0 0 1024 1024" style="margin-left: 5px;margin-right: 5px;" version="1.0" width="15" height="15" class="my-face"> <path d="M863.597631 513.574282l-271.33965-140.213484L729.783667 81.926656c3.583731-7.87141 7.167462-15.742819 7.167462-25.214109C736.887134 25.226908 708.345275 0.012799 672.635953 0.012799a63.611229 63.611229 0 0 0-39.293053 12.607055c-1.791866 1.59988-3.519736 3.19976-5.311602 3.19976L147.87531 418.925381a55.547834 55.547834 0 0 0-19.646527 47.356448c1.791866 17.278704 14.27093 33.021523 32.125591 42.492813l271.33965 141.749369L292.504463 945.221908c-12.479064 25.214109-1.791866 53.563983 23.166262 69.306802 10.751194 6.335525 23.230258 9.47129 35.709322 9.47129 16.062795 0 32.125591-4.735645 44.604655-15.742819l480.091993-403.297753a55.547834 55.547834 0 0 0 19.646526-47.228458 61.243407 61.243407 0 0 0-32.12559-44.156688z" fill="#515151"/></svg> <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>
无法插入wordpress小工具 提示错误,由于主题不同的原因,直接插入或多或少都有可能出现问题,我们可以围魏救赵嵌入解决
- 在服务器上创建一个html文件
- 把上边的代码放到创建的html文件里
- 在小工具里放入下面的代码
<iframe src="你的html文件链接地址" width="300" 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>
这样我的小工具就直接调用的是上边的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://a-oss.zmki.cn/2019/190616-5d05c81dbbaf5.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>
THE END
- 最新
- 最热
只看作者