不写代码,搭建自己的文章搭客

配置本地环境

1、下载安装这两个软件 Git-2.21.0-64-bit.exe    node-v10.15.3-x64.msi  如下图

2、在自己电脑某个盘里新建一个文件夹(自定义名称)  我的文件夹名称为 czjblog

3、然后在文件夹里,右键—>选择Git Bash Here  就打开另一个窗口了,如下图

 

4、安装hexo  用命令 npm install hexo –g  如果网络好的话很快就行了

5、检查一下是否安装成功   用命令 hexo –v  出现以下图说明成功了

 

6、初始化自己创建的文件夹  用命令 hexo  init

 

7、生成静态页面  用命令  hexo  g

8、启动项目 用命令  hexo  s   出现如下图说明启动成功  去浏览器输入 http://localhost:4000 来访问了.

 

配置github环境

1、首先得去github官网上面去注册一个账号

2、然后新建一个仓库依赖,如下图

3、然后来到这页面,如下图

https://github.com/caozhongjue/caozhongjue.github.io.git

git@github.com:caozhongjue/caozhongjue.github.io.git

4、然后修改本地博客目录的配置:

修改本次博客根目录下的_config.yml文件,修改deploy下的配置如下:

type: git

repository:  git@github.com:caozhongjue/caozhongjue.github.io.git  //caozhongjue换为自己的

branch: master

5、控制台命令:npm install --save hexo-deployer-git    //安装部署插件

6、由于我是用ssh 与github关联的,所以得操作这步,输入命令 ssh-keygen -t rsa -C “2857113935@qq.com”  连续回车三下生成密钥,最后得到了两个文件:id_rsa和id_rsa.pub(默认存储路径是:C:\Users\Administrator\.ssh)

如下图 

7、经过上面的步骤,在C:\Users\Administrator\.ssh下面生成了一个id_rsa.pub文件,把里面的内容复制到 github ssh安全那里,如下面

标题随便填,键是id_rsa.pub文件里面的内容。

8、可以使用hexo d 发布项目到github上面去了  如下图

更改默认主题样式

Next主题的使用说明

http://theme-next.iissnan.com/getting-started.html

 

1、使用命令  git clone https://github.com/iissnan/hexo-theme-next

2、修改项目目录下_config.yml文件内容,把theme:后面的内容换为hexo-theme-next

theme:  hexo-theme-next  #修改网站主题样式

title: czj'blog  #

author:  czj  #修改作者

language:  zh-Hans  #修改网站的显示语言,这里是中文

3、修改项目目录下hexo-theme-next 主题下的_config.yml文件内容,

menu:

        home: / || home

        about: /about/ || user

        tags: /tags/ || tags

        categories: /categories/ || th

        archives: /archives/ || archive

上面这几个就是下面的

1、添加分类模块 命令如下

hexo new page categories

 

你会发现你的source文件夹下有了categorcies/index.md,打开index.md文件将title设置为title: 分类

3、打开 主题配置文件 找到menu,将categorcies取消注释

4、把文章归入分类只需在文章的顶部标题下方添加categories字段,即可自动创建分类名并加入对应的分类中

举个栗子:

title: 分类测试文章标题

categories: 分类名

 

添加标签模块  命令hexo new page tags

同上

添加关于模块   命令hexo new page about

同上

highlight_theme: night bright  #代码的样式

avatar: https://s2.ax1x.com/2019/05/23/VPZiAe.png   #设置头像

4、添加搜索功能

4.1、安装 hexo-generator-searchdb 插件

npm install hexo-generator-searchdb --save

4.2、打开 站点配置文件 找到Extensions在下面添加

search:

         path: search.xml

         field: post

         format: html

         limit: 10000

4.3、打开 主题配置文件 找到Local search,将enable设置为true

5、修改文章内链接文本样式

打开文件 themes/next/source/css/_common/components/post/post.styl,在末尾添加

6、首页的文章只显示一半

用文本编辑器打开 themes/next 目录下的 _config.yml 文件,找到这段代码:

auto_excerpt:

  enable: false

  length: 150

enable false 改成 true 就行了,然后 length 是设定文章预览的文本长度。

修改后重启 hexo ok了。

最后博客样式

项目的目录结构

source 文件夹存放着用markdown编辑器写的文章    每次添加文章都是用markdown编辑器写好保存,放到source下面的_post文件夹下面去

themes 这里存放着样式

_config.yml 主站点配置文件 ,themes样式文件夹下面的文件夹里也有个样式配置文件

可以使用MarkdownPad2编辑器写文章,写完后,把那个.md文章放到source下的_post文件夹下,

然后右键打开窗口, 依次使用命令 hexo clean  , hexo g  ,hexo d

 

 

 

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值