Hexo博客搭建方法是什么

这篇文章主要讲解了"Hexo博客搭建方法是什么"，文中的讲解内容简单清晰，易于学习与理解，下面请大家跟着小编的思路慢慢深入，一起来研究和学习"Hexo博客搭建方法是什么"吧！

本文默认已经安装好git和node.js环境

版本说明：git version 2.16.2.windows.1 、 node.js v8.9.4

Hexo是什么

　　Hexo 是一个快速、简洁且高效的博客框架，这里不多介绍，丢个链接，感兴趣的自己去看吧：Hexo中文官网，里面的东西比较多，不光有hexo使用文档，还有众多的hexo插件和主题。

我的Hexo博客主页效果图

欢迎来访~逸竹小站

安装Hexo

$ npm install -g hexo-cli

建立默认主题博客

$ hexo init blog$ cd blog$ npm install

blog为博客存储文件夹名称，可随意命名，本文以blog为例。最好命名与GitHub Pages仓库名称一致，省的后面修改，不过都是小case

此时打开localhost:4000即可看到默认主题的Hexo博客

选择主题

在官网-主题里面有200+的主题可供选择，我推荐几款个人比较喜欢的

• 简约款

• hexo-theme-next

• maupassant-hexo

• hexo-theme-melody

• 炫酷款

• black-blue

• hexo-theme-nebula

• 实用款

• hexo-theme-pure

应用主题

　　选择好主题后，进入对应的github项目主页，一般都会有README文件帮助完成后续搭建，若无可以参考下面步骤进行，进入之前搭建好的博客主题文件目录下（本文为：blog/themes/），检出主题文件

$ git clone https://github.com/xxxx

　　然后修改博客配置文件_config.yml，添加下面这行

theme: xxx

注意：①xxx为主题名称

②不是主题的配置文件哦，在博客文件夹根目录下

配置文件详解

　　搭建整个博客过程中有两个配置文件，非常重要，一个是博客配置文件，一个是主题配置文件分别存放在各自的根目录下，文件名均为_config.yml

博客配置文件

# Hexo 配置# Sitetitle: Hexo                # Hexo博客网站标题subtitle:               # Hexo博客网站子标题description:    # Hexo博客网站描述keywords:               # Hexo博客关键词author: John Doe      # 作者language:                       # 语言timezone:                       # 时区# URLurl: http://yoursite.com   # 网站网址root: /                                            # 网站根目录permalink: :year/:month/:day/:title/       # 文章永久链接格式permalink_defaults:                     # 永久链接每部分默认值，一般不设置# Directorysource_dir: source         # 资源文件存储目录public_dir: public         # 公共文件夹，静态网站生成目录tag_dir: tags                      # 标签目录archive_dir: archives      # 文章目录category_dir: categories   # 分类目录code_dir: downloads/code   # 代码目录i18n_dir: :lang                    # i18n国际化skip_render:# Writingnew_post_name: :title.md      # 新博客文件名格式default_layout: post               # 默认布局titlecase: false                      # 是否标题小写external_link: true           # 是否在新的标签页打开链接filename_case: 0                   # 转换文件名1：小写，2：大写render_drafts: false               # 显示草稿post_asset_folder: false   # relative_link: false               # 是否是用相对路径作为连接future: true                               # 是否展示未来的文章highlight:                                      # 代码高亮设置  enable: true  line_number: true  auto_detect: false  tab_replace:  # Home page settingindex_generator:                # 主页设置  path: ''                               # 博客根目录  per_page: 10                   # 分页大小  order_by: -date                # 排序，默认日期  # Category & Tagdefault_category: uncategorized    # 默认分类category_map:                   # 分类集合tag_map:                                # 标签集合# Date / Time formatdate_format: YYYY-MM-DD    # 日期格式time_format: HH:mm:ss      # 时间格式# Paginationper_page: 10                       # 分页大小pagination_dir: page       # 分页目录# Extensionstheme: landscape           # 主题# Deploymentdeploy:                                 # 部署  type:                                       # 类别：git

　　主题配置文件，这个是black-blue主题的配置文件，已经比较详细了，直接贴上来了

