hexo+yilia添加“心知天气”

---

添加“心知天气”

参考：https://letmequadrakill.github.io/post/843b0170.html#more

1.注册账号，设置天气样式：

官网：https://www.seniverse.com/widgetv3，需要先注册账号，然后选择样式，如下：

生成js代码，复制代码，如下（我的免费版的代码）:

<div id="tp-weather-widget"></div>
<script>
    (function(a, h, g, f, e, d, c, b) {
        b = function() {
            d = h.createElement(g);
            c = h.getElementsByTagName(g)[0];
            d.src = e;
            d.charset = "utf-8";
            d.async = 1;
            c.parentNode.insertBefore(d, c)
        };
        a["SeniverseWeatherWidgetObject"] = f;
        a[f] || (a[f] = function() {
            (a[f].q = a[f].q || []).push(arguments)
        });
        a[f].l = +new Date();
        if (a.attachEvent) {
            a.attachEvent("onload", b)
        } else {
            a.addEventListener("load", b, false)
        }
    }(window, document, "script", "SeniverseWeatherWidget", "//cdn.sencdn.com/widget2/static/js/bundle.js"));
    window.SeniverseWeatherWidget('show', {
        flavor: "slim",
        location: "WS06YNEMPP18",
        geolocation: true,
        language: "zh-Hans",
        unit: "c",
        theme: "auto",
        token: "a579c7ea-507d-41d7-b578-3537882d20c2",
        hover: "enabled",
        container: "tp-weather-widget"
    })
</script>

以下是复制的另一个人的代码，可能是升级版的(感觉效果很不错，就用了这个，可能会出现问题，因为应该是用他的秘钥，要是他修改你就会变)：

<!-- 《添加“心知天气”-->
<div id="tp-weather-widget"></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.thinkpage.cn/widget/chameleon.js"))
    </script>
    <script>
        tpwidget("init", {
            "flavor": "slim",
            "location": "WM6N2PM3WY2K",
            "geolocation": "enabled",
            "language": "zh-chs",
            "unit": "c",
            "theme": "chameleon",
            "container": "tp-weather-widget",
            "bubble": "enabled",
            "alarmType": "badge",
            "color": "#FFFFFF",
            "uid": "U88B4B2797",
            "hash": "c9d7cb43b80ffece52c9a1ebbfbca65f"
        });
        tpwidget("show");
    </script>
<!-- 添加“心知天气”》-->

2.添加到左侧边栏

修改themes/yilia/layout/_partial/left-col.ejs，将上面的js代码添加到指定位置，位置如下：

<div class="overlay" style="background: <%= theme.style && theme.style.header ? theme.style.header : defaultBg %>">

<!-- 添加“心知天气”-->

</div>
<div class="intrude-less">

3.设置成方便开启和关闭的形式

如果主题中开启了这个设置，才开启这个功能：

<!-- 《添加“心知天气”-->
<% if(theme.xinzhi_weather){ %>
<div id="tp-weather-widget"></div>
……
        tpwidget("show");
    </script>
<% } %>
<!-- 添加“心知天气”》-->

themes/yilia/_config.yml中添加如下配置：

# 心知天气(如果不用为false):https://www.seniverse.com
xinzhi_weather: true

---

文章首发于：hexo+yilia添加“心知天气”