自用笔记: 本文属于自用笔记,不做详解,仅供参考。在此记录自己已理解并开始遵循的前端代码规范。What How Why
最近,使用Hexo遇到了很多问题,在设立进行整理。
写文章 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 $ hexo n #写文章 其中my new post为文章标题,执行命令后。 会在项目\source_posts中生成my new post.md文件,用编辑器打开编写即可。 当然,也可以直接在\source_posts中新建一个md文件,我就是这么做的。 文章开头语法: title: name #文章标题 date: 2015-12-25 18:29:00 #写作时间 description: #文章描述 categories: #文章分类 - 建站 tags: #文章标签 - 博客 - 建站 - Hexo toc: true # 生成目录 author: comments: original: permalink: #指定链接 --- 以上是摘要 <!--more--> 以下是余下全文
写多种文章 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 $ hexo new [layout] "postName" #新建文章 [layout]:其中layout是可选参数,默认值为post。 有哪些layout呢,请到 scaffolds 目录下查看,这些文件名称就是layout名称。 当然你可以添加自己的layout,方法就是添加一个文件即可。 同时你也可以编辑现有的layout,比如post的layout默认是 hexo\scaffolds\post.md 关于hexo\scaffolds\photo.md配置文件的介绍: layout: { { layout } } #layout名称 title: { { title } } #文章标题 date: { { date } } #文章生成时间 ategories: #文章分类目录 tags: #文章标签 - # photos: # - # --- layout: photo title: 我的阅历 date: 2085-01-16 07:33:44 tags: [hexo] photos: - http://bruce.u.qiniudn.com/2013/11/27/reading/photos-0.jpg - http://bruce.u.qiniudn.com/2013/11/27/reading/photos-1.jpg
自定义页面 1 2 3 4 5 6 7 8 9 10 11 12 13 14 执行new page命令 $ hexo new page "about" 在 *hexo\source\* 下会生成 *about* 目录, 里面有个index.md,直接编辑就可以了, 然后在主题的 *_config.yml* 中将其配置显示出来。 上述步骤,也可以手工生成,在 *hexo\source\* 下手工新建 *about* 和 *index.md* 也是完全等价的。 因为markdown对table的支持不好,我是在about中直接 建立index.html,里面书写页面内容,hexo会帮你加上头和尾。
写页面(404) 1 2 3 4 5 $ hexo new page "404" UUhike@UUhike-pc MINGW64 /d/Hexo/Hexo (master) $ hexo new page "404" INFO Created: D:\Hexo\Hexo\source\404\index-1.md
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 title: 404 Not Found:该页无法显示 comments: false permalink: /404 fancybox: false --- <style type="text/css"> .article-title { font-size: 2.1em; } strong a { color: #747474; } .share { display: none; } .player { margin-left: -10px; } .sign { text-align: right; font-style: italic; } #page-visit { display: none; } .center { text-align: center; height: 2.5em; font-weight: bold; } .search2 { height: 2.2em; font-size: 1em; width: 50%; margin: auto 24%; color: #727272; opacity: .6; border: 2px solid lightgray; } .search2:hover { opacity: 1; box-shadow: 0 0 10px rgba(0, 0, 0, 0.3) }; .article-entry hr { margin: 0; } .pic { text-align: center; margin: 0; } .pic br { display: none; } </style> *** <div class="pic"> <img src="/resources/Mihawk-Wind.gif" title="Mihawk-Wind"> </div> <p class="center">很抱歉,您所访问的地址并不存在: </p> <p class="center"><a href="/">回主页</a> · <a href="/archives">所有文章</a> · <a href="/about">留言板</a></p> <p class="center">可在边栏搜索框中对本站进行检索,以获取相关信息。</p> <div style="text-align: center"> 以下是博主喜欢的一些歌曲,可以听听,稍作休息~ <iframe frameborder="no" border="0" marginwidth="0" marginheight="0" width=320 height=330 src="http://music.163.com/outchain/player?type=0&id=112513213&auto=0&height=430"></iframe> </div>
发布博客内容 实现发布,前提是配置好,部署到Github前需要配置_config.yml文件。
1 2 3 4 5 6 7 # Deployment ## Docs: http://hexo.io/docs/deployment.html deploy: type: github repository: git@github.com:zhchnchn/zhchnchn.github.io.git branch: master
更新的最新版本,可能会有Bug,自行百度,好像要修改type:git。
1 2 3 4 5 6 7 8 9 10 $ hexo server #开启预览访问端口(默认端口4000,'ctrl + c'关闭server)Hexo 会监视文件变动并自动更新,您无须重启服务器。 $ hexo g #生成 $ hexo generate #生成静态页面至public目录(最终上传这个文件到GitHub) $ hexo d == hexo deploy#部署 $ hexo d #部署 # 可与hexo g合并为 hexo d -g $ hexo deploy -g $ hexo server -g # 生成默认文件群再执行,开启本地静态html服务器
主题的更改 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 1. 将Git Shell 切到/D/Hexo目录下,然后执行下面的命令,将pacman下载到 themes/pacman 目录下。 $ git clone https://github.com/A-limon/pacman.git themes/pacman 2. 修改你的博客根目录/D/Hexo下的config.yml配置文件中的theme属性,将其设置为pacman。 3. 更新pacman主题 $ cd themes/pacman $ git pull NOTE:先备份_config.yml 文件后再升级 主题: yilia $ git clone https://github.com/litten/hexo-theme-yilia.git themes/yilia modernist $ git clone https://github.com/heroicyang/hexo-theme-modernist.git themes/modernist jacman $ git clone https://github.com/cnfeat/cnfeat.git themes/jacman
文章图片路径 Hexo如何方式图片,图片应该放置到哪里,不会应为上传而覆盖掉。然后把文章里的index.md删除,将文件存放在resource文件夹中间。
1 2 3 4 5 6 发布页面 $ hexo new page "name" # 新建一个页面,页面名称name UUhike@UUhike-pc MINGW64 /d/Hexo/Hexo (master) $ hexo new page "resoures" INFO Created: D:\Hexo\Hexo\source\resoures\index.md
Hexo文件备份 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 git-backup. Install if your hexo version is 2.x.x, you should install as follow: $ npm install hexo-git-backup@0.0.91 --save if version is 3.x.x, you should install as follow: $ npm install hexo-git-backup --save Update if you install with --save, you must remove firstly when you update it. $ npm remove hexo-git-backup $ npm install hexo-git-backup --save Configure You should configure this plugin in _config.yml. backup: type: git repository: github: git@github.com:xxx/xxx.git,branchName gitcafe: git@github.com:xxx/xxx.git,branchName Using hexo backup or hexo b Options if you want to back up with your theme,just add theme: your theme name,your theme name in _config.yml. backup: type: git theme: coney,landscape,xxx repository: github: git@github.com:xxx/xxx.git,branchName gitcafe: git@github.com:xxx/xxx.git,branchName Attention: if you do as above, the dir themes/coney/.gitwill be removed if you want DIY commit message, just add 'message: update xxx'. backup: type: git message: update xxx repository: github: git@github.com:xxx/xxx.git,branchName gitcafe: git@github.com:xxx/xxx.git,branchName Now you can backup all the blog! Problems You may get some troubles by your computer' permission。 Error: EISDIR, open it is caused by permission. just do 'sudo hexo b' sudo hexo b
参考资料: 使用GitHub搭建Hexo博客 Hexo插件安装 hexo你的博客 如何搭建一个独立博客——简明Github Pages与Hexo教程