前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >Hexo even让博客优雅起来

Hexo even让博客优雅起来

作者头像
公号:咻咻ing
修改2019-08-09 10:58:24
8680
修改2019-08-09 10:58:24
举报
文章被收录于专栏:公众号:咻咻ing公众号:咻咻ing

按照博客 使用Gitee+Hexo搭建个人博客 的教程,我们已经成功在Gitee上搭建完成了自己的博客,但是这个博客还是比较简陋的。 接下来讲介绍 如何开始写作Even主题的常用配置

如何开始写作

博客搭建完成,虽然功能很简单,但是已经可以开始写作。

  • 新建文章 使用命令来新建一篇文章: $ hexo new [layout] <title>layout 是文章的布局,默认为post,可以先不写。 title 是文章的标题,也是文件的名字,存储在source/_posts下。 使用MarkDown编辑器打开文件就可以开始写作了。
  • Front-matter 设置 Front-matter 是文章最上方以 — 分隔的区域,用于指定文章的变量设置,举例来说: title: Hello World date: 2013/7/13 20:46:25 ---以下是预先定义的参数,您可在模板中使用这些参数值并加以利用。 参数描述默认值layout布局无title标题无date建立日期文件建立日期updated更新日期文件更新日期comments开启文章的评论功能truetags标签(不适用于分页)categories分类(不适用于分页)permalink覆盖文章网址无
  • 文章分类和标签 只有文章支持分类和标签,您可以在 Front-matter 中设置。在其他系统中,分类和标签听起来很接近,但是在 Hexo 中两者有着明显的差别:分类具有顺序性和层次性,也就是说 Foo, Bar 不等于 Bar, Foo;而标签没有顺序和层次。设置示例: categories: - Diary tags: - PS3 - Games说明:文章分类和标签的设置,会自动归档的菜单的分类和标签中。
  • 文章截断 在文章内容中添加 即可在首页显示时只显示其之上的内容。 并且会在 添加一个 Read more 的链接。
  • 自定义文章简述 可在文章头信息中添加 description 字段,并填写自定义的文章简述。 就可以在首页显示文章简述而不显示文章内容。

Even主题常用配置

我们博客搭建完成后Hexo的目录结构如下:

代码语言:javascript
复制
.
├── _config.yml
├── package.json
├── scaffolds
├── source
|   ├── _drafts
|   └── _posts
├── themes
|   ├── even
|   └── landscape

我们Even主题的配置则主要在even目录下进行,配置文件_config.yml,目录结构如下:

代码语言:javascript
复制
.
├── _config.yml
├── package.json
├── scaffolds
├── source
|   ├── css
|   └── js
├── languages
|   ├── default.yml
|   └── zh-cn.yml
|──  layout
  • 修改主题颜色 主题自带了 5 种可选的颜色:

