BlueLake

一个简洁轻量化的响应式Hexo博客主题。

点击预览

一、安装

1. hexo 安装

hexo 安装前，需要确保 git、node、npm 已经安装。因为安装 hexo 需要使用 npm 命令，hexo 初始化需要使用 git。

1.1 安装 hexo

$ sudo npm install -g hexo-cli
/usr/local/node-6.11/bin/hexo -> /usr/local/node-6.11/lib/node_modules/hexo-cli/bin/hexo
/usr/local/node-6.11/lib
└─┬ hexo-cli@1.0.4
  ├── abbrev@1.1.1
  ├── bluebird@3.5.1
   .....

1.2 初始化博客文件夹

$ hexo init hexo
INFO  Cloning hexo-starter to /data/blogs/hexo
Cloning into '/data/blogs/hexo'...
remote: Counting objects: 62, done.
....

# 初始化博客文件夹(hexo)，会自动在当前路径下生成 hexo 目录
$ ls ./hexo
_config.yml  node_modules  package.json  scaffolds  source  themes

2. 安装主题和渲染插件

$ cd hexo
$ git clone https://gitee.com/stevenshen/hexo-theme-BlueLake.git themes/BlueLake
$ npm install hexo-renderer-jade@0.3.0 --save
$ npm install hexo-renderer-stylus --save

3. 启用 BlueLake

在 Hexo 配置文件（hexo/_config.yml）中把主题设置修改为BlueLake;并添加中文支持。

theme: BlueLake

 ...

language: zh-CN

如果你想生成压缩后的css，在（hexo/_config.yml）中添加：

stylus:
  compress: true

4. 本地预览

# 生成静态页面
$ hexo generate
INFO  Start processing
INFO  Files loaded in 1.46 s
INFO  Generated: index.html
INFO  Generated: apple-touch-icon.png
INFO  Generated: favicon.ico
INFO  Generated: archives/index.html
INFO  Generated: iconfont/iconfont.eot
INFO  Generated: iconfont/iconfont.svg
INFO  Generated: iconfont/iconfont.ttf
INFO  Generated: iconfont/iconfont.woff
INFO  Generated: archives/2018/01/index.html
INFO  Generated: img/bg.jpg
INFO  Generated: archives/2018/index.html
INFO  Generated: css/highlight.css
INFO  Generated: js/search.json.js
INFO  Generated: js/toctotop.js
INFO  Generated: js/totop.js
INFO  Generated: css/style.css
INFO  Generated: 2018/01/24/hello-world/index.html
INFO  17 files generated in 582 ms

# 开启本地服务器
$ hexo s
INFO  Start processing
INFO  Hexo is running at http://localhost:4000/. Press Ctrl+C to stop.

打开浏览器，地址栏中输入：http://localhost:4000/,应该可以看见刚刚创建的博客了。输入图片说明

更新主题

cd themes/BlueLake
git pull

5. 配置

打开themes/BlueLake/_config.yml进行配置。

##########################
## Site Config Settings ##
##########################

# Theme version
version: 2.0.1

# Header
menu:
  - page: home
    directory: .
    icon: fa-home
  - page: archive
    directory: archives/
    icon: fa-archive
  - page: about
    directory: about/
    icon: fa-user
  - page: rss
    directory: atom.xml
    icon: fa-rss

# Sidebar
widgets:
  - recent_posts
  - category
  - tag
  - archive
  #- weibo
  - links

# Toc
toc:
  enable: true
  number: false

# Static files
js: js
css: css

# Extensions
Plugins:
  hexo-generator-feed
  hexo-generator-sitemap
  hexo-generator-baidu-sitemap

#Feed Atom
feed:
  type: atom
  path: atom.xml
  limit: 20

#sitemap
sitemap:
  path: sitemap.xml
baidusitemap:
  path: baidusitemap.xml

#Local search
local_search: true ## Use a javascript-based local search engine, true/false.

