给hexo添加宠物
开始
之前在博客园上看到，公告栏里有人竟然在养鱼，觉得很好玩！一直念念不忘的，于是就想着在hexo中也来养几只，因为我用的事Next的Muse主题，所以有一个非常合适的侧边栏，先来看看效果。
进入正题
首先你要去找几只宠物养一下，领养的网站aBowman去找你想养的宠物，狗、乌龟、青蛙之类的。
以小金鱼为例子，在下面的 edit settings按钮中可以设置一些参数，颜色、数目、背景图、食物颜色之类的。
设置完成以后，下面的框框里有对应的代码，愉快的给copy出来备用。
操作主题
找到主题下的layout/_custom/sidebar.swig文件，将这一段给copy上。外层用div包裹一下，方便调整样式。
当然了，直接复制过来的样式一定不满意，你可以在div中自己修改，也可以在 next/source/css/_custom/custom.style自己添加，直接修改外层包裹着的行间样式，也是可以的！
<div id="fish" style="text-align: center;margin-top: 18px;">
<object type="application/x-shockwave-flash" style="outline:none;" data="/js/fish.swf?up_fishColor1=F45540&up_fishColor4=0D0C0C&up_fishColor9=F45540&up_fishColor6=F45540&up_fishColor5=F45540&up_fishColor10=F45540&up_foodColor=FCB347&up_fishColor3=080707&up_fishColor7=F45540&up_backgroundImage=/images/finsh.JPG&up_numFish=6&up_fishName=Fish&up_fishColor2=F45540&up_fishColor8=F45540&up_backgroundColor=F0F7FF&" width="200" height="375"><param name="movie" value="https://cdn.abowman.com/widgets/fish/fish.swf?up_fishColor1=F45540&up_fishColor4=0D0C0C&up_fishColor9=F45540&up_fishColor6=F45540&up_fishColor5=F45540&up_fishColor10=F45540&up_foodColor=FCB347&up_fishColor3=080707&up_fishColor7=F45540&up_backgroundImage=http://img.1ppt.com/uploads/allimg/1805/1_180523223723_7.JPG&up_numFish=6&up_fishName=Fish&up_fishColor2=F45540&up_fishColor8=F45540&up_backgroundColor=F0F7FF&"><param name="AllowScriptAccess" value="always"><param name="wmode" value="opaque"><param name="scale" value="noscale"><param name="salign" value="tl"></object>
</div>
背景图片flash我已经放到资源目录中了，这块代码仅供参考，要使用你需要修改 data 与 backgroundImage 将路径改为对应的网络地址。
你已经懒到了不想修改了，直接使用我这个样式的！！！也给你！
<div id="finsh" style="text-align: center;margin-top: 18px;">
<object type="application/x-shockwave-flash" style="outline:none;" data="https://cdn.abowman.com/widgets/fish/fish.swf?up_fishColor1=F45540&up_fishColor4=0D0C0C&up_fishColor9=F45540&up_fishColor6=F45540&up_fishColor5=F45540&up_fishColor10=F45540&up_foodColor=FCB347&up_fishColor3=080707&up_fishColor7=F45540&up_backgroundImage=http://img.1ppt.com/uploads/allimg/1805/1_180523223723_7.JPG&up_numFish=6&up_fishName=Fish&up_fishColor2=F45540&up_fishColor8=F45540&up_backgroundColor=F0F7FF&" width="200" height="375"><param name="movie" value="https://cdn.abowman.com/widgets/fish/fish.swf?up_fishColor1=F45540&up_fishColor4=0D0C0C&up_fishColor9=F45540&up_fishColor6=F45540&up_fishColor5=F45540&up_fishColor10=F45540&up_foodColor=FCB347&up_fishColor3=080707&up_fishColor7=F45540&up_backgroundImage=http://img.1ppt.com/uploads/allimg/1805/1_180523223723_7.JPG&up_numFish=6&up_fishName=Fish&up_fishColor2=F45540&up_fishColor8=F45540&up_backgroundColor=F0F7FF&"></param><param name="AllowScriptAccess" value="always"></param><param name="wmode" value="opaque"></param><param name="scale" value="noscale"/><param name="salign" value="tl"/></object>
</div>
有跨域什么的问题，好像！把引用的资源放，主题的js目录下！像上面那样直接js/fish.swf 进行引用就能避免了，背景图片同理，因为背景图片引用用的是http协议，也是有跨域问题的！你可以同理放到images的目录下/images/fish.png。
给hexo添加宠物的更多相关文章
- hexo个人博客添加宠物/鼠标点击效果/博客管理
1.添加宠物 博客宠物模型:https://github.com/xiazeyu/live2d-widget-models 模型对应的动画效果:https://huaji8.top/post/live ...
- hexo添加404公益界面
http://hellolb.top/2018/08/16/hexo添加404公益界面/ hexo个人博客添加404公益界面,这里我使用的腾讯404公益界面 我的博客主题是hexo+yilia,其实所 ...
- hexo干货系列：（五）hexo添加站内搜索
前言 本来想用百度站内搜索,但是没成功,所以改用swiftype,用起来还是很棒的,这里分享一下我的安装步骤 正文 注册 去swiftype官网注册个账号,然后登陆,对了不要去在意30天试用,30天过 ...
- Hexo 添加Live2D看板娘
title: Hexo 添加 Live2D看板娘 二次元什么的最喜欢了[大好きです] 准备 项目地址 live2d模型 部分模型预览 开始 首先进入Hexo博客根目录安装live2d插件 $ npm ...
- 接入gitment为hexo添加评论功能
title: 接入gitment为hexo添加评论功能 toc: false date: 2018-04-16 10:59:56 categories: methods tags: hexo gitm ...
- Hexo添加字数统计、阅读时长
统计插件 配置 NexT 主题默认已经集成了文章[字数统计].[阅读时长]统计功能,如果我们需要使用,只需要在主题配置文件 _config.yml 中打开 wordcount 统计功能即可.如下所示: ...
- hexo添加新菜单并实现新菜单的文章归类
1.添加收藏夹菜单,新建一个页面,命名为 favorite,命令如下: hexo new page favorite ## 然后就可以看到在source下多了一个favorite的文件夹,里面有一个i ...
- HEXO添加置顶功能
使用库:参考 http://wangwlj.com/2018/01/09/blog_pin_post/ 目前已经有修改后支持置顶的仓库,可以直接用以下命令安装.(cmd 到博客根目录,nmp运行) $ ...
- 给hexo添加评论系统
默认主题 landscape 文件目录,comments为新建的 _config.yml layout -- _partial -- article.ejs |- comments -- disqus ...
随机推荐
- Delphi中inherited问题
inherited Create(AOwner); 和直接写inherited有区别吗 有区别,inherited Create是指定调用父类的Create方法,当然你也可以inherited Des ...
- STL函数static void (* set_malloc_handler(void (*f)()))()与函数指针解析
在C++ STL的SGI实现版本中,一级空间配置器class __malloc_alloc_template中有一个静态函数的实现如下: static void (*set_malloc_handle ...
- 似乎是VS2017的一个BUG
VS版本:2017(15.9.13) 新建一个c#控制台项目,把Program.cs的内容替换成如下: namespace ConsoleApp1 { class Program { static v ...
- WebApp 安全风险与防护课堂（第二讲）开课了！
本文由葡萄城技术团队于原创并首发 转载请注明出处:葡萄城官网,葡萄城为开发者提供专业的开发工具.解决方案和服务,赋能开发者. 在昨天的公开课中,由于参与的小伙伴们积极性和热情非常高,我们的讲师Carl ...
- 12 DOM操作的相关案例
1.模态框案例 需求: 打开网页时有一个普通的按钮,点击当前按钮显示一个背景图,中心并弹出一个弹出框,点击X的时候会关闭当前的模态框 代码如下: <!DOCTYPE html> <h ...
- OpenDaylight即将迈入“七年之痒”？
前段时间看到一篇文章,叫<OpenStack已死?>,讲述了OpenStack自2010年提出之后的9年间各方利益牵扯导致的一系列问题,尽管最终作者的结论是OpenStack现在只是进入了 ...
- 手动实现一个 IOC/DI 容器
第一章为源码解析. 第二章为实现一个简单的 IOC 容器. 第三章进阶 Spring 插件开发. 手动实现一个 IOC/DI 容器 上一篇文章里我们已经对 Spring 的源码有了一个大概的认识,对于 ...
- IIS下网站对options请求直接返回404
什么是options请求 options请求为发送非简单跨域请求前的预检请求,若该请求未正常返回,浏览器会阻止后续的请求发送. 一般情况下,有三种方式会导致浏览器发起预检请求 1.请求的方法不是GET ...
- 从无到有构建vue实战项目（一）
vue的安装 首先下载nodehttp://nodejs.cn/download/ 有两种安装方式安装包安装和二进制文件安装 输入以下命令,出现版本提示表示安装成功: node -v 10.15.3 ...
- 字符串匹配Boyer-Moore算法：文本编辑器中的查找功能是如何实现的？---这应该讲的最容易懂的文章了！
关于字符串匹配算法有很多,之前我有讲过一篇 KMP 匹配算法:图解字符串匹配 KMP 算法,不懂 kmp 的建议看下,写的还不错,这个算法虽然很牛逼,但在实际中用的并不是特别多.至于选择哪一种字符串匹 ...