hexo中引入iconfont自定义图标
新建图标项目
搜索自己心仪的图标，然后选择添加入库，加到购物车
选择完毕后点击右上角的购物车图标，打开侧栏，选择添加到项目，如果没有项目就新建一个，如下：
可以通过上方顶栏菜单 -> 资源管理 -> 我的项目，找到之前添加的图标项目。(现在的 iconfont 可以在图标库的项目设置里直接打开彩色设置，然后采用 fontclass 的引用方式即可使用多彩图标。但是单一项目彩色图标上限是 40 个图标，酌情采用。)引入图标
线上引入方案，我使用的是官方文档中最便捷的 font-class 方案。这一方案偶尔会出现图标加载不出的情况。但是便于随时对图标库进行升级，换一下在线链接即可，适合新手使用。最新版本的 iconfont 支持直接在项目设置中开启彩色图标，从而实现直接用 class 添加多彩色图标。（推荐直接用这个即可）
在 source\css\custom.css 中填写如下内容，引入 Font-class 的线上资源：
12@import "//at.alicdn.com/t/c/font_3785958_78091558z5o.css";
更推 ...
hexo留言板中添加两句诗句
前言本文将介绍如何增添随机诗词的展示。
具体效果如下：
操作进入留言板文件夹messageboard，编辑index.md文件，添加如下代码：
12345678910111213141516171819<div class="poem-wrap"> <div class="poem-border poem-left"></div> <div class="poem-border poem-right"></div> <h>念两句诗</h> <p id="poem">挑选中...</p> <p id="info"> <script src="https://sdk.jinrishici.com/v2/browser/jinrishici.js" charset="utf-8"></scrip ...
vue中实现前端语言国际化i18n
先现在项目中安装vue-i18n的依赖1npm install vue-i18n --save
在src下建一个lang的文件夹,并且在其下面建一个index.js文件,然后在里面写如下代码123456789101112131415161718192021import Vue from "vue"; // 引入Vueimport VueI18n from "vue-i18n"; // 引入国际化的包import ElementLocale from 'element-ui/lib/locale'import enLocale from 'element-ui/lib/locale/lang/en' //引入el自带得国际化语言包,防止内部插件出现乱码import zhLocale from 'element-ui/lib/locale/lang/zh-CN'//引入el自带得国际化语言包,防止内部插件出现乱码Vue.use(VueI18n); // 全局注册国际化包 // 准备翻译的语 ...
在小程序中使用svg字体图标
在小程序中使用svg字体图标第一步：首先在阿里巴巴矢量图库https://www.iconfont.cn/search 里面下载你想要的小图标：第二步：打开 https://icomoon.io 把你刚刚下载的svg拖拽到这里：第三步：在线转换base64编码字体，打开 https://transfonter.org/ ：下载完成后你会得到第二个文件夹，解压：接下来就可以使用了：注意： 字体图标就相当于字体直接用font-size控制大小，color控制颜色就可以
1234// wxml结构文件:<view class="icon-copy"></view>// wxss样式文件：.icon-copy {font-size: 30px;color: #000;}
uniapp实现类似keep-alive效果（从列表页进入详情页，返回列表页滚动条位置不变）
uniapp 实现类似keep-alive效果（从列表页进入详情页，返回列表页滚动条位置不变）uniapp的页面生命周期函数onPageScroll可以拿到滚动距离的值
将列表页滚动的距离scrollTop值 存到data中123onPageScroll : function(e) { this.scrollTop = e.scrollTop; },
在点击跳转详情的方法中，将scrollTop值存缓存1234567toDetail(id) { uni.setStorage({ key:"listTop", data:this.scrollTop }) ...}
返回列表页时，在onShow中使用uni.pageScrollTo 将缓存的scrollTop值渲染到页面上。
1234567891011121314onShow() {//滚动条 uni.getStorage({ key:"listTop", success ...
Hexo增添公告栏计时器小部件
Hexo增添公告栏计时器小部件本问将介绍如何在公告栏增加计时器小部件，效果如下图所示：
操作在\source\js目录下创建一个timing.js文件，并将如下代码写入该文件：
123456789101112131415161718192021222324let oSpan = document.getElementsByTagName("timing")[0];let localhostTime = new Date();//获取页面打开的时间function tow(n) { return n >= 0 && n < 10 ? '0' + n : '' + n;}setInterval(function () { let goTime = new Date();//获取动态时间 let diffTime = goTime.getTime() - localhostTime.getTime(); var second = Math.fl ...
解决hexo开启懒加载后图片无法立即显示的问题
解决了hexo开启懒加载后图片无法立即显示的问题本文主要介绍hexo-lazyload-image插件引发的bug以及相关API
问题描述最近在折腾hexo搭建的个人主页 的时候，遇到了这样一个 bug：
网站开启图片懒加载后，首次加载页面图片不显示，但是刷新一次后会显示。
我的插件版本是：hexo-lazyload-image 。
问题原因笔者为了提升网页的浏览体验，开启了pjax优化，其原理在于pjax封装了ajax实现局部刷新，将网站变成了单页面应用。
懒加载插件如果配置不当，将与pjax插件发生冲突，导致以上bug。
解决方法找到hexo项目的根目录下的站点配置文件_config.yml，具体路径：blog/_config.yml，其中blog是你的项目文件夹。
找到lazyload配置，添上isSPA: true字段即可。
123456lazyload: enable: true onlypost: false # optional loadingImg: # optional eg ./images/loading.gif isSPA: true # optiona ...
Qexo - 一个快速、强大、漂亮的在线 Hexo 编辑器
第一次使用markdownQexo 是一个快速、强大、漂亮的在线 Hexo 编辑器
快速开始Github 开源仓库：https://github.com/am-abudu/QexoWiki：https://github.com/am-abudu/Qexo/wiki
特色功能
自定义图床上传图片
在线配置编辑
在线文章管理
在线页面管理
较为完善的缓存功能
Webhook 清除缓存
自动检查更新
实验性的在线更新
开放的 API无服务器部署申请 MongoDB注册 MongoDB 账号 创建免费 MongoDB 数据库，区域推荐选择 AWS / N.Virginia (us-east-1) 在 Clusters 页面点击 CONNECT，按步骤设置允许所有 IP 地址的连接），创建数据库用户，并记录数据库连接信息，密码即为你所设置的值Fork 本项目打开 qexo项目主页 点击 Fork 将项目复刻到您的账户下创建 Vercel 项目打开 Vercel 注册账号并绑定 Github 新建一个项目并绑定 Fork 的仓库部署在项目部署界面添加环境变量 Environment Variabl ...