#Cmments
comment:
  duoshuo: #chaooo ## duoshuo_shortname
  disqus: ## disqus_shortname
  livere: ## 来必力(data-uid)
  uyan: ## 友言(uid)
  cloudTie: ## 网易云跟帖(productKey)
  changyan: ## 畅言需在下方配置两个参数，此处不填。
    appid: ## 畅言(appid)
    appkey: ##畅言(appkey)

#Share
baidu_share: true ## 百度分享
JiaThis_share: ##true ##JiaThis分享
duoshuo_share: #true ##true 多说分享必须和多说评论一起使用。

# Analytics
google_analytics: ## Your Google Analytics tracking id, e.g. UA-42025684-2
baidu_analytics: ## Your Baidu Analytics tracking id, e.g. 1006843030519956000

# Miscellaneous
show_category_count: true ## If you want to show the count of categories in the sidebar widget please set the value to true.
widgets_on_small_screens: true ## Set to true to enable widgets on small screens.
busuanzi: true ## If you want to use Busuanzi page views please set the value to true.

# About page
about:
  photo_url: ## Your photo e.g. http://obzf7z93c.bkt.clouddn.com/themeauthor.jpg
  items:
  - label: email
    url: ## Your email with mailto: e.g.  mailto:zhenggchaoo@gmail.com
    title: ## Your email e.g.  zhenggchaoo@gmail.com
  - label: github
    url: ## Your github'url e.g.  https://github.com/chaooo
    title: ## Your github'name e.g.  chaooo
  - label: weibo
    url: ## Your weibo's url e.g.  http://weibo.com/zhengchaooo
    title: ## Your weibo's name e.g.  秋过冬漫长
  - label: twitter
    url:
    title:
  - label: facebook
    url:
    title:

# Friend link
links:
  - title: site-name1
    url: http://www.example1.com/
  - title: site-name2
    url: http://www.example2.com/
  - title: site-name3
    url: http://www.example3.com/

version - 用于自动刷新CDN上的静态文件。
menu - 导航菜单。
widgets - 侧边栏中的窗口小部件。
Toc - 文章目录
Static files - 静态文件目录，以方便CDN使用。
Local search
self_search - 默认本地JS搜索.
Cmments
duoshuo - 若使用多说评论，注册多说后在这填写short_name(用于评论与分享)。
disqus - 若使用Disqus评论，注册Disqus后在这填写short_name。
livere- 若使用来必力评论，注册来必力,获得data-uid。
uyan - 若使用友言评论，注册友言,获得uid。
cloudTie - 若使用网易云跟帖评论，注册网易云跟帖,获得productKey。
changyan - 若使用畅言评论，注册畅言，获得appid，appkey。
About page - 关于我页面(hexo new page 'about')。
links - 友情链接。
Miscellaneous
show_category_count - 是否在侧边栏分类中显示类别的数量（true/false）.
widgets_on_small_screens - 小屏幕下侧边栏在底部显示.
busuanzi - 用Busuanzi来统计网站访问量.
google_analytics - Google Analytics tracking ID。
baIDu_analytics - Baidu Analytics tracking ID。

二、特征

站点图标

您可以准备一张ico格式并命名为** favicon.ico **，请将其放入hexo目录的source文件夹，建议大小：32px * 32px。

您可以为苹果设备添加网站徽标，请将名为** apple-touch-icon.png **的图像放入hexo目录的“source”文件夹中，建议大小为：114px * 114px。

添加站点关键字

请在hexo目录的“hexo/_config.yml”中添加keywords字段，如：

# Site
title: Hexo
subtitle: 副标题
description: 网站简要描述,如：Charles·Zheng's blog.
keywords: 网站关键字, key, key1, key2, key3
author: Charles
language: zh-CN

设置阅读全文

您可以在文章的 front-matter 中添加 description，并提供文章摘录，或在文章中使用‘‘’’手动进行截断（Hexo推荐的方式）。

