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添加“心知天氣”