WordPress好用的小工具
技术类文章
WordPress好用的小工具
技术类文章

WordPress好用的小工具

添加嵌入BiliBili视频美化代码

<iframe id=”spkj” src=”https://player.bilibili.com/player.html?bvid=你要分享的视频BV号&page=1″ scrolling=”no” border=”0″ frameborder=”no” framespacing=”0″ allowfullscreen=”true” width=”100%”> </iframe>
<script type=”text/javascript”>
document.getElementById(“spkj”).style.height=document.getElementById(“spkj”).scrollWidth*0.76+”px”;
</script>

今日诗篇

先创建一个HTML然后输入此代码：
<h1>
今日诗篇<br>
</h1>
<p><script src=”https://sdk.jinrishici.com/v2/browser/jinrishici.js” charset=”utf-8″></script></p>
<div id=”poem_sentence”></div>
<div id=”poem_info”></div>
<p><script type=”text/javascript”><br />
jinrishici.load(function(result) {<br />
var sentence = document.querySelector(“#poem_sentence”)<br />
var info = document.querySelector(“#poem_info”)<br />
sentence.innerHTML = result.data.content<br />
info.innerHTML = ‘【’ + result.data.origin.dynasty + ‘】’ + result.data.origin.author + ‘《’ + result.data.origin.title + ‘》'<br />
});<br />
</script></p>
<h1>
天气预报<br>
</h1>
<p><iframe width=”232″ height=”80″ frameborder=”0″ scrolling=”no” hspace=”0″ src=”https://i.tianqi.com/?c=code&amp;a=getcode&amp;id=8&amp;icon=1″></iframe></p>

网站运行天数

先创建一个HTML然后输入此代码：

<p><span id=”runtime_span” style=”color:#E9B44C;”></span> <script type=”text/javascript”>function show_runtime(){window.setTimeout(“show_runtime()”,1000);X=new Date(“4/12/2022 10:41:57″);Y=new Date();T=(Y.getTime()-X.getTime());M=24*60*60*1000;a=T/M;A=Math.floor(a);b=(a-A)*24;B=Math.floor(b);c=(b-B)*60;C=Math.floor((b-B)*60);D=Math.floor((c-C)*60);runtime_span.innerHTML=”网站已运行”+A+”天”+B+”小时”+C+”分”+D+”秒”}show_runtime();</script></p>
请注意，在中间Date(“4/12/2022 10:41:57”)这里需按照自己的实际情况更改

天气

https://www.tianqi.com/plugin/

站长喜欢用的有这几个

1、

<h1>
天气预报<br>
</h1>
<p><iframe width=”232″ height=”80″ frameborder=”0″ scrolling=”no” hspace=”0″ src=”https://i.tianqi.com/?c=code&amp;a=getcode&amp;id=8&amp;icon=1″></iframe></p>

2、
<iframe src=”https://i.tianqi.com/?c=code&amp;a=getcode&amp;id=48&amp;num=6&amp;icon=1″ width=”800″ height=”150″ frameborder=”0″ scrolling=”no”></iframe>

3、
<iframe src=”https://i.tianqi.com?c=code&amp;id=27&amp;icon=1&amp;py=请选择&amp;temp=1&amp;site=12″ width=”400″ height=”270″ frameborder=”0″ scrolling=”no”></iframe>

也可以和今日诗篇在一起，就这样子设置：

先创建一个HTML然后输入此代码：

<h1>
今日诗篇<br>
</h1>
<p><script src=”https://sdk.jinrishici.com/v2/browser/jinrishici.js” charset=”utf-8″></script></p>
<div id=”poem_sentence”></div>
<div id=”poem_info”></div>
<p><script type=”text/javascript”><br />
jinrishici.load(function(result) {<br />
var sentence = document.querySelector(“#poem_sentence”)<br />
var info = document.querySelector(“#poem_info”)<br />
sentence.innerHTML = result.data.content<br />
info.innerHTML = ‘【’ + result.data.origin.dynasty + ‘】’ + result.data.origin.author + ‘《’ + result.data.origin.title + ‘》'<br />
});<br />
</script></p>
<h1>
天气预报<br>
</h1>
<p><iframe width=”232″ height=”80″ frameborder=”0″ scrolling=”no” hspace=”0″ src=”https://i.tianqi.com/?c=code&amp;a=getcode&amp;id=8&amp;icon=1″></iframe></p>

好看的WordPress背景动效

控制面板-外观-小工具-随便找一个然后选html然后复制这个css

<script type=“text/javascript” color=“0,0,255” opacity=’0.7‘ zIndex=“-2” count=“200” src=“//cdn.bootcss.com/canvas-nest.js/1.0.0/canvas-nest.min.js”></script>

CSS一件全站变灰

原文章地址https://www.seovx.com/672.html

将下面代码加入在后台外观，自定义里面的额外css里即可，加在主题选项里的css里就可以了，到前台刷新一下，网页变灰色了吧，包括网站的广告、图片等整个网页变黑白了。

html{
-webkit-filter: grayscale(100%); /* webkit */
-moz-filter: grayscale(100%); /*firefox*/
-ms-filter: grayscale(100%); /*ie9*/
-o-filter: grayscale(100%); /*opera*/
filter: grayscale(100%);
filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);
filter:gray; /*ie9- */
}

彩色动态倒计时

1：

<section id=”block-92″ class=”widget-container widget_block”><div class=”gn_box”><h1><left><font color=”#E80017″>2</font><font color=”#D1002E”>0</font><font color=”#BA0045″>2</font><font color=”#A3005C”>4</font><font color=”#8C0073″>年</font><font color=”#75008A”>-</font><font color=”#5E00A1″>无线电A类</font><font color=”#4700B8″>考试</font><font color=”#3000CF”>倒</font><font color=”#1900E6″>计</font><font color=”#0200FD”>时</font> </left></h1> <left><div id=”CountMsg” class=”HotDate”> <span id=”t_d”>-293 天</span> <span id=”t_h”>-15 时</span> <span id=”t_m”>-33 分</span> <span id=”t_s”>-53 秒</span></div> </left> <script type=”text/javascript”>function getRTime() {
    var EndTime = new Date(‘2024/04/27 15:30:00’);
    var NowTime = new Date();
    var t = EndTime.getTime() – NowTime.getTime();
    var d = Math.floor(t / 1000 / 60 / 60 / 24);
    var h = Math.floor(t / 1000 / 60 / 60 % 24);
    var m = Math.floor(t / 1000 / 60 % 60);
    var s = Math.floor(t / 1000 % 60);
    document.getElementById(“t_d”).innerHTML = d + ” 天”;
    document.getElementById(“t_h”).innerHTML = h + ” 时”;
    document.getElementById(“t_m”).innerHTML = m + ” 分”;
    document.getElementById(“t_s”).innerHTML = s + ” 秒”;
}
setInterval(getRTime, 1000);</script> </div></section>
2：
<section id=”block-92″ class=”widget-container widget_block”><div class=”gn_box”><h1><left><font color=”#E80017″>2</font><font color=”#D1002E”>0</font><font color=”#BA0045″>2</font><font color=”#A3005C”>3</font><font color=”#8C0073″>年</font><font color=”#75008A”>-</font><font color=”#5E00A1″>高</font><font color=”#4700B8″>考</font><font color=”#3000CF”>倒</font><font color=”#1900E6″>计</font><font color=”#0200FD”>时</font> </left></h1> <left><div id=”CountMsg” class=”HotDate”> <span id=”t_d”>-293 天</span> <span id=”t_h”>-15 时</span> <span id=”t_m”>-33 分</span> <span id=”t_s”>-53 秒</span></div> </left> <script type=”text/javascript”>function getRTime() {
    var EndTime = new Date(‘2023/06/7 00:00:00’);
    var NowTime = new Date();
    var t = EndTime.getTime() – NowTime.getTime();
    var d = Math.floor(t / 1000 / 60 / 60 / 24);
    var h = Math.floor(t / 1000 / 60 / 60 % 24);
    var m = Math.floor(t / 1000 / 60 % 60);
    var s = Math.floor(t / 1000 % 60);
    document.getElementById(“t_d”).innerHTML = d + ” 天”;
    document.getElementById(“t_h”).innerHTML = h + ” 时”;
    document.getElementById(“t_m”).innerHTML = m + ” 分”;
    document.getElementById(“t_s”).innerHTML = s + ” 秒”;
}
setInterval(getRTime, 1000);</script> </div></section>
        <section id=”block-92″ class=”widget-container widget_block”>
            <div class=”gn_box”>
                <h1><font color=”#E80017″>2</font><font color=”#D1002E”>0</font><font color=”#BA0045″>2</font><font color=”#A3005C”>4</font><font color=”#8C0073″>年</font><font color=”#75008A”>-</font><font color=”#5E00A1″>无线电A类</font><font color=”#4700B8″>考试</font><font color=”#3000CF”>倒</font><font color=”#1900E6″>计</font><font color=”#0200FD”>时</font></h1>
                <div id=”CountMsg” class=”HotDate”> <span id=”t_d”>-293 天</span> <span id=”t_h”>-15 时</span> <span id=”t_m”>-33 分</span> <span id=”t_s”>-53 秒</span></div>
                <script type=”text/javascript”>
                    function getRTime() {
                        var EndTime = new Date(“2024/04/27 15:30:00”);
                        var NowTime = new Date();
                        var t = EndTime.getTime() – NowTime.getTime();
                        var d = Math.floor(t / 1000 / 60 / 60 / 24);
                        var h = Math.floor(t / 1000 / 60 / 60 % 24);
                        var m = Math.floor(t / 1000 / 60 % 60);
                        var s = Math.floor(t / 1000 % 60);
                        document.getElementById(“t_d”).innerHTML = d + ” 天”;
                        document.getElementById(“t_h”).innerHTML = h + ” 时”;
                        document.getElementById(“t_m”).innerHTML = m + ” 分”;
                        document.getElementById(“t_s”).innerHTML = s + ” 秒”;
                    }
                    setInterval(getRTime, 1000);
                </script>
            </div>
        </section>
  <h1>
    今日诗篇<br>
    </h1>
  <span id=”jinrishici-sentence”>正在加载今日诗词….</span>
<script src=”https://sdk.jinrishici.com/v2/browser/jinrishici.js” charset=”utf-8″></script>
<h1>
    天气预报<br>
    </h1>
  <p><iframe width=”232″ height=”80″ frameborder=”0″ scrolling=”no” hspace=”0″ src=”https://i.tianqi.com/?c=code&amp;a=getcode&amp;id=8&amp;icon=1″></iframe></p>

还有好用的站长稍后再补充

发表回复