hexo主题配置conci

visitors 0   •     •   2017.06.01

继续叨叨叨

之前介绍了hexo的安装和部署(还没部署的小伙伴点这里),这篇咱们接着介绍怎么应用主题。

conci主题(github)

这里主要是配置的conci主题

下载conci

hexo的主题都存放在themes文件夹下,在themes文件夹下右键Git bash Here,输入:

1
$ git clone https://github.com/cspp01/concise.git

然后在主_config.yml文件中找到theme字段改为concise。

安装scss预编译插件

由于我是用的是scss写的css代码,所以先安装sass插件。在主根目录下右键Git bash Here,输入

1
npm install hexo-renderer-sass --save

安装自定义页面的插件

在主根目录下右键Git bash Here,输入

1
npm install hexo-generator-mypage --save

然后在主_config.yml中添加如下

1
2
3
4
mypage:
tags/index.html: tags
categories/index.html: categories
about.html: about

基本条件已经OK,可以预览了。输入:

1
2
$ hexo clean
$ hexo s -debug

在本地预览调试看看是否应用成功。

conci基本配置

设置头像

在主题配置文件中找到my_img字段.

1
my_img: http://ooa3lxrpg.bkt.clouddn.com/b.jpg?imageView2/1/w/120/h/120/q/75 //地址(云存储对应头像的地址)也可放在本地,不过推荐放云端存储。

在主题配置文件中找到logo字段

1
logo: conci #<img src="./logo.png">//可以是字符也可以是图片如(<img src="你的logo地址">)

添加favicon

把主题\source文件夹下的favicon.ico替换或者在主题配置文件中找到favicon字段把地址换成你的地址

1
favicon: /favicon.ico

配置展示信息

找到inf字段来对应设置你要展示的信息

1
2
3
4
5
6
7
inf:
name: conci.theme
superscript: hexo//上标字段
describe:
one: conci version 1.0.0//第一行信息
two: Simple and practical hexo personal blog theme.//第2行信息
three: The freedom to choose//第3行信息

配置社交账号地址

找到my_social字段来对应设置你要展示的信息

1
2
3
4
5
6
my_social:
github: https://github.com/cspp01
twitter: /
weibo: http://weibo.com/5262373626/profile?topnav=1&wvr=6&is_all=1
豆瓣: http://douban.com/people/160374034/
知乎: http://www.zhihu.com/people/cc-chen-4-85

配置友情链接

找到my_links字段来按格式设置,要设置几个友情链接就设置几个

1
2
3
4
5
6
7
my_links:
ccblog1://友情链接名字
href: //友情链接地址
img: http://ooa3lxrpg.bkt.clouddn.com/timg.jpg//友情链接头像地址
ccblog2://友情链接名字
href: //友情链接地址
img: http://ooa3lxrpg.bkt.clouddn.com/timg.jpg//友情链接头像地址

配置首页文章简介字符数

找到index_pagelength字段设置

1
index_pagelength: 200//字符数

开启打赏功能

找到reward字段设置

1
2
3
4
reward:
open: true//[true(开启)|false(关闭)]
weixing: http://ooa3lxrpg.bkt.clouddn.com/wx.jpg?imageView2/2/w/180 #你的微信收钱二维码图片地址
alipay: http://ooa3lxrpg.bkt.clouddn.com/zfb.jpg?imageView2/2/w/180 #你的支付宝收钱二维码图片地址

自定义侧边栏位置

找到sidebar字段设置,注意两个属性的值必须相反

1
2
3
sidebar:
content: left//内容位置[left|right]
my: right//侧边栏位置[left|right]

文章属性配置

在source /\ _posts下的文章中在两个- - -之间添加

1
2
3
4
5
6
7
---
title: hexo的next主题配置和优化
date: 2017-06-1 08:15:23
tags: ['hexo','next','css'] //hexo和next就是标签,你可以写任何关于你文章名字的标签
categories: hexo博客搭建 //分类
pho: http://ooa3lxrpg.bkt.clouddn.com/11.jpg //首页展示图片地址,未配置的话会显示默认图片
---

今天基本就写到这里了,希望对你们有帮助。
下一篇介绍怎么开启conci主题的评论,搜索,分享,rss,阅读数统计等。

 /  / 
  • 微信

  • 支付宝