hexo+coding静态博客搭建和配置

git安装

在官网下载对应版本号安装便可git官网下载地址css

node环境安装

node下载地址html

hexo安装

在git bash中输入如下命令:node

$ npm install hexo-cli -g

再建立一个hexo文件夹,在该文件夹目录下初始化hexo:如下指令都在hexo文件夹下git bashgit

$ hexo init

安装依赖包github

$ npm install

安装git插件chrome

$ npm install hexo-deployer-git --save

加载静态资源和开启服务器npm

$ hexo g&&hexo d

http://localhost:4000/ 便可访问本地博客浏览器

coding配置

由于github Pages来做为博客有时候访问比较慢,因此使用国内coding Pages做为博客搭建bash

Coding上建立项目coding官网,注册完毕首页点击建立项目服务器

clipboard.png

配置SSH Key(咱们使用SSH方式访问仓库)

ssh-keygen -t rsa -b 4096 -C "your_email@example.com"

# your_email@example.com 替换为你本身的邮箱
# 过程当中须要输入密码等操做,能够所有回车使用默认的

完成以后,C:UsersAdministrator下会多一个.ssh文件夹,里面包含id_rsa和id_rsa.pub两个文件,复制id_rsa.pub中的内容,返回到coding主页->帐户->SSH 公钥配置便可,公钥随意,勾选长久有效,返回coding项目中复制以前建立项目的ssh,点击代码能够查看到。

配置文件的修改

修改_config.yml文件

新增访问仓库的路径

deploy:
  type: git
  repo: 项目的ssh
  branch: master

修改主题,把喜欢的主题下载下来,好比用比较热门的next

$ git clone https://github.com/iissnan/hexo-theme-next themes/next

修改:theme: next

基本信息填充

title:xx(标题)
subtitle:xx(副标题)
description:xx(详情)
author:xx(做者)
language:zh-Hans(中文)

具体设置其余参数如:头像、其余论坛帐号等 next官网

注意点

root:须要改为 /xx/ xx为你的coding项目名,否则上线会出现js、css路径问题

上传项目

$ hexo g&&hexo d

即便用http://用户名.coding.me/项目名 便可访问线上的博客

拓展

  1. 新建文字:在项目的source/_posts中能够建立md或者new执行来新建一篇文章

  2. 编辑md文件:下载sublime的liveload插件和chrome浏览器的liveload插件,在$ hexo
    s状况下修改md文件,便可实时查看本地博客的编写效果

  3. 加入本身项目:能够在source文件夹中放入本身项目的文件夹,便可查看本身的html文件,不过hexo会对source文件下的进行渲染,因此须要设置,跳过渲染,这样不会出现js渲染错误的问题。

skip_render:
  - 自定义文件夹/**
  - 自定义文件夹/**
相关文章
相关标签/搜索