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
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
|
# Hugo-Primer
**A simple and beautiful Hugo theme based on GitHub's Primer CSS** | **[日本語記事](https://qqhann.info/blog/theer-stroy/)**
This theme would be a perfect fit if you are used to GitHub style pages.
Hugo-Primer is a theme based on GitHub style css: Primer, and adds some blog like features onto it.
Try it now, and leave me a star if you like it!
## Features
- [x] Primer css like theme
- [x] Menu bar header
- [x] Colored code pen
- [x] Math inline
- [x] Awesome TOC
- [x] Tags & Categories
- [x] Social Share buttons
## Installation
Clone to your theme directory:
```terminal
$ git clone https://github.com/qqhann/hugo-primer.git themes/hugo-primer
$ hugo server --theme=hugo-primer
```
## Usage
#### config.toml
You can configure Hugo-Primer behavior with these params in your blog's `config.toml`. Shown are defaults and most recommended configs.
```config.toml
# config.toml
hasCJKLanguage = true
# Code pen
pygmentsCodeFences = true
pygmentsUseClasses = true
# Enter a copyright notice to display in the site footer.
# To display a copyright symbol, type `©`.
copyright = ""
[params]
# Chose Social Sharing Buttons you want to use.
shareTo = ["Twitter", "Hatena", "Facebook", "Pocket"]
# You may disable copyright sentence by setting this to false.
showFooterCredits = true
```
That being said, below is all recommended configurations.
```config.toml
# config.toml
baseURL = "https://your_web_site"
title = "Your Blog"
theme = "hugo-primer"
languageCode = "ja"
# If you are using Chinese, Japanese, or Korean, I highly recommend you to set this true.
hasCJKLanguage = true
summaryLength = 70
# Code pen
pygmentsCodeFences = true
pygmentsUseClasses = true
googleAnalytics = "U-12345678-0"
# Enter a copyright notice to display in the site footer.
# To display a copyright symbol, type `©`.
copyright = ""
[frontmatter]
# update sitemap.xml's lastmod datetime by file change time, instead of git.
lastmod = ["lastmod", ":fileModTime", ":default"]
[params]
description = "Describe what your web page is about"
twitter = "your_twitter_id"
# You can use favicon by addin them manually.
useIcon = true
useTwitterCard = true
shareTo = ["Twitter", "Hatena", "Facebook", "Pocket"]
showFooterCredits = true
```
#### archetypes/default.md
It is also recommended to remove your site's `archetypes/default.md`, or copy Hugo-Primer's `archetypes/default.md` to your site.
```archetypes/default.md
---
title: "{{ replace .Name "-" " " | title }}"
date: {{ .Date }}
draft: true
categories:
tags:
keywords:
---
```
Example usage:
```
---
categories:
- Diary
tags:
- Shopping
- Health
---
```
Set keywords for seo.
## Contributing
Issues and PRs are welcome. :)
## License
MIT
|
