H2O, If you like this theme or using it, please give a ⭐️ for motivation ;)

如果你喜欢这个博客模板,请在右上角star一下,非常感谢~

主题特性

  • 代码高亮
  • 支持Disqus评论系统
  • 粉蓝两种主题色
  • 头图个性化底纹
  • 响应式设计
  • 社交图标
  • SEO标题优化
  • 文章标签索引

介绍

You can easily get started by modifying _config.yml

你可以通用修改 _config.yml 文件来轻松的开始搭建自己的博客

侧边栏

侧边栏

侧边栏分为两个部分:【个人简介】和【推荐标签】。当屏幕宽度小于960px时,侧边栏会被隐藏

社交图标

使用阿里的图标管理平台Iconfont整理了一套常用的社交图标用于博客的个人简介上,包括微博、知乎、掘金、简书、Github等十二个网站,并且对鼠标悬停时的样式颜色进行了优化。

代码高亮

模板引入了Prism.js,一款轻量、可扩展的代码语法高亮库。

很多知名网站如MDNcss-tricks也在用它,就连 JavaScript 之父 Brendan Eich 也在个人博客上使用。

代码高亮

支持语言:

  • HTML
  • CSS
  • Sass
  • JavaScript
  • CoffeeScript
  • Java
  • C-like
  • Swift
  • PHP
  • Go
  • Python

主题皮肤

主题皮肤

支持两种主题颜色蓝色(默认)和粉色

主要效果体现在首页博客封面、顶部导航栏的logo以及鼠标悬停时文字显示的颜色效果。

头图底纹

头图底纹

在没有图片的情况下单纯显示颜色会不会太无趣了点?于是想到了加入底纹元素,底纹素材是SVG格式的(保存在css样式里),加载比图片快很多。六种底纹(电路、食物、云海、钻石等等)供你选择。

自定义

如果你喜欢折腾,想对模板的代码进行修改,需要使用命令 npm install 安装 package.json 中的依赖,然后 gulp 一下即可开始你的自定义之旅。

Disqus

Disqus是一个第三方社交评论插件,体验相当不错,模板默认开启Disqus评论插件。

Share.js

为了让文章更方便地分享,使用了第三方分享插件Share.js,支持一键分享到微博、QQ空间、QQ好友、微信、腾讯微博、豆瓣、Facebook、Twitter、Linkedin、Google+、点点等社交网站。