匿名.

为你的博客添加"心知天气"插件
心知天气提供基于Web的免费天气插件,可以为你的网站添加一项简洁美观的天气预报功能,并自动适配PC和手机上的浏览。...
扫描右侧二维码阅读全文
06
2018/09

为你的博客添加"心知天气"插件

心知天气提供基于Web的免费天气插件,可以为你的网站添加一项简洁美观的天气预报功能,并自动适配PC手机上的浏览。

配置插件

1、PC端显示效果:

2、手机端显示效果:

安装代码

方法一:复制下面代码粘贴到页面的/themes/handsome/component/footer.php中的</body>之前。

<script>(function(T,h,i,n,k,P,a,g,e){g=function(){P=h.createElement(i);a=h.getElementsByTagName(i)[0];P.src=k;P.charset="utf-8";P.async=1;a.parentNode.insertBefore(P,a)};T["ThinkPageWeatherWidgetObject"]=n;T[n]||(T[n]=function(){(T[n].q=T[n].q||[]).push(arguments)});T[n].l=+new Date();if(T.attachEvent){T.attachEvent("onload",g)}else{T.addEventListener("load",g,false)}}(window,document,"script","tpwidget","//widget.seniverse.com/widget/chameleon.js"))</script>
<script>tpwidget("init", {
    "flavor": "bubble",
    "location": "WX4FBXXFKE4F",
    "geolocation": "enabled",
    "position": "top-right",
    "margin": "10px 10px",
    "language": "auto",
    "unit": "c",
    "theme": "chameleon",
    "uid": "U9AE56E49E",
    "hash": "579b04a19cd078b22a7694878be268ff"
});
tpwidget("show");</script>

方法二:当地选择的是浮动样式时,直接将安装代码复制到主题文件夹中的index.php中。

方法三:当选择的为固定样式时,您可以自定义显示位置,本文以本站显示位置为例,插入到首页顶部导航栏中。将安装代码复制到主题文件夹的/component/headnav.php中,并在安装代码的div标签中添加class="navbar-form navbar-form-sm navbar-left shift",如下图所示。

固定样式代码如下:

<!-- 知心天气-->
    <div id="tp-weather-widget" class="navbar-form navbar-form-sm navbar-left shift"></div>
<script>(function(T,h,i,n,k,P,a,g,e){g=function(){P=h.createElement(i);a=h.getElementsByTagName(i)[0];P.src=k;P.charset="utf-8";P.async=1;a.parentNode.insertBefore(P,a)};T["ThinkPageWeatherWidgetObject"]=n;T[n]||(T[n]=function(){(T[n].q=T[n].q||[]).push(arguments)});T[n].l=+new Date();if(T.attachEvent){T.attachEvent("onload",g)}else{T.addEventListener("load",g,false)}}(window,document,"script","tpwidget","//widget.seniverse.com/widget/chameleon.js"))</script>
<script>tpwidget("init", {
    "flavor": "slim",
    "location": "WX4FBXXFKE4F",
    "geolocation": "enabled",
    "language": "auto",
    "unit": "c",
    "theme": "chameleon",
    "container": "tp-weather-widget",
    "bubble": "enabled",
    "alarmType": "circle",
    "uid": "U9AE56E49E",
    "hash": "747d4422e9a7c39cda81a7b5c29df200"
});
tpwidget("show");</script>
    <!-- 知心结束-->

以上代码为程序自动生成,包含校验信息,请勿手动修改,否则会导致插件无法使用。

示例站点1

示例站点2

心知天气:https://www.seniverse.com/widget/get


本文由 匿名. 创作, 采用 知识共享署名4.0 国际许可协议进行许可

本站文章除注明转载/出处外,均为本站原创或翻译,转载前请务必署名

原文地址:《为你的博客添加"心知天气"插件》

最后修改:2018 年 12 月 08 日 11 : 50 PM
如果觉得我的文章对你有用,请随意赞赏

发表评论

3 条评论

  1. 明月清风

    这个不错,只不过就是不想注册账号的啊。

    1. 匿名.
      @明月清风

      可以直接用文章内安装代码方法一里的代码哈|´・ω・)ノ

  2. Page

    谢谢分享,好萌的