修改主题配置文件中 theme 字段的 color 属性可改变主题色: # =========================================== # Theme Settings # =========================================== # theme styling # color: Default | Mint Green | Cobalt Blue | Hot Pink | Dark Violet theme: color: Default除了能够修改为主题自带的 5 种颜色之外,还可以使用自定义的其他颜色。 在 source/css/_custom/_custom.scss 中添加样式变量 $theme-color 修改主题色。 $theme-color: #xxxxxx;同时需要修改 $deputy-color 主题副颜色,该值主要使用在代码块背景以及文章目录。 $deputy-color: #xxxxxx;_variables.scss 中的样式变量都可以在 _custom.scss 中进行覆盖,从而自定义主题样式。

  • 添加分类页 使用命令新建一个 categories 页面: hexo new page categories编辑生成的 categories/index.md 文件,设置布局为 categories: title: categories layout: categories默认开启评论(如果使用了多说或 Disqus),添加 comments 字段并设置为 false 可关闭。 在主题配置文件(_config.yml)中添加链接: # =========================================== # Menu Settings # =========================================== menu: Home: / Archives: /archives/ Categories: /categories/
  • 添加标签页 使用命令新建一个 tags 页面: hexo new page tags编辑生成的 tags/index.md 文件,设置布局为 tags: title: tags layout: tags默认开启评论,添加 comments 字段并设置为 false 可关闭。 在主题配置文件(_config.yml)中添加链接: # =========================================== # Menu Settings # =========================================== menu: Home: / Archives: /archives/ Tags: /tags
  • 添加自定义页面 使用命令新建一个自定义页面(以添加关于页为例): hexo new page about编辑生成的 about/index.md 文件,设置布局为 page: title: about layout: page关于页面的内容,个人相关介绍也是在此页面进行编辑。 默认开启评论(如果使用了多说或 Disqus),添加 comments 字段并设置为 false 可关闭。 在主题配置文件(_config.yml)中添加链接: # =========================================== # Menu Settings # =========================================== menu: Home: / Archives: /archives/ About: /about在使用的语言文件下添加对应的字段(默认为 languages/default.yml): menu: home: Home archives: Archives tags: Tags categories: Categories about: About
  • 添加文章访问量统计 文章访问量统计通过 LeadCloud 支持 配置LeanCloud 打开LeanCloud官网,进入注册页面注册。完成邮箱激活后,点击头像,进入控制台页面 创建新应用 创建一个新应用,并创建名称为 Counter 的 Class(注意权限选择无限制) 配置 app_id 与 app_key 在你所创建的应用的 设置->应用Key 中查看 app_id 与 app_key 修改主题配置文件 _config.yml,填入 app_idapp_key: # LeanCloud leancloud: app_id: app_key:设置 Web 安全域名 在你所创建的应用的 设置->安全中心 中设置 Web 安全域名 添加你的域名到 Web 安全域名中(若本地服务也想看到访问量,添加 http://localhost:4000/)
  • 设置文章打赏 通过主题配置文件中的 reward 字段开启/关闭: reward: enable: true qrCode: wechat: /image/reward/wechat.png alipay: /image/reward/alipay.png支持微信以及支付宝,修改 qrCode 下对应的二维码图片链接,也可以直接设置成图片的网络链接。 当开启打赏功能时,可通过文章 Markdown 头部: reward: false关闭该篇文章的打赏。反之,当打赏功能关闭时,可以在文章中单独开启。
  • 设置底部社交链接 目前支持:Email, Stack Overflow, Twitter, Facebook, Github, 微博以及知乎 修改主题配置文件中的 social 字段下的各个字段开启,为空时即为关闭: social: email: your@email.com stack-overflow: twitter: facebook: github: weibo: zhihu:主题使用的是自定义的 iconfont 图标库。
  • 设置文章版权 修改主题配置文件中的 copyright 字段开启/关闭: copyright: enable: true # https://creativecommons.org/ license: '本文采用<a rel="license" href="http://creativecommons.org/licenses/by-nc/4.0/">知识共享署名-非商业性使用 4.0 国际许可协议</a>进行许可'默认显示作者,来源,链接以及版权说明,版权说明可通过 copyright.lincese 自定义。 copyright.license 的值可以是 HTML 当文章版权信息开启时,可通过文章 Markdown 头部: copyright: false进行单篇文章版权信息的关闭。

至此博客基本配置好了,大家可以愉快的写博客啦!!! 配置完成的博客效果可以参考:https://xiuxiuing.gitee.io/blog/

欢迎扫码关注公众号,更好的交流
欢迎扫码关注公众号,更好的交流
本文参与 腾讯云自媒体分享计划,分享自微信公众号。
原始发表:2018-08-22,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 咻咻ing 微信公众号,前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体分享计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 如何开始写作
  • Even主题常用配置
相关产品与服务
云服务器
云服务器(Cloud Virtual Machine,CVM)提供安全可靠的弹性计算服务。 您可以实时扩展或缩减计算资源,适应变化的业务需求,并只需按实际使用的资源计费。使用 CVM 可以极大降低您的软硬件采购成本,简化 IT 运维工作。
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档