访客地图

1. 前往clustrmaps 网站注册一个帐号

2. 找到 Free Tools 下面的 Website Widget, 点击 Get Map Widget

3. 输入你的博客网址，点击 Next

4. 根据你自己的喜好选择样式 Map widget 或 Globe Widget

5. 找到如下代码，记住 srcb64 (** 的部分):

6. 在 themes\Butterfly\layout\includes\widget 文件夹新建 card_map.pug 文件，文件内容如下：

.card-widget.card-map
 	.card-content
    .item-headline
	  i.fas.fa-globe-asia(aria-hidden="true")
     span= _p('aside.card_map')
   //- 下面这行适用于3D地图(Globe Widget)
   script#clstr_globe(type="text/javascript" srcb64="******************")
   //- 下面这行适用于平面地图(Map Widget)
   script#clustrmaps(type="text/javascript" srcb64="******************")

** 部分填写上面的 srcb64, 3D 地图和平面地图任选一个，不用的把代码删掉

编辑 themes\Butterfly\layout\includes\widget\index.pug 文件，在你想要显示的位置插入以下代码：

if theme.aside.card_map
 include ./card_map.pug

编辑 butterfly.yml 文件，在 card_webinfo 下面添加一行 card_map: true

编辑 themes\Butterfly\languages\zh-CN.yml 文件 (请根据你的网站语言选择)，找到 card_announcement: 公告 , 在下面添加一行card_map: 访客地图 (后面的文本可自定义)

如果不想显示，直接把 butterfly.yml 文件的 card_map: true 改为 card_map: false 即 可

本文转载自:Hexo添加小部件(Butterfly主题)
作者: HCLonely

FROM：浅浅淡淡[hellohy]