以前介紹了hexo的安裝和部署(還沒部署的小夥伴點這裏),這篇我們接着介紹怎麼應用主題。css
這裏主要是配置的是conci主題 效果點這裏
同時支持pc端和移動端html
hexo的主題都存放在themes文件夾下,在themes文件夾下右鍵Git bash Here,輸入:git
$ git clone https://github.com/cspp01/concise.git
而後在主_config.yml文件中找到theme字段改成concise。github
因爲我是用的是scss寫的css代碼,因此先安裝sass插件。在主根目錄下右鍵Git bash Here,輸入npm
npm install hexo-renderer-sass --save
在主根目錄下右鍵Git bash Here,輸入sass
npm install hexo-generator-mypage --save
而後在主_config.yml中添加以下bash
mypage: tags/index.html: tags categories/index.html: categories about.html: about
基本條件已經OK,能夠預覽了。輸入:微信
$ hexo clean $ hexo s -debug
在本地預覽調試看看是否應用成功。hexo
在主題配置文件中找到my_img字段.dom
my_img: http://ooa3lxrpg.bkt.clouddn.com/b.jpg?imageView2/1/w/120/h/120/q/75 //地址(雲存儲對應頭像的地址)也可放在本地,不過推薦放雲端存儲。
在主題配置文件中找到logo字段
logo: conci #<img src="./logo.png">//能夠是字符也能夠是圖片如(<img src="你的logo地址">)
把主題source文件夾下的favicon.ico替換或者在主題配置文件中找到favicon字段把地址換成你的地址
favicon: /favicon.ico
找到inf字段來對應設置你要展現的信息
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字段來對應設置你要展現的信息
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字段來按格式設置,要設置幾個友情連接就設置幾個
my_links: ccblog1://友情連接名字 href: //友情連接地址 img: http://ooa3lxrpg.bkt.clouddn.com/timg.jpg//友情連接頭像地址 ccblog2://友情連接名字 href: //友情連接地址 img: http://ooa3lxrpg.bkt.clouddn.com/timg.jpg//友情連接頭像地址
找到index_pagelength字段設置
index_pagelength: 200//字符數
找到reward字段設置
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字段設置,注意兩個屬性的值必須相反
sidebar: content: left//內容位置[left|right] my: right//側邊欄位置[left|right]
在source _posts下的文章中在兩個- - -之間添加
--- title: hexo的next主題配置和優化 date: 2017-03-14 08:15:23 tags: ['hexo','next','css'] //hexo和next就是標籤,你能夠寫任何關於你文章名字的標籤 categories: hexo博客搭建 //分類 pho: http://ooa3lxrpg.bkt.clouddn.com/11.jpg //首頁展現圖片地址,未配置的話會顯示默認圖片 ---