几周前,博主从某友链博客中得知了心知天气这个网页插件。现在分享给大家。

一、注册帐号

首先去心知天气官网注册一个帐号,注册步骤很简单,就不赘述了

二、生成代码

点击首页==》产品==》网页天气插件,在点击页面中的立即创建,则可以进入自动生成代码页面,可以根据自己的需要创建各种样式的插件样式。
该插件共用两种样式,浮动的以及固定。

  • 浮动样式

    ![浮动样式][2]
    

    设置参数如图所示,这是博主曾经使用过的浮动样式,此种样式将悬浮在页面某处(可自定义),需要注意的是在移动端显示时可能会遮挡内容,所以博主弃用了。

  • 固定样式

    ![固定样式][3]
    

这是样式为固定样式,参数如图所示。可以由你的网页代码自由控制显示位置。例如本博客就显示在顶部导航栏,不产生遮挡。

选择好样式后,在下方将会自动生成插件安装代码。

安装代码

三、插入博客

将天气插件添加如博客很简单。

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

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

headnav.php

保存改动,浏览器ctrl+F5强制刷新即可看见效果。

Last modification:May 14th, 2018 at 01:09 pm
If you think my article is useful to you, please feel free to appreciate