Hexo-Theme-Snail

A succinct hexo theme.

Posted by xiaopf on 2019-11-01
Words 822 and Reading Time 4 Minutes
Viewed Times

hexo-theme-snail

View Hexo-Theme-Snail Sources On Github ➾

View Live Super Snail Blog ➾

hexo-theme-snail

Hexo-theme-snail is a succinct hexo theme. It has two colors, light and star, that can be set according to your own preferences in the settings, and also has the functions of sharing and commenting. More features are under development.

Features

  • light color theme and star theme
  • diversified comment system
  • notice tips
  • share to other platforms (under development)
  • picture sharing (under development)

Quick Start

Install Hexo

1
$ npm install hexo-cli -g

Setup your blog

1
$ hexo init blog

Installation Theme

1
$ cd blog
2
$ rm -rf source
3
$ rm _config.yml package.json README.md LICENSE
4
$ git clone https://github.com/dusign/hexo-theme-snail.git
5
$ mv ./hexo-theme-snail/snail ./themes
6
$ mv ./hexo-theme-snail/* ./
7
$ npm install

Set Theme

Modify the value of theme: in _config.yml

1
# Extensions
2
## Plugins: https://hexo.io/plugins/
3
## Themes: https://hexo.io/themes/
4
theme: snail

Start the Server

1
$ hexo generate
2
$ hexo server

Configuration

Site

Replace the following information with your own.

1
# Site
2
title: 
3
subtitle: At the bottom of the well, it is destined to see only the sky at the wellhead. 
4
          However, the starting point only affects the process of reaching your peak and does not determine the height you reach.
5
author: Dusign
6
language: en
7
timezone:

Site Settings

Put customized pictures in img directory.

1
# Site settings
2
SEOTitle: Hexo-theme-snail
3
email: hexo-theme-snail@mail.com
4
description: "A hexo theme"
5
keyword: "dusign, hexo-theme-snail"
6
header-img: img/header_img/home-bg-1-dark.jpg
7
signature: true #show signature
8
signature-img: img/signature/Just-do-it-white.png

SNS Settings

If you don’t want to display it, you can delete it directly.

1
# SNS settings
2
github_username:    dusign
3
twitter_username:   dusignr
4
facebook_username:  Gang Du
5
zhihu_username: dusignr

1
# Sidebar Settings
2
sidebar: true                      # whether or not using Sidebar.
3
sidebar-about-description: "Welcome to visit, I'm Dusign!"
4
sidebar-avatar: img/header.jpg    # use absolute URL, seeing it's used in both `/` and `/about/`
5
widgets:
6
- featured-tags
7
- short-about
8
- recent-posts
9
- friends-blog
10
- archive
11
- category
12
13
# widget behavior
14
## Archive
15
archive_type: 'monthly'
16
show_count: true
17
18
19
## Featured Tags
20
featured-tags: true                     # whether or not using Feature-Tags
21
featured-condition-size: 1              # A tag will be featured if the size of it is more than this condition value
22
23
24
## Friends
25
friends: [
26
    {
27
        title: "Dusign's Blog",
28
        href: "https://blog.csdn.net/d_Nail"
29
    },{
30
        title: "Dusign's Web",
31
        href: "#"
32
    },{
33
        title: "Dusign's Github",
34
        href: "https://github.com/dusign"
35
    },{
36
        title: "Other",
37
        href: "#"
38
    }
39
]

Theme

1
# Extensions
2
## Plugins: https://hexo.io/plugins/
3
## Themes: https://hexo.io/themes/
4
theme: snail

Deployment

1
# Deployment
2
## Docs: https://hexo.io/docs/deployment.html
3
deploy:
4
  type: git
5
  repo:
6
      github: github.repository.address
7
      coding: coding.repository.address
8
  branch: master

Comment

See httpymls://github.com/imsun/gitment for detailed configuration method.

1
# Comment
2
## This comment system is gitment
3
## gitment url: https://github.com/imsun/gitment
4
comment:
5
  enable: false
6
  owner:
7
  repo:
8
  client_id:
9
  client_secret:

Tip

1
# Tip
2
tip:
3
  enable: true
4
  content: 欢迎访问 <a href="https://www.dusign.net" target="dusign">dusign</a> 的博客,博客系统一键分享的功能还在完善中,请大家耐心等待。
5
          若有问题或者有好的建议欢迎留言,笔者看到之后会及时回复。
6
          评论点赞需要github账号登录,如果没有账号的话请点击 
7
          <a href="https://github.com" target="view_window" > github </a> 注册, 谢谢 !

Color Sheme

Set the enable value of the desired color sheme to true. If the value of bg_effects.star.enable is true, please modify the value of highlight_theme in ./themes/snail/_config.yml to night.

1
# Color Sheme
2
## If there is no effect after modification, please empty the cache and try again.
3
## ⚠️ The following special effects will take up a lot of cpu resorces, please open it carefully.
4
bg_effects:
5
  enable: true
6
  line:
7
    enable: false
8
    color: 129,200,61
9
    pointColor: 129,200,61
10
    opacity: 0.7
11
    zIndex: -9
12
    count: 99
13
  mouse_click:
14
    enable: true
15
    content: '"🌱","just do it","🌾","🍀","don''t give up","🍂","🌻","try it again","🍃","never say die","🌵","🌿","🌴"'
16
    color: '"rgb(121,93,179)"
17
          ,"rgb(76,180,231)"
18
          ,"rgb(184,90,154)"
19
          ,"rgb(157,211,250)"
20
          ,"rgb(255,0,0)"
21
          ,"rgb(242,153,29)"
22
          ,"rgb(23,204,16)"
23
          ,"rgb(222,0,0)"
24
          ,"rgb(22,36,92)"
25
          ,"rgb(127,24,116)"
26
          ,"rgb(119,195,79)"
27
          ,"rgb(4,77,34)"
28
          ,"rgb(122,2,60)"'
29
  star:
30
    enable: true

Releases

V1.0

  • fix the bugs
  • add comment system
  • add notice tips
  • add star sheme

License

Apache License 2.0 Copyright(c) 2018-2020 Dusign

hexo-theme-snail is derived from Huxpro Apache License 2.0. Copyright (c) 2015-2020 Huxpro


notice

欢迎访问 xiaopf 的博客, 若有问题或者有好的建议欢迎留言,笔者看到之后会及时回复。 评论点赞需要github账号登录,如果没有账号的话请点击 github 注册, 谢谢 !

If you like this blog or find it useful for you, you are welcome to comment on it. You are also welcome to share this blog, so that more people can participate in it. If the images used in the blog infringe your copyright, please contact the author to delete them. Thank you !