自定义page页面

在source文件夹中创建文件夹index.md来添加页面，并在index.md的front-matter'中添加layout：page。 Create folders inlcuding index.mdinsourcefolder to add pages, and add alayout: pageinfront-matterofindex.md`.

About页面

此主题默认page页面是关于我页面的布局，生成一个关于我页面：

$ hexo new page 'about'

配置照片地址、邮箱、微博链接、微博名、GitHub链接、Github名：

# About page
about:
  photo_url: ## Your photo e.g. http://obzf7z93c.bkt.clouddn.com/themeauthor.jpg
  items:
  - label: email
    icon: fa-email
    url: ## Your email with mailto: e.g.  mailto:zhenggchaoo@gmail.com
    title: ## Your email e.g.  zhenggchaoo@gmail.com
  - label: github
    icon: fa-github
    url: ## Your github'url e.g.  https://github.com/chaooo
    title: ## Your github'name e.g.  chaooo
  - label: weibo
    icon: fa-weibo
    url: ## Your weibo's url e.g.  http://weibo.com/zhengchaooo
    title: ## Your weibo's name e.g.  秋过冬漫长
  - label: twitter
    icon: fa-twitter
    url:
    title:
  - label: facebook
    icon: fa-facebook
    url:
    title:

点击预览About页面

代码语法高亮

请在hexo目录的“hexo/_config.yml”中设置“highlight”选项，如下所示：

highlight:
  enable: true
  auto_detect: true
  line_number: true
  tab_replace:

本地搜索

如果要使用本地站点搜索，您必须安装插件hexo-generator-json-content来创建JSON搜索文件，然后将配置添加到hexo/_config.yml：

$ npm install hexo-generator-json-content@2.2.0 --save

然后在hexo/_config.yml添加配置：

jsonContent:
  meta: false
  pages: false
  posts:
    title: true
    date: true
    path: true
    text: true
    raw: false
    content: false
    slug: false
    updated: false
    comments: false
    link: false
    permalink: false
    excerpt: false
    categories: false
    tags: true

语言

该主题目前有七种语言：简体中文（zh-CN），繁体中文（zh-TW），英语（en），法语（fr-FR），德语（de-DE），韩语（ko）,西班牙语（es-ES）,欢迎修改主题并翻译成其他语言。

Solutions

检查您当前的hexo的根目录，是否包含source /，themes /等。
如果你在使用这个主题有任何问题，请随时打开一个issue，或者给我发邮件zhenggchaoo@gmail.com。

浏览器支持

Imgur

License

MIT License

贡献

欢迎各种形式的贡献（增强功能，添加新功能，撰写文档，改进代码，提交问题和检查BUG...）。

期待您的pull request。

WeiYanCC / hexo-theme-BlueLake

BlueLake

一、安装

1. hexo 安装

2. 安装主题和渲染插件

3. 启用 BlueLake

4. 本地预览

更新主题

5. 配置

二、特征

站点图标

添加站点关键字

设置阅读全文

自定义page页面

About页面

代码语法高亮

本地搜索

语言

Solutions

浏览器支持

License

贡献

简介

发行版

贡献者

近期动态

WeiYanCC / hexo-theme-BlueLake .gitee-modal { width: 500px !important; }

BlueLake

一、安装

1. hexo 安装

2. 安装主题和渲染插件

3. 启用 BlueLake

4. 本地预览

更新主题

5. 配置

二、特征

站点图标

添加站点关键字

设置阅读全文

自定义page页面

About页面

代码语法高亮

本地搜索

语言

Solutions

浏览器支持

License

贡献

简介

发行版

开源评估指数源自 OSS-Compass 评估体系，评估体系围绕以下三个维度对项目展开评估：

贡献者

近期动态

搜索帮助

WeiYanCC / hexo-theme-BlueLake