给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 ...
随机推荐
- BI-学习之 商业智能项目工具安装
首先咱们先需要下载一个工具,Microsoft SQL Server Data Tools - Business Intelligence for Visual Studio 2012并安装: 我目前 ...
- 地球坐标-火星坐标-百度坐标及之间的转换算法 C#
美国GPS使用的是WGS84的坐标系统,以经纬度的形式来表示地球平面上的某一个位置.但在我国,出于国家安全考虑,国内所有导航电子地图必须使 用国家测绘局制定的加密坐标系统,即将一个真实的经纬度坐标加密 ...
- 怎么看待php 面向对象思想
面向对象的程序设计思路是现代程序设计由面向过程演变面向对象的必然趋势,所以面向对象的而设计思路必然有它不同的时代意义,必然有着不同面向过程的不同历史使命,而php 5以后成功添加面向对象的设计思路其实 ...
- play框架之模板
现在网站发展日新月异,网页上显示的东西越来越复杂,看看HTML源码就知道,这东西不是正常人能拼出来的.因此模板应运而生,自我感觉,好的模板应该支持一下功能: 1.支持HTML代码段的复用,即在HTML ...
- abp(net core)+easyui+efcore仓储系统——展现层实现增删改查之控制器（六）
abp(net core)+easyui+efcore仓储系统目录 abp(net core)+easyui+efcore仓储系统——ABP总体介绍(一) abp(net core)+easyui+e ...
- localstorage实现带过期时间的缓存功能
前言 一般可以使用cookie,localstorage,sessionStorage来实现浏览器端的数据缓存,减少对服务器的请求. 1.cookie数据存放在本地硬盘中,只要在过期时间之前,都是有效 ...
- Web自动化测试 一
Web自动化测试 一.为什么要进行web自动化测试 接口测试只能测试后端返回的数据,定位的是后端开发工程师的问题.如果前段出现了问题,我们要使用web测试去发现错误. 具体定位的问题有: 显示的数据: ...
- Burp Suite 基础知识（一）
前言 大家好,我是小白,下面开始我的表演,以下内容如有雷同纯属巧合,靴靴. (鞠躬 学到什么就写什么,可能有点乱哈. Burp Suite 是一款用于攻击 web 应用程序的集成平台,包含了许多工具 ...
- Frameset下的frame动态隐藏
技术涉及:html+Jquery 不多说直接上图:由于是 .netcore MVC Web应用对于大家来说不一致的话可供参考哦
- 并发编程-concurrent指南-ReadWriteLock-ReentrantReadWriteLock（可重入读写锁）
几个线程都申请读锁,都能获取: import java.util.concurrent.TimeUnit; import java.util.concurrent.locks.ReentrantRea ...