序言：效果展示

这次借用了 abowman 酱的 swf 文件，abowman

唯一缺点就是，手机看不了。

步骤

你可以通过引入链接的形式直接调用。前往abowman

选择你想养的宠物，这里以仓鼠为例。你可以 DIY 仓鼠的颜色参数。

复制代码，前往abowman。

将代码转换为 pug 格式。
你也可以将 swf 下下来，并通过JPEXS Free Flash Decompiler。

通过删除字体，去掉名称水印。

在根目录”myblog3.1\themes\butterfly\layout\includes\widget”文件下复制某个 PUG，重命名为”pet.pug”

打开该文件，删除原有代码，将以下代码粘贴进去。
此处为下载的 swf 的使用方法，如直接调用请替换 object 之后的的代码。

然后就是将 PUG 接入”myblog3.1\themes\butterfly\layout\includes\widget”index.pug 中。

1
2
3
4
5
6
aside:
  enable: true
  mobile: true # display on mobile
  position: right # left or right
  card_pet:
    enable: true

手机适配及无法使用时的适配的方法。

在”myblog3.1\themes\butterfly\source\css_layout"下的 third-party.styl 中配置。

1
@media screen and (max-width: 1024px) .pet background-image: url(/images/pet.png) background-repeat:no-repeat background-position-x:center;

总结

OK 那么就可以开始养仓鼠了！你也可以用同样方法养其他宠物。

快去abowman试试吧。