hexo+next 详细搭建
安装node
- node下载地址:http://nodejs.cn/download/
- 具体安装方法,这里不做详写
- 安装完成可以通过node -v 查看安装是否生效和node的版本
- 我这里使用的是v10.15.0版本
github和coding
- 这里对于git的使用,不会详写,具体请自行百度
- github和coding都是git代码管理工具,拥有github pages 服务,可以设置静态服务页面
- github的服务器是在国外,如果用github部署个人博客,访问的响应速度会比较慢
- coding是腾讯云的代码管理工具,本人使用的是这个来部署的(必须企业版coding——团队人数在5人以下是免费的。选择个人版,在搭建https时,https证书可能会有一定的问题)
- 先暂时不用做双线部署(国内访问coding服务,国外访问github服务),如果做成了双线部署,百度站长的https认证,可能会出现问题,原因不详
博客初始化
安装hexo
1
npm i -g hexo
新建存放项目的文件夹
hexo初始化
1
hexo init
查看是否安装成功
1
hexo -v
初始化成功之后,会看到一系列文件夹
- node_modules:是依赖包
- public:存放的是生成的页面
- scaffolds:命令生成文章等的模板
- source:用命令创建的各种文章
- themes:主题
- _config.yml:整个博客的配置
- db.json:source解析所得到的
- package.json:项目所需模块项目的配置信息
将博客绑定到github(非必须)
此处非必须,如果不想绑定github,请往下拉,会有绑定coding的方式
登录github,创建仓库
登录git bash绑定邮箱和用户名
1
2git config --global user.name "你的用户名"
git config --global user.email "你的邮箱地址"创建ssh
输入ssh-keygen -t rsa -C “你的邮箱地址”,找到此目录,C:\Users\你的用户名.ssh
打开该文件夹下的id_rsa.pub文件,获取内容,copygithub setting配置ssh
点击右上角的setting
点击右上角的new ssh key 将id_rsa.pub文件里面的内容全部粘贴进去,不用管格式内容啥的,直接全部粘贴
配置自定义域名解析(非必须)
- 购买域名,无需备案(百度抓取你的个人博客文章链接,最好还是备案一下,有优先权,也容易被录取,否则,录取过程会很慢很慢。没录取就只能通过链接才能访问到你,直接百度搜索,搜索不到你。谷歌录取很快。^_^原谅我不会表述)
- 相关工具,百度搜索,百度站长,谷歌搜索,谷歌站长
- 需要在博客项目的source文件夹下创建一个CNAME的文件(无后缀)
- 然后到域名配置DNS处,添加一条记录类型为CNAME,指向到“用户名.github.io” ,该路径是github静态网站部署后的默认访问路径,也是为什么仓库名称必须是用户名的原因
将博客绑定到coding
- 注册企业版coding,企业版,企业版,企业版,重要的事情说三遍
- 创建项目
- 登录git bash绑定邮箱和用户名
1
2git config --global user.name "你的用户名"
git config --global user.email "你的邮箱地址" - 创建ssh
输入ssh-keygen -t rsa -C “你的邮箱地址”,找到此目录,C:\Users\你的用户名.ssh
打开该文件夹下的id_rsa.pub文件,获取内容,copy - coding 设置添加ssh
点击个人设置
添加公钥,将id_rsa.pub文件里面的内容全部粘贴进去,不用管格式内容啥的,直接全部粘贴 - 配置自定义域名解析(非必须)
- 购买域名,无需备案(百度抓取你的个人博客文章链接,最好还是备案一下,有优先权,也容易被录取,否则,录取过程会很慢很慢。没录取就只能通过链接才能访问到你,直接百度搜索,搜索不到你。谷歌录取很快。^_^原谅我不会表述)
- 相关工具,百度搜索,百度站长,谷歌搜索,谷歌站长
选择刚才新建的项目
新建完成,返回上一步,选择设置
设置后的页面,按照提示,进行域名配置
然后到域名配置DNS处,添加一条记录类型为CNAME,指向到“coding默认给的路径”
我的记录集,没有github的配置,我给删除了
hexo配置和本地启动
打开hexo init 文件中的_config.xml文件
搜索deploy找到内容,修改
1
2
3
4
5deploy:
type: git
repo:
#github: git@github.com:你的用户名/你的用户名.github.io.git,master
coding: git@e.coding.net:你的用户名/你的用户名.git,master此处我的github是注释的,因为我没用该git管理工具
可以找到刚才创建的项目,复制链接,后面拼接,master或者其他分支
- github路径
- coding路径
- github路径
本地运行,启动成功后,默认访问路径:localhost:4000
1
2
3hexo clean
hexo -g
hexo -s上传到服务端运行
1
2
3hexo clean
hexo -g
hexo -d- github访问路径:用户名.github.io
- coding访问路径:创建项目成功之后,会给一个路径,用此路径访问
- 如果配置域名,可以直接用域名访问
主题配置-next
- next下载
- 进入博客项目根目录,打开git bash
- git clone https://github.com/theme-next/hexo-theme-next themes/next
- 配置
- 普通配置:主题下载好之后只需要修改_config.xml
- 修改主题
- 进入根目录下的_config.xml,搜索theme,将值更改为next(下载的主题的文件夹名称)
- 其他
- 注意
- 那里花里胡哨的,本人不推荐使用。页面宠物,音乐插件,随机背景图片等等都是没必要的东西,会造成资源浪费,会很慢
写文章
- 博客建立好之后,就该进入重点了
- 根目录-》source-》_posts 在此文件夹下写文章
- 文章格式为md格式,不熟悉md格式的,可以查看https://www.runoob.com/markdown/md-tutorial.html
- 写好md文章之后,在md文章头部插入
1 |
id: design001 【/访问路径,不设置默认路径是文件夹名称】 |
推荐手动截取文章内容,在首页显示。在想要截取的地方添加
1
<!--more -->
md文章格式,图片展示
md文章格式,效果演示
_config.xml配置
我在这里贴出我的两个_config.xml文件,但是别直接复制,粘贴,只供参考,有一些关于appid和key的私密性东西,我就随便改了一下
例如:Valine评论
主题配置文件的_config.xml
根目录配置文件的_config.xml
个人博客演示地址
关于我
详情查看 博客中的关于
hexo+next 详细搭建的更多相关文章
- Hexo的详细搭建过程——小白的血泪经历QAQ
Hexo的详细搭建过程 环境要求: node.js git 这里提供Centos8.2下的安装过程: dnf module list nodejs dnf module install nodejs: ...
- 可能是最详细的 Hexo + GitHub Pages 搭建博客的教程
前言:博主目前大三,Web 前端爱好者.写博客的好处,不是为了写而写,而是一个记录思想的过程.不要考虑它能带给你什么,而是你自己从中收获了什么. 最近刚好有空,于是就参照网上的各种教程,搭建了一个博客 ...
- 基于Hexo和Github搭建博客
搭建自己的个人博客. 准备工作 确保电脑需要已下载安装node和npm.查看安装是否成功,windows只需在命令行输入以下两条命令即可. 1 2 $ node -v $ npm -v 安装hexo ...
- [原创]HEXO博客搭建日记
博客系统折腾了好久,使用过Wordpress,Ghost,Typecho,其中Typecho是我使用起来最舒心的一种,Markdown编辑+轻量化设计,功能不多不少刚好,着实让我这种强迫症患者舒服了好 ...
- 基于 Hexo + GitHub Pages 搭建个人博客(二)
在 基于 Hexo + GitHub Pages 搭建个人博客(一) 这篇文章中,我们已经知道如何使用 Hexo + GitHub Pages 搭建一个个人博客,GitHub 为我们提供了免费的域名和 ...
- 基于 Hexo + GitHub Pages 搭建个人博客(三)
一.添加扫描二维码关注功能 打开 themes 目录下的 next 主题配置文件,找到 Wechat Subscriber 标签,将该标签下的配置改成如下形式: # Wechat Subscriber ...
- Hexo博客搭建以及Next主题美化的经验之谈
这并不是一篇博客搭建教程.内容主要包含个人对于Hexo博客搭建的心得,Next6.0主题美化的部分建议,以及摘录一些各种用于博客搭建的link. 在博客园3年6个月,确实也学到了很多,博客园也是目前为 ...
- U盘便携式hexo&博客搭建&极速纯净低bug主题推荐&部署到coding&SEO优化搜索
指南:U盘便携式hexo&博客搭建&极速纯净低bug主题推荐&部署到coding&SEO优化搜索 U盘便携式hexo随处写博客 简述:在任意一台联网的电脑上续写he ...
- 强大博客搭建全过程(1)-hexo博客搭建保姆级教程
1. 前言 本人本来使用国内的开源项目solo搭建了博客,但感觉1核CPU2G内存的服务器,还是稍微有点重,包括服务器内还搭建了数据库.如果自己开发然后搭建,耗费时间又比较多,于是乎开始寻找轻量型的博 ...
随机推荐
- ios程序员6级考试(答案和解释)
http://blog.sunnyxx.com/2014/03/06/ios_exam_0_key/ 我是前言 上次发了个ios程序员6级考试题 ,还在不断补充中,开个帖子配套写答案和解释. 1. 下 ...
- 11-2 css盒模型和浮动以及矢量图用法
一 盒模型 1属性 width:内容的宽度 height: 内容的高度 padding:内边距,边框到内容的距离 border: 边框,就是指的盒子的宽度 margin:外边距,盒子边框到附近最近盒子 ...
- QQ 聊天机器人API
QQ机器人是腾讯陆续推出的的人工智能聊天机器人的总称. 都说小Q妹妹聪明好学,我们能够教她说话.也能够请他帮忙查询邮编.手机号,或者解释成语.翻译成语,据说她还会查询手机号码归属地.应用科学计算器. ...
- 2019-8-31-dotnet-通过-WMI-获取系统信息
title author date CreateTime categories dotnet 通过 WMI 获取系统信息 lindexi 2019-08-31 16:55:59 +0800 2019- ...
- selenium webdriver学习(四)------------定位页面元素(转)
selenium webdriver学习(四)------------定位页面元素 博客分类: Selenium-webdriver seleniumwebdriver定位页面元素findElemen ...
- 2018-10-20-WPF-通过位处理合并图片
title author date CreateTime categories WPF 通过位处理合并图片 lindexi 2018-10-20 16:53:49 +0800 2018-10-20 1 ...
- 命名实体识别视频51cto
https://edu.51cto.com/center/course/lesson/index?id=402918 https://edu.51cto.com/course/18466.html
- Linux中ifcfg-eth0配置参数说明
ifcfg-eth0在/etc/sysconfig/network-scripts下, 其配置如下: DEVICE=物理设备名IPADDR=IP地址NETMASK=掩码值NETWORK=网络地址BRO ...
- Java中方法的格式
[修饰符] 返回值类型 方法名([参数类型 形式参数1,参数类型 形式参数2,……]) { 执行语句; [return 返回值;]//需要的话 } 参数列表(参数的类型 ...
- HDU 6709“Fishing Master”(贪心+优先级队列)
传送门 •参考资料 [1]:2019CCPC网络选拔赛 H.Fishing Master(思维+贪心) •题意 池塘里有 n 条鱼,捕捉一条鱼需要花费固定的 k 时间: 你有一个锅,每次只能煮一条鱼, ...