以個(gè)人博客為例，博客地址

準(zhǔn)備工作

安裝

$ npm install -g hexo-cli

初始化

$ hexo init <folder> $ cd <folder> $ npm install

創(chuàng)建新文章

$ hexo new "My New Post"

運(yùn)行開發(fā)環(huán)境

$ hexo server $ hexo s

構(gòu)建

$ hexo generate $ hexo g

部署

$ hexo deploy $ hexo d

詳細(xì)準(zhǔn)備工作，可以查閱hexo官網(wǎng)

安裝主題cactus，一個(gè)很程序員的主題，推薦！

克隆倉(cāng)庫(kù)，并且將源文件復(fù)制到博客項(xiàng)目中themes目錄下

git clone https://github.com/probberechts/hexo-theme-cactus.git themes/cactus

themes/cactus/_config.yml相關(guān)配置,詳細(xì)解釋可以看官方文檔

# 首頁(yè)P(yáng)rojects的url projects_url: https://github.com/xiaobinwu # 設(shè)置頁(yè)面方向 direction: ltr # 首頁(yè)導(dǎo)航 # $ hexo new page about，可以創(chuàng)建page頁(yè)面 nav:home: /about: /about/articles: /archives/categories: /categories/search: /search/ # 社交鏈接 social_links:github: https://github.com/xiaobinwumail: mailto:xiaobin_wu@yahoo.com # 開啟標(biāo)簽快捷方式 tags_overview: true # 首頁(yè) Writing的展示條數(shù) posts_overview:show_all_posts: falsepost_count: 5sort_updated: false # 排列方式 archive:sort_updated: false post:show_updated: false # logo設(shè)置 logo:enabled: truewidth: 50height: 50url: /images/logo.pnggravatar: false # ico設(shè)置 favicon:desktop:url: /images/favicon.icogravatar: falseandroid:url: /images/favicon-192x192.pnggravatar: falseapple:url: /images/apple-touch-icon.pnggravatar: false # 高亮語法 highlight: kimbie.dark # 博客主題色，dark, light, classic, white colorscheme: dark page_width: 48 # rss設(shè)置 rss: atom.xml open_graph:fb_app_id:fb_admins:twitter_id:google_plus: # disqus評(píng)論，默認(rèn)不開啟，需FQ disqus:enabled: falseshortname: cactus-1 # 谷歌統(tǒng)計(jì) google_analytics:enabled: falseid: UA-86660611-1 # 百度統(tǒng)計(jì) baidu_analytics:enabled: falseid: 2e6da3c375c8a87f5b664cea6d4cb29cgravatar:email: xiaobin_wu@yahoo.comvaline:enable: trueapp_id: xxxxxxapp_key: xxxxxxx

Valine評(píng)論系統(tǒng)

themes/cactus/_config.yml配置Valine，需要申請(qǐng)app_id，app_key

valine:enable: trueapp_id: xxxxapp_key: xxxx

themes/cactus/layout/_partial/comments.ejs,寫入

<% if(theme.valine.enable) { %><script src="//cdn1.lncld.net/static/js/3.0.4/av-min.js"></script><script src='//unpkg.com/valine/dist/Valine.min.js'></script><div id="vcomments" class="blog-post-comments"></div><script>new Valine({el: '#vcomments',visitor: true,appId: '<%=theme.valine.app_id %>',appKey: '<%=theme.valine.app_key %>',placeholder: 'ヾﾉ≧?≦)o來啊，快活啊!',avatar: 'robohash'})</script> <% } %>

自動(dòng)部署hexo博客到阿里云服務(wù)器

創(chuàng)建倉(cāng)庫(kù)(遠(yuǎn)端服務(wù)器創(chuàng)建git倉(cāng)庫(kù)),可以使用ssh登入云服務(wù)器

mkdir blog.git && cd blog.git git init --bare

Hexo配置

deploy:type: gitmessage: updaterepo: root@xx.xxx.xx.xxx:/www/wwwroot/blog.git,master

插件安裝

npm install hexo-deployer-git --save

自動(dòng)部署

進(jìn)入到git倉(cāng)庫(kù)hooks目錄，并創(chuàng)建鉤子post-receive

cd /www/wwwroot/blog.git/hooks touch post-receive vim post-receive

輸入下面腳本：

#!/bin/bash -l GIT_REPO=/www/wwwroot/blog.git TMP_GIT_CLONE=/www/wwwroot/tmp/blog PUBLIC_WWW=/www/wwwroot/blog rm -rf ${TMP_GIT_CLONE} mkdir ${TMP_GIT_CLONE} git clone $GIT_REPO $TMP_GIT_CLONE rm -rf ${PUBLIC_WWW}/* cp -rf ${TMP_GIT_CLONE}/* ${PUBLIC_WWW}

更改權(quán)限

chmod +x post-receive chmod 777 -R /www/wwwroot/blog chmod 777 -R /www/wwwroot/tmp/blog

最后部署

$ hexo g -d

總結(jié)

以上是生活随笔為你收集整理的自定义个人微博排版的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。