# >>> Basic Setup | 基础设置 <<<# Header | 主菜单## About Page: `hexo new page about`## Tags Cloud Page: `hexo new page tags`menu:  # 主页: /archives/  所有文章: /archives/  玩转开发工具: /categories/开发工具/  玩转数码: /categories/digital  算法学习: /categories/algorithm  关于我: /about/# 静心阅读: /tags# Link to your avatar | 填写头像地址avatar: /img/avatar.png# Small icon of Your site | 站点小图标地址favicon: /img/favicon.png# 域名是否启用https，如果启用，js文件必须https加载isHttps: true# Social info. Bar | 社交信息展示## Keep "mailto:" in Email | 设置 Email 时保留 "mailto:"## Encrypt email 加密邮件地址 http://ctrlq.org/encode/## RSS requires a plugin to take effect | 使用 RSS 需先安装对应插件## https://github.com/hexojs/hexo-generator-feedsubnav:  github: xxxxx  weibo: xxxxxxxx  rss: /atom.xml  # Google: "#"# search_box: true# >>> Conments 评论系统 <<>> Style Customisation 样式自定义 <<<# Background | 背景## "background_sum": show images form /source/background/的图片数目## "on: true": 自动随机显示这5张图片## "on: false": 自定义显示图片设置background_image: 5background:  on: true  background_sum: 1  background_image: 1highlight_style:  on: true  inline_code: 3  # Value: 0 - 9 可选  code_block: 2  # Value: 0 - 4  # Set inline_code to style highlight text  # Chose a highlight theme for code block  # 通过 inline_code 切换内置文本高亮样式  # 通过 code_block 切换内置代码高亮配色主题blockquote_style:  #on: true  blockquote: 5  # Value: 0 - 7 可选  # 自定义文章「引用部分」的样式# 左边栏宽度 pxleft_col_width: 300# 目录中标题不换行# Keep TOC title on the same line |toc_nowrap: false# 自定义"阅读全文"链接按钮的显示文字# Customize the text on excerpt linkexcerpt_link: 查看更多 #修改more>>的文字# 是否显示边栏中的搜索框（站内搜索）# Search Box in left columnsearch_box: true# 是否开启主页及加载头像时的动画效果# Animation in Homepage and Loading avataranimate: true# >>> Small features | 小功能设置 <<<# 是否开启边栏多标签切换# Birdhouse button in left columntagcloud: true# Blogroll, Link exchange | 友情链接# friends: falsefriends:  csdn: http://blog.csdn.net/baidu_21483933  segmentfault: https://segmentfault.com/blog/maocg_web  简书: http://www.jianshu.com/users/eb37ef89c746/latest_articles#是否开启"关于我"。aboutme: 爱动漫,爱游戏,爱编程,爱运动,爱的太多了!#aboutme: false# 是否在新窗口打开链接open_in_new: false# Customize feed link 自定义订阅地址rss: /atom.xml# >>> Vendors | 第三方工具 & 服务 <<<# images viewer | 图片浏览器## http://www.fancyapps.com/fancybox/fancybox: true# Display Math(LaTeX, MathML...) | 数学公式支持## https://www.mathjax.org/mathjax: false# Socail Share | 是否开启分享# share: truebaidushare: true#showshare: true# 百度、谷歌站长验证。填写 HTML 标签 content# Site Verification for Google and Baidu. HTML label content.# google_site: # pFW527fHrjfI0si2w4NQ0w3cTw12AvvuohAu1PUfqKA# baidu_site: #c167b9feb4f0b208b712c79629c188e4# Fill in Google Analytics tracking ID, #e.g. UA-XXXXX-X, or Baidu Analytics hash keygoogle_analytics: xxxxxbaidu_analytics: xxxxxx# 不蒜子网站计数设置# http://ibruce.info/2015/04/04/busuanzi/visit_counter:  on: true  site_visit: 极客到访数  page_visit: 本页阅读量# A标签提示TipTitle: true# Loading# Loading: true

日常产出博客

写作

新建文章

$ hexo new [layout]