Hiker Guide

Hiker

Build Status GitHub license

An attractive, exquisite theme for Hexo. named “Hiker”, short for “HikerNews”.

☞ Live Preview | Hiker 中文版使用文档

Desktop Preview
Post Preview
Mobile Preview

Installation

  1. Get it from GitHub

    1
    $ git clone https://github.com/iTimeTraveler/hexo-theme-hiker.git themes/hiker
  2. Enable

    Modify theme setting in _config.yml to hiker.

    1
    2
    3
    4
    # Extensions
    ## Plugins: http://hexo.io/plugins/
    ## Themes: http://hexo.io/themes/
    theme: hiker
  3. Update

    1
    2
    $ cd themes/Hiker
    $ git pull

Configuration

Theme configuration example

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
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
# ---------------------------------------------------------------
# Site Information Settings
# ---------------------------------------------------------------

# Header Menu
menu:
Home: /
Archives: archives
Categories: categories
Tags: tags
About: about
rss: /atom.xml

since: 2013

# Set default keywords (Use a comma to separate)
keywords: ""

# Put your favicon.ico into `hexo-site/themes/hiker/source/` directory.
avatar: css/images/mylogo.jpg


# Homepage
# eg. home_background_image: css/images/home-bg.jpg
home_background_image: css/images/home-bg.jpg
home_logo_image:
enable: false
border: false
url: css/images/homelogo.jpg


# AboutPage background
about_big_image: css/images/pose.jpg


# Content
excerpt_link: Read More
fancybox: true


# Sidebar
sidebar: right
widgets:
- category
- tag
- tagcloud
- archive
- recent_posts


# comment ShortName, you can choose only ONE to display.
duoshuo_shortname: iTimeTraveler
disqus_shortname:


# Code Highlight theme
# Available value:
# default | normal | night | night eighties | night blue | night bright
# https://github.com/chriskempson/tomorrow-theme
highlight_theme: default


# Article theme color
# Available value:
# random | orange | blue | red | green | black
theme_color: random


# display widgets at the bottom of index pages (pagination == 2)
index_widgets:
# - category
# - tagcloud
# - archive


# widget behavior
archive_type: 'monthly'
show_count: true

# Google Webmaster tools verification setting
# See: https://www.google.com/webmasters/
google_site_verification:
baidu_site_verification:
qihu_site_verification:

# Miscellaneous
google_analytics:
gauges_analytics:
twitter:
google_plus:
fb_admins:
fb_app_id:
  • menu - Navigation menu
  • rss - RSS link
  • excerpt_link - “Read More” link at the bottom of excerpted articles. false to hide the link.
  • fancybox - Enable Fancybox
  • sidebar - Sidebar style. You can choose left, right, bottom or false.
  • widgets - Widgets displaying in sidebar
  • google_analytics - Google Analytics ID
  • favicon - Favicon path
  • twitter - Twiiter ID
  • google_plus - Google+ ID

Features

Homepage background

You could place the image file in YOUR_HEXO_SITE\themes\hiker\source\css\images directory. and modify home_background_image in hiker/_config.yml.

1
2
3
# Homepage
# eg. home_background_image: css/images/home-bg.jpg
home_background_image: css/images/home-bg.jpg

If you DON’T want any image as your homepage background, just set home_background_image empty in hiker/_config.yml, then you have an default homepage with random decorative pattern.

Code Highlight Theme

Hiker use Tomorrow Theme for your code block. We have six options in total: default, normal, night, night blue, night bright, night eighties

code `default` theme Preview

Above preview picture is default theme. the image below show other five Highlight themes.

code themes

Modify highlight_theme in hiker/_config.yml.

1
2
3
4
5
# Code Highlight theme
# Available value:
# default | normal | night | night eighties | night blue | night bright
# https://github.com/chriskempson/tomorrow-theme
highlight_theme: default

Blog Theme Color

Hiker provide five color themes for your blog.

theme colors

  • orange
  • blue
  • red
  • green
  • black

You can modify theme_color in hiker/_config.yml.

1
2
3
4
# Article theme color
# Available value:
# random | orange | blue | red | green | black
theme_color: random

Night mode

Just for article reading. In article page, you can click the logo image of header to switch to Night mode.

Fancybox

Hiker uses Fancybox to showcase your photos. You can use Markdown syntax or fancybox tag plugin to add your photos.

1
2
3
![img caption](img url)

{% fancybox img_url [img_thumbnail] [img_caption] %}

You can put your sidebar in left side, right side or bottom of your site by editing sidebar setting.
Hiker provides 5 built-in widgets:

  • category
  • tag
  • tagcloud
  • archives
  • recent_posts

All of them are enabled by default. You can edit them in widget setting.

Comment support

Hiker has native support for DuoShuo & Disqus comment systems. Modify the following snippets to hiker hiker/_config.yml:

1
2
3
# comment ShortName, you can choose only ONE to display.
duoshuo_shortname: iTimeTraveler
disqus_shortname:

Browser support

Contributing

All kinds of contributions (enhancements, new features, documentation & code improvements, issues & bugs reporting) are welcome.

Looking forward to your pull request.

Powered by Hexo and Hexo-theme-hiker

Copyright © 2013 - 2019 iTimeTraveler All Rights Reserved.

访客数 : | 访问量 :