一、准备工作
npm镜像
使用方法(三种办法任意一种都能解决问题,建议使用第三种,将配置写死,下次用的时候配置还在):
1.通过config命令
npm config set registry https://registry.npm.taobao.org
npm info underscore (如果上面配置正确这个命令会有字符串response)
2.命令行指定
npm –registry https://registry.npm.taobao.org info underscore
3.编辑 ~/.npmrc 加入下面内容
registry = https://registry.npm.taobao.org
二、安装
npm install hexo-cli -g
hexo init
npm install
hexo s
4000端口有没有被占用
netstat -an|findstr 4000
三、可能遇到的问题
上述步骤完成后,hexo的配置已经基本完成,可以执行hexo server,然后访问localhost:4000查看效果。(hexo默认的端口号是4000,但是4000端口如果被其他进程占用的话,这时访问localhost:4000会得不到响应。如果你的电脑安装了福昕阅读器,就是他,没错,坑爹吧!!!!解决这个问题的方法是指定其他的端口hexo server -p 4099,访问localhost:4099)
如果还不行,再试一下:
记住:是下面2个横杠哦
npm install hexo-server --save
Q:如何卸载Hexo?
A:3.0.0版本执行npm uninstall hexo-cli -g,之前版本执行npm uninstall hexo -g。
Q:如何安装旧版本Hexo?
A:先卸载当前版本,以2.8.3为例,执行npm install hexo@2.8.3 -g,再初始化并安装依赖和插件。
四、hexo官网文档
https://hexo.io/zh-cn/docs/index.html
五、主题
推荐三个主题:
yilia主题
git clone https://github.com/litten/hexo-theme-yilia.git themes/yilia
next主题
- git clone https://github.com/iissnan/hexo-theme-next themes/next
使用说明:
http://theme-next.iissnan.com/getting-started.html#leanclound-page-views
大道至简主题
git clone https://github.com/tufu9441/maupassant-hexo.git themes/maupassant
npm install hexo-renderer-jade --save
pm install hexo-renderer-sass --save
这个博客不错
http://opiece.me/2016/03/12/concise-to-next/
自动发布
http://notes.iissnan.com/2016/publishing-github-pages-with-travis-ci/
六、yml文件在线校验器
七、头像:
http://chuantu.biz/t5/44/1482477270x1926756903.jpg
免费的图片上传网站:
http://www1.freep.cn/
http://www.chuantu.biz/upload.php
八、草稿相当于很多博客都有的“私密文章”功能。
$ hexo new draft “new draft”
如果你希望强行预览草稿,更改配置文件:
render_drafts: true
或者,如下方式启动server:
$ hexo server –drafts
下面这条命令可以把草稿变成文章,或者页面:
$ hexo publish [layout]
域名绑定
http://www.jianshu.com/p/863f3f2d1733
上传图片
1、首先确认_config.yml中有:
post_asset_folder: true
2、在blog要目录下,即_config.yml站点文件下,打开命令git bash,并执行:
$ npm install https://github.com/CodeFalling/hexo-asset-image --save
3、即可在hexo generate时正确生成插入图片。
_posts
|- post1.md
|_ post1
|- pic1.png
4、在md文件中插入图片时只需写
问题 “Deployer not found: github”
npm install hexo-deployer-git --save
九、hexo目录结构
├── _config.yml // 主题配置文件
├── languages // 多语言文件夹
├── layout
│ ├── archive.swig // 存档页模板
│ ├── category.swig // 分类文章列表页模板
│ ├── includes // 各页面共享的模板
│ │ ├── layout.swig // 页面布局模板,其它的页面模板都是根据它扩展来的
│ │ ├── pagination.swig // 翻页按钮模板
│ │ └── recent-posts.swig // 文章列表模板
│ ├── index.swig // 首页模板
│ ├── page.swig // 页面详情页模板
│ ├── post.swig // 文章详情页模板
│ └── tag.swig // 标签文章列表页模板
└── source
├── css
│ └── theme.styl // 主题自定义 CSS 文件
├── favicon.ico
└── js
└── theme.js // 主题 JavaScript 文件
十、git源文件和deploy文件分开的话。
hexo两台电脑维护同一博客的大概流程:
在初始一台电脑上搭建hexo博客(搭建流程见github+hexo大概流程),搭建完后上传本地的hexo到github或其他远程代码托管平台。(这里上传的是hexo所用到的东西,不用上传node_modules,public 这种自动生成的)
在第二台电脑上把hexo原始文件clone到本地
在第二台电脑上同样安装hexo用的东西(见github+hexo大概流程)
在第二台电脑上clone下来的代码中执行(不能执行hexo init)
npm install
如果提示没有其它插件,则做相应的安装:
npm install hexo-server --save
npm install hexo-deployer-git --save
npm install hexo-renderer-ejs --save
npm install hexo-renderer-stylus --save
npm install hexo-renderer-marked --save
这个时候再重新生成静态文件,命令:
hexo generate (或hexo g)
启动本地服务器:
hexo server (或hexo s)
———————————————-
本地文件自己备一下:
我用的是next主题
主站文件_config.yml:
# Hexo Configuration
## Docs: https://hexo.io/docs/configuration.html
## Source: https://github.com/hexojs/hexo/
# Site
title: painArthur's blog
subtitle: Did you get what you want?
description: A good life is one inspired by love and guided by knowledge.
author: arthur.dy.lee
language: zh-Hans
timezone:
# URL 网址
## 如果您的网站存放在子目录中,例如 http://yoursite.com/blog,则请将您的 url 设为 http://yoursite.com/blog 并把 root 设为 /blog/。
url: http://willxue.top
permalink: :year/:month/:day/:title/ #生成文件名字的格式我改成blog/:title:year:month:day/
permalink_defaults:
# Directory 目录配置
source_dir: source #源文件夹,这个文件夹用来存放内容。
public_dir: public #公共文件夹,这个文件夹用于存放生成的站点文件。
tag_dir: tags #标签文件夹
archive_dir: archives #归档文件夹
category_dir: categories #分类文件夹
code_dir: downloads/code #nclude code 文件夹
i18n_dir: :lang #国际化(i18n)文件夹
skip_render: #跳过指定文件的渲染,您可使用 glob 表达式来匹配路径。
# Writing 文章
new_post_name: :title.md # 新建文章默认文件名
default_layout: post # 默认布局
titlecase: false # Transform title into titlecase
external_link: true # 在新标签中打开一个外部链接,默认为true
filename_case: 0 #转换文件名,1代表小写;2代表大写;默认为0,意思就是创建文章的时候,是否自动帮你转换文件名,默认就行,意义不大。
render_drafts: false #是否渲染_drafts目录下的文章,默认为false
post_asset_folder: false #启动 Asset 文件夹
relative_link: false #把链接改为与根目录的相对位址,默认false
future: true #显示未来的文章,默认false
highlight: #代码块的设置
enable: true
line_number: true
auto_detect: false
tab_replace:
# Category & Tag 分类和标签的设置
default_category: coding #默认分类
category_map: #分类别名
编程: coding
生活: life
tag_map: #标签别名
音乐: music
美文: beatiful article
spring: spring
多线程: concurrent
java: javaCore
工具: tool
# Date / Time format
## Hexo uses Moment.js to parse and display date
## You can customize the date format as defined in
## http://momentjs.com/docs/#/displaying/format/
date_format: YYYY-MM-DD
time_format: HH:mm:ss
# Pagination 分页
## Set per_page to 0 to disable pagination
per_page: 10 #每页显示的文章量 (0 = 关闭分页功能)
pagination_dir: page #分页目录
# Extensions
## Plugins: https://hexo.io/plugins/
## Themes: https://hexo.io/themes/
theme: next
feed:
type: atom #feed 类型 (atom/rss2)
path: atom.xml #rss 路径
limit: 20 #在 rss 中最多生成的文章数(0显示所有)
# Deployment
## Docs: https://hexo.io/docs/deployment.html
deploy:
type: git
repo: git@github.com:paincupid/paincupid.github.io.git
主题_config.yml文件
# ---------------------------------------------------------------
# Site Information Settings
# ---------------------------------------------------------------
# Put your favicon.ico into `hexo-site/source/` directory.
favicon: /favicon.ico
# Set default keywords (Use a comma to separate)
keywords: "Hexo, NexT"
# Set rss to false to disable feed link.
# Leave rss as empty to use site's feed link.
# Set rss to specific value if you have burned your feed already.
rss: false
# Specify the date when the site was setup
since: 2016
# icon between year and author @Footer
authoricon: heart
# Footer `powered-by` and `theme-info` copyright
copyright: true
# Canonical, set a canonical link tag in your hexo, you could use it for your SEO of blog.
# See: https://support.google.com/webmasters/answer/139066
# Tips: Before you open this tag, remeber set up your URL in hexo _config.yml ( ex. url: http://yourdomain.com )
canonical: true
# Change headers hierarchy on site-subtitle (will be main site description) and on all post/pages titles for better SEO-optimization.
seo: false
# ---------------------------------------------------------------
# Menu Settings
# ---------------------------------------------------------------
# When running the site in a subdirectory (e.g. domain.tld/blog), remove the leading slash (/archives -> archives)
menu:
home: /
archives: /archives
#about: /about
categories: /categories
tags: /tags
#search: /search
#commonweal: /404.html
# Enable/Disable menu icons.
# Icon Mapping:
# Map a menu item to a specific FontAwesome icon name.
# Key is the name of menu item and value is the name of FontAwsome icon. Key is case-senstive.
# When an question mask icon presenting up means that the item has no mapping icon.
menu_icons:
enable: true
#KeyMapsToMenuItemKey: NameOfTheIconFromFontAwesome
home: home
about: user
categories: th
schedule: calendar
tags: tags
archives: archive
sitemap: sitemap
commonweal: heartbeat
# ---------------------------------------------------------------
# Scheme Settings
# ---------------------------------------------------------------
# Schemes
# scheme: Muse
scheme: Mist
#scheme: Pisces
# ---------------------------------------------------------------
# Font Settings
# - Find fonts on Google Fonts (https://www.google.com/fonts)
# - All fonts set here will have the following styles:
# light, light italic, normal, normal intalic, bold, bold italic
# - Be aware that setting too much fonts will cause site running slowly
# - Introduce in 5.0.1
# ---------------------------------------------------------------
font:
enable: true
# Uri of fonts host. E.g. //fonts.googleapis.com (Default)
host:
# Global font settings used on <body> element.
global:
# external: true will load this font family from host.
external: true
family: Lato
# Font settings for Headlines (h1, h2, h3, h4, h5, h6)
# Fallback to `global` font settings.
headings:
external: true
family:
# Font settings for posts
# Fallback to `global` font settings.
posts:
external: true
family:
# Font settings for Logo
# Fallback to `global` font settings.
# The `size` option use `px` as unit
logo:
external: true
family:
size:
# Font settings for <code> and code blocks.
codes:
external: true
family:
size:
# ---------------------------------------------------------------
# Sidebar Settings
# ---------------------------------------------------------------
# Social Links
# Key is the link label showing to end users.
# Value is the target link (E.g. GitHub: https://github.com/iissnan)
social:
csdn: http://blog.csdn.net/paincupid
oschina: https://git.oschina.net/paincupid
# Social Links Icons
# Icon Mapping:
# Map a menu item to a specific FontAwesome icon name.
# Key is the name of the item and value is the name of FontAwsome icon. Key is case-senstive.
# When an globe mask icon presenting up means that the item has no mapping icon.
social_icons:
enable: true
# Icon Mappings.
# KeyMapsToSocalItemKey: NameOfTheIconFromFontAwesome
GitHub: github
Twitter: twitter
Weibo: weibo
# Sidebar Avatar
# in theme directory(source/images): /images/avatar.jpg
# in site directory(source/uploads): /uploads/avatar.jpg
avatar: http://chuantu.biz/t5/44/1482477270x1926756903.jpg
# Table Of Contents in the Sidebar #文章自动显示目录
toc:
enable: true
# Automatically add list number to toc.
number: true
# Creative Commons 4.0 International License.
# http://creativecommons.org/
# Available: by | by-nc | by-nc-nd | by-nc-sa | by-nd | by-sa | zero
#creative_commons: by-nc-sa
#creative_commons:
sidebar:
# Sidebar Position, available value: left | right
position: left
#position: right
# Sidebar Display, available value:
# - post expand on posts automatically. Default.
# - always expand for all pages automatically
# - hide expand only when click on the sidebar toggle icon.
# - remove Totally remove sidebar including sidebar toggler.
display: post
#display: always
#display: hide
#display: remove
# Blogrolls
#links_title: Links
#links_layout: block
#links_layout: inline
#links:
#Title: http://example.com/
# ---------------------------------------------------------------
# Post Settings
# ---------------------------------------------------------------
# Automatically scroll page to section which is under <!-- more --> mark.
scroll_to_more: true
# Automatically excerpt description in homepage as preamble text.
excerpt_description: true
# Automatically Excerpt. Not recommand.
# Please use <!-- more --> in the post to control excerpt accurately.
auto_excerpt:
enable: true
length: 200
# Post meta display settings
post_meta:
item_text: true
created_at: true
updated_at: false
categories: true
# Wechat Subscriber
#wechat_subscriber:
#enabled: true
#qcode: /path/to/your/wechatqcode ex. /uploads/wechat-qcode.jpg
#description: ex. subscribe to my blog by scanning my public wechat account
# ---------------------------------------------------------------
# Misc Theme Settings
# ---------------------------------------------------------------
# Custom Logo.
# !!Only available for Default Scheme currently.
# Options:
# enabled: [true/false] - Replace with specific image
# image: url-of-image - Images's url
custom_logo:
enabled: false
image:
# Code Highlight theme
# Available value:
# normal | night | night eighties | night blue | night bright
# https://github.com/chriskempson/tomorrow-theme
highlight_theme: normal
# ---------------------------------------------------------------
# Third Party Services Settings
# ---------------------------------------------------------------
# MathJax Support
mathjax:
enable: true
per_page: true
cdn: //cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML
# Swiftype Search API Key
#swiftype_key:
# Baidu Analytics ID
baidu_analytics: 840d145f6ce561830c81a4c79487e67a
# Duoshuo ShortName
duoshuo_shortname: painarthur
# Disqus
#disqus_shortname:
# Hypercomments
#hypercomments_id:
# Gentie productKey
#gentie_productKey:
# Baidu Share
# Available value:
# button | slide
# Warning: Baidu Share does not support https.
#baidushare:
## type: button
# Share
#jiathis:
# Warning: JiaThis does not support https.
add_this_id: ra-5860e1dc2fe90e0e
# Share
duoshuo_share: true
# Google Webmaster tools verification setting
# See: https://www.google.com/webmasters/
google_site_verification: QGI59huOsh0Ym4WeP5tQOosSvbX5FzIoYdN8kysRx2I
# Google Analytics
google_analytics: UA-89476840-1
# CNZZ count
#cnzz_siteid:
# Application Insights
# See https://azure.microsoft.com/en-us/services/application-insights/
# application_insights:
# Make duoshuo show UA
# user_id must NOT be null when admin_enable is true!
# you can visit http://dev.duoshuo.com get duoshuo user id.
duoshuo_info:
ua_enable: true
admin_enable: false
user_id: 0
#admin_nickname: Author
# Facebook SDK Support.
# https://github.com/iissnan/hexo-theme-next/pull/410
facebook_sdk:
enable: false
app_id: #<app_id>
fb_admin: #<user_id>
like_button: #true
webmaster: #true
# Facebook comments plugin
# This plugin depends on Facebook SDK.
# If facebook_sdk.enable is false, Facebook comments plugin is unavailable.
facebook_comments_plugin:
enable: false
num_of_posts: 10 # min posts num is 1
width: 100% # default width is 550px
scheme: light # default scheme is light (light or dark)
# Show number of visitors to each article.
# You can visit https://leancloud.cn get AppID and AppKey.
leancloud_visitors:
enable: false
app_id: #<app_id>
app_key: #<app_key>
# Show PV/UV of the website/page with busuanzi.
# Get more information on http://ibruce.info/2015/04/04/busuanzi/
busuanzi_count:
# count values only if the other configs are false
enable: false
# custom uv span for the whole site
site_uv: true
site_uv_header: <i class="fa fa-user"></i>
site_uv_footer:
# custom pv span for the whole site
site_pv: true
site_pv_header: <i class="fa fa-eye"></i>
site_pv_footer:
# custom pv span for one page only
page_pv: true
page_pv_header: <i class="fa fa-file-o"></i>
page_pv_footer:
# Tencent analytics ID
tencent_analytics: 60149125
# Enable baidu push so that the blog will push the url to baidu automatically which is very helpful for SEO
baidu_push: false
# Google Calendar
# Share your recent schedule to others via calendar page
#
# API Documentation:
# https://developers.google.com/google-apps/calendar/v3/reference/events/list
calendar:
enable: false
calendar_id: <required>
api_key: <required>
orderBy: startTime
offsetMax: 24
offsetMin: 4
timeZone:
showDeleted: false
singleEvents: true
maxResults: 250
# Algolia Search
algolia_search:
enable: false
hits:
per_page: 10
labels:
input_placeholder: Search for Posts
hits_empty: "We didn't find any results for the search: ${query}"
hits_stats: "${hits} results found in ${time} ms"
#! ---------------------------------------------------------------
#! DO NOT EDIT THE FOLLOWING SETTINGS
#! UNLESS YOU KNOW WHAT YOU ARE DOING
#! ---------------------------------------------------------------
# Motion
use_motion: true
# Fancybox
fancybox: true
# Script Vendors.
# Set a CDN address for the vendor you want to customize.
# For example
# jquery: https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js
# Be aware that you should use the same version as internal ones to avoid potential problems.
# Please use the https protocol of CDN files when you enable https on your site.
vendors:
# Internal path prefix. Please do not edit it.
_internal: lib
# Internal version: 2.1.3
jquery:
# Internal version: 2.1.5
# See: http://fancyapps.com/fancybox/
fancybox:
fancybox_css:
# Internal version: 1.0.6
# See: https://github.com/ftlabs/fastclick
fastclick:
# Internal version: 1.9.7
# See: https://github.com/tuupola/jquery_lazyload
lazyload:
# Internal version: 1.2.1
# See: http://VelocityJS.org
velocity:
# Internal version: 1.2.1
# See: http://VelocityJS.org
velocity_ui:
# Internal version: 0.7.9
# See: https://faisalman.github.io/ua-parser-js/
ua_parser:
# Internal version: 4.6.2
# See: http://fontawesome.io/
fontawesome:
# Internal version: 1
# https://www.algolia.com
algolia_instant_js:
algolia_instant_css:
# Assets
css: css
js: js
images: images
# Theme version
version: 5.1.0