Hexo-NexT 博客构建指南
Hexo-NexT 博客构建
WuGenQiang
这个作者很懒,什么都没留下…
展开
-
Hexo NexT 评论系统 Valine 的使用
文章目录评论系统 Valine 的使用1 Valine 的介绍2 Valine 的使用3 Valine 的配置4 Valine 的优化4.1 去除 Valine的 Powered By4.2 邮件通知功能4.2.1 原邮箱模板通知功能4.2.2 Valine-Admin 通知功能4.3 实现评论显示 QQ 邮箱头像4.3.1 下载 Valine.min.js4.3.2 增加 QQ 头像判别4.4 ...原创 2020-04-25 09:33:21 · 4679 阅读 · 6 评论 -
使用 Github 空间搭建 Hexo 技术博客——Hexo NexT主题内网站运行时间的设置(十)
网站运行时间的设置在前面提及到footer.swig中修改,添加以下代码E:\work\myblog\themes\next\layout\_partials\footer.swig<!-- 网站运行时间的设置 --><span id="timeDate">载入天数...</span><span id="times">载入时分秒.....原创 2019-03-10 11:39:40 · 2020 阅读 · 0 评论 -
IDEA通过插件安装Gitee并clone项目
一、前言在最新插件版本: 2018.3.1.(2019-01-10 发布)中码云 IDEA 插件已经由gitosc更名为gitee。同时值得注意的是:新版插件gitee菜单已经和git菜单合并。二、安装插件1. 通过“插件管理”安装启动 IDEA,在启动界面选择菜单Configure-Plugins在弹出的插件市场中搜索关键字Gitee,在搜索结果中找到Gitee插件,点击Instal...原创 2019-04-08 17:48:46 · 9441 阅读 · 1 评论 -
hexo-next主题添加近期文章版块
{% if theme.recent_posts %} <div class="links-of-blogroll motion-element {{ "links-of-blogroll-" + theme.recent_posts_layout }}"> <div class="links-of-blogroll-title"> ...原创 2019-03-15 18:48:33 · 1985 阅读 · 2 评论 -
使用 Github 空间搭建 Hexo 技术博客——Hexo NexT主题中添加网页音乐播放器功能(十六)
为博客添加网页音乐播放器功能download点击访问Aplayer源码:GitHub Aplayer。下载到本地,解压后将dist文件夹复制到themes\next\source文件夹下。music.js新建themes\next\source\dist\music.js文件,添加内容:const ap = new APlayer({ container: docum...原创 2019-03-13 20:23:41 · 1018 阅读 · 0 评论 -
使用 Github 空间搭建 Hexo 技术博客——分享使用HexoEditor写博客(十五)
如果说hexo-myadmin是简约之美,HexoEditor就是很富余之美,很饱满,修改我喜欢简约,写文章代码我喜欢预览,预览是一种习惯,两者都在用,值得推荐而且HexoEditor 太好用了,大大方便了写博客的效率。比如一键上传博客图片,让我省的打开腾讯云客户端手动上传和建立文件夹了。现在我要记录以下日常使用中一些经常用到的操作。1.介绍HexoEditor是 Github 上一...原创 2019-03-11 22:21:26 · 1773 阅读 · 0 评论 -
使用 Github 空间搭建 Hexo 技术博客——分享一个类似hexo admin的hexo文章管理插件hexo-myadmin(十四)
hexo-myadmin推荐理由:轻巧方便,只有 post 和 page 添加删除修改这几个简单的功能 ,而且用的是一些轻量级的库,容易理解和接受1.安装hexo-myadmin的插件npm i hexo-myadmin --save2.启动服务hexo server3.测试登录,网页输入localhost:4000/admin自动跳转到下图显示页面即...原创 2019-03-11 20:58:30 · 1113 阅读 · 1 评论 -
使用 Github 空间搭建 Hexo 技术博客——Hexo NexT主题内增加留言板块功能(十三)
还没实现:留言让博客看起来更加的人性化NexT 主题官网有给出添加标签页、分类页的方法,其实添加留言本的方式异曲同工。方式稍微会有一点不同。一、添加留言本 page进入到博客的根目录,运行命令:hexo new page guestbook二、留言本页面中添加多说访客代码上一步中使用 hexo 命令新建了一个 page,进入到博客的source目录,里面会多了一个gu...原创 2019-03-11 00:01:33 · 853 阅读 · 0 评论 -
使用 Github 空间搭建 Hexo 技术博客——Hexo NexT主题内添加小优化(十二)
1.网站底部字数统计切换到根目录下,然后运行如下代码npm install hexo-wordcount --save然后在/themes/next/layout/_partials/footer.swig文件尾部加上:<div class="theme-info"> <div class="powered-by"></div> &l...原创 2019-03-10 21:40:27 · 502 阅读 · 0 评论 -
使用 Github 空间搭建 Hexo 技术博客——Hexo NexT主题内添加pdf 插件(十一)
需求:希望能在GitHub搭建的博客中上传本地PDF文件,同时提供下载功能。一、安装插件npm install --save hexo-pdfnext/_config.yml中修改此处:打开pdfpdf: enable: true # Default height height: 500px pdfobject: # Use 2.1.1 as def...原创 2019-03-10 13:50:49 · 2156 阅读 · 0 评论 -
使用 Github 空间搭建 Hexo 技术博客——Hexo NexT主题内设置可爱的动漫小人(九)
1.安装模块hexo博客根目录选择cmd命令窗口或者git bash输入以下代码,安装插件npm install --save hexo-helper-live2d各种模型展示live2d-widget-model-haru/02 (use npm install --save live2d-widget-model-haru)live2d-widget-model-har...原创 2019-03-10 10:40:16 · 1703 阅读 · 3 评论 -
使用 Github 空间搭建 Hexo 技术博客——Hexo NexT主题内添加点击爱心效果(八)
1.在next/source/js/src文件下创建clicklove.js,加入以下代码!function(e,t,a){function n(){c(".heart{width: 10px;height: 10px;position: fixed;background: #f00;transform: rotate(45deg);-webkit-transform: rotate(45d...原创 2019-03-10 10:18:01 · 407 阅读 · 0 评论 -
使用 Github 空间搭建 Hexo 技术博客——Hexo NexT主题内添加相册功能(七)
给博客添加一个相册页面,以展示自己拍摄的一些照片 (≖ᴗ≖)✧一、说明:在github上新建一个仓库,主要用于存储图片,可以通过url访问到,也方便管理 将要放到相册的图片处理成json格式的数据,然后进行访问,这里json的格式需要配合要使用的样式,所以需要处理成特定格式的json数据,下面会给出 图片裁剪,因为相册显示的样式最好是正方形的的图片,这里使用脚本处理一下 图片压缩,相...原创 2019-03-10 03:34:28 · 693 阅读 · 1 评论 -
使用 Github 空间搭建 Hexo 技术博客——整合优秀的ideas打造炫酷的NexT主题(六)
配置1.友情链接在next/_config.yml下搜索# Blog rollslinks_icon: link #图标links_title: 友情链接 #表示Titlelinks_layout: block#links_layout: inlinelinks: #打开 EnjoyToShare: https://wugenqiang.github.i...原创 2019-03-10 02:36:51 · 415 阅读 · 0 评论 -
使用 Github 空间搭建 Hexo 技术博客——使用NexT优化博客(五)
一.主题安装1.安装next主题在项目根目录下,我的项目是e:/work/myblog,打开Git Bash Here执行以下命令git clone https://github.com/theme-next/hexo-theme-next themes/next2.将Hexo的主题切换为next主题在项目根目录下打开_config.yml文件将theme设置为next即...原创 2019-03-10 00:32:22 · 1045 阅读 · 0 评论 -
使用 Github 空间搭建 Hexo 技术博客——熟悉博客(四)
1.网站参数 描述 title 网站标题 subtitle 网站副标题 description 网站描述 author 您的名字 language 网站使用的语言 timezone 网站时区。Hexo 默认使用您电脑的时区。时区列表。比如说:America/New_York,Japan, 和UTC。 例如:我的Hexo...原创 2019-03-10 00:19:39 · 503 阅读 · 0 评论 -
使用 Github 空间搭建 Hexo 技术博客——博客上传到我们的GitHub服务器(三)
1.GitHub创建repositories进入GitHub官网,或者在浏览器输入https://github.com/,如果还没有账号就创建一个账号就好了,这里不教大家怎么注册账号了。登录自己的账号,直接点击new repositories或者进入You repositories再new repositories进入到创建repositories页面来,这里很重要,一定要注意哦!必须将新...原创 2019-03-09 23:47:40 · 735 阅读 · 0 评论 -
使用 Github 空间搭建 Hexo 技术博客——创建Hexo+Github博客项目(二)
1.创建 Hexo 项目现在假设我要创建一个名为 myblog 的项目,项目目录就放在:e:/work/ 目录下,所以我们在 e:/work/目录下创建一个 myblog 目录。现在这个项目的全路径是:e:/work/myblog 打开 Git Bash: 进入该目录:cde:/work/myblog 然后执行:hexo init,这个时间也会比较长,也有可能要等几分钟,有显示 WAR...原创 2019-03-09 23:14:02 · 643 阅读 · 0 评论 -
Hexo博客NexT主题开启文章目录和调整样式
一、前言Hexo博客NexT主题中是有目录的,只是在默认情况下没有开启,需要我们来手动开启。二、修改样式文件custom.styl文章目录样式文件custom.styl文件位于themes/next/source/css/_custom打开后添加内容:1.文章目录默认展开//文章目录默认展开.post-toc .nav .nav-child { display: block; }...原创 2019-03-16 23:56:24 · 12333 阅读 · 21 评论 -
Hexo博客绑定个人域名
请参考我的博客:https://wugenqiang.gitee.io/articles/hexo-do-domain.html原创 2019-04-04 20:45:46 · 1098 阅读 · 0 评论 -
Hexo博客自定义域名开启HTTPS
请参考我的博客:https://wugenqiang.gitee.io/articles/hexo-do-https.html原创 2019-04-04 20:48:10 · 803 阅读 · 0 评论 -
PicGo+GitHub图床,让Markdown飞起
详情到我的博客浏览:PicGo+GitHub图床,让Markdown飞起PicGo介绍这是一款图片上传的工具,目前支持微博图床,七牛图床,腾讯云,又拍云,GitHub等图床,未来将支持更多图床。所以解决问题的思路就是,将本地的文件,或者剪切板上面的截图发送图床,然后生成在线图片的链接,这样就可以让Markdown文档飞起来了,走到哪就可以用到哪~~在众多的图床中,我选择的GitHub图床...原创 2019-03-31 17:22:25 · 2590 阅读 · 3 评论 -
Markdown功能点讲解
详情到请浏览:Markdown功能点讲解提起Markdown,对我来说是毕设、是项目、是不可多得的助手。基础语法标题Markdown支持6种级别的标题,对应html标签 h1 ~ h6# h1## h2### h3#### h4##### h5###### h6段落及区块引用Markdown提供了一个特殊符号 > 用于段首进行强调,被强调的文字部分将会高亮显示...原创 2019-03-31 17:25:03 · 1042 阅读 · 0 评论 -
Coding+Github双服务器托管Hexo
写在前面其实之前是用的wordpress在阿里云上挂着。觉得Hexo好像更符合现在我的审美,so, do it! 所以我选择了Hexo部署优化Hexo这一步我之前写过,在这里我就不详细赘述了啊Hexo+NexT拥抱舒爽创建Github公开库Hexo博客上传至Github创建Coding公开库创建腾讯云开发者平台(或Coding)公开库,因为目前两家公司战略合作,现在共用了...原创 2020-04-07 18:49:36 · 661 阅读 · 1 评论 -
Hexo的NexT主题打赏功能
准备支付宝和微信二维码首先要生成支付宝和微信收钱二维码在_config.yml中配置图片wechat.jpg、alipay.jpg图片放入themes/next/source/images中reward: enable: true #打赏功能 comment: 原创技术分享,您的支持将鼓励我继续创作 wechatpay: /images/wechat.jpg alipa...原创 2019-04-05 18:18:23 · 2449 阅读 · 0 评论 -
DaoVoice实现在线联系
绝佳的用户沟通工具注册登录DaoVoice注册登录地址如下:http://www.daovoice.io/官网进行注册,需要邀请码: b6dbddb6 复制粘贴就可以了~!或者通过下面链接进入:http://dashboard.daovoice.io/get-started?invite_code=b6dbddb6复制粘贴代码修改的hexo的文件路劲如下: themes/nex...原创 2019-04-06 13:32:41 · 1660 阅读 · 1 评论 -
Hexo文章中图片点击实现全屏查看
写在前面方法一存在图片放大后不美观,建议直接跳到方法二如果想尝试解决第一种方法出现的Bug,可以尝试一下,然后我们讨论一下,方便的话可以加我QQ:2422676183方法一修改post-details.js文件文件目录:/themes/next/source/js/src/post-details.js在文件最后添加://----自定义js----------------funct...原创 2019-04-06 16:36:26 · 4087 阅读 · 2 评论 -
Git命令手动备份Hexo博客源文件
一、前言自从接触了Hexo+NexT之后,发现离不开了,以后有能力的时候一定重新架构一下,使得更加个性化,最大程度的满足我们对于软件的需求,大家都知道,如果写东西在本地的话,最怕的应该就是更换电脑,还要重新搭建博客了,所以备份对于我们来说特别重要!备份博客就是本篇博客文章的主旨了,一定要攻下这座城堡。我曾经看过Git备份Hexo博客源文件的方式,所以在这里记录一下……二、方案想到的解决办...原创 2019-04-11 11:25:24 · 524 阅读 · 0 评论 -
自动备份Hexo博客源文件
一、前言自从接触了Hexo+NexT之后,发现离不开了,以后有能力的时候一定重新架构一下,使得更加个性化,最大程度的满足我们对于软件的需求,大家都知道,如果写东西在本地的话,最怕的应该就是更换电脑,还要重新搭建博客了,所以备份对于我们来说特别重要!备份博客就是本篇博客文章的主旨了,一定要攻下这座城堡。我曾经看过Git备份Hexo博客源文件的方式,这种方式虽然能够备份Hexo博客的源文件,但是对...原创 2019-04-11 11:49:09 · 948 阅读 · 1 评论 -
使用 Github 空间搭建 Hexo 技术博客——基于windows下环境部署(一)
Hexo 是一个基于 Node.js 快速、简洁且高效的博客框架,可以将 Markdown 文件快速的生成静态网页,托管在 GitHub Pages 上。1. 搭建所需软件各个软件官网: git:http://git-scm.com/ node.js:http://nodejs.org/ 2. 部署安装git和node.js(1)安装git,输入:git --version ...原创 2019-03-09 22:59:14 · 595 阅读 · 0 评论