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
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
|
# Kiss
Kiss is a stupidly simple blog theme for Hugo. It's a fork of [Hemingway theme](https://github.com/tanksuzuki/hemingway) - [read why](https://www.ribice.ba/hugo-kiss/).
## Getting Started
Clone this repository to your hugo theme directory.
```bash
mkdir themes
cd themes
git clone https://github.com/ribice/kiss.git
```
## Site Configuration
Take a look in the [exampleSite](https://github.com/ribice/kiss/tree/master/exampleSite) folder.
This directory contains an example config file and the content for the demo.
It serves as an example setup for your documentation.
Copy the `config.toml` in the root directory of your website. Overwrite the existing config file if necessary.
__[config.toml](https://github.com/ribice/kiss/blob/master/exampleSite/config.toml)__:
```toml
baseurl = "https://example.com"
languageCode = "en"
title = "Hugo Kiss theme"
theme = "kiss"
copyright = "© <a href=\"https://github.com/ribice\">Emir Ribic</a> 2017"
disqusShortname = "shortname"
googleAnalytics = ""
Paginate = 5 # Number of posts per page
enableRobotsTXT = true
[params.rss] # Adding this tag enables RSS feed
includeContent = true # Includes whole content in rss
authorName = "Emir Ribic" # Author full name
authorEmail = "ribice@gmail.com" # Author email
[params.assets]
customCSS = ["css/custom.css"]
[params.info]
adsense = "" # Adsense ID (ID only, without ca-pub-)
enableSocial = true # Adds OpenGraph and Twitter cards
homeTitle = "" # Title for home page
poweredby = true # Adds powered by hugo and kiss below Copyright
related = true # Includes related articles at the bottom of the article
[params.opengraph.facebook]
admins = [] # array of Facebook IDs
appID = ""
pageID = ""
[params.opengraph.twitter]
page = "" # Twitter Page username. If not set, params.social.twitter will be used.
[params.social]
twitter = "ribicemir"
github = "ribice"
email = "ribice@gmail.com"
linkedin = "ribice"
facebook = "ribice"
instagram = ""
codepen = ""
rss = "index.xml" # Add this to show RSS button in social.
[params.matomoAnalytics]
siteID = 1
rootURL = "//matomo.example.com/"
[taxonomies]
tag ="tags"
[blackfriday]
hrefTargetBlank = true
```
To change color of titles, add in static/css/custom.css
```css
.content h1,
.content h2,
.content h3,
.content h4,
.content h5,
.content h6 {
color: #F52AA3; // Custom Color
}
```
To align images, add #c for center, #r/l for right/left.
```md
```
## Add sections
Links can be added to the navbar (below the blog name and social links).
There are two positions:
- `[params.sections_left]` that will add links in the left side (under the blog title)
- `[params.sections_right]` that will add links in the right side (under the social links)
```toml
[params.sections_left]
"/special-page" = "Special page"
"https://example.com" = "Example"
[params.sections_right]
"http://example.com/special-page" = "Example"
```
## Favicons, Browserconfig, Manifest
It is recommended to put your own favicons
* `apple-touch-icon.png` (180x180)
* `favicon-32x32.png` (32x32)
* `favicon-16x16.png` (16x16)
* `mstile-150x150.png` (150x150)
* `android-chrome-192x192.png` (192x192)
* `android-chrome-512x512.png` (512x512)
into `/static`. They're easily created via https://realfavicongenerator.net/.
Customize `browserconfig.xml` and `site.webmanifest` to set `theme-color` and `background-color` for example.
## Related Articles
To include related articles in the bottom of the content, set params.info.related to true.
By default up to 5 articles will be shown (can be changed by cloning related.html) and only older ones.
To change the behaviour of how related articles are generated, check [official docs on Related Content](https://gohugo.io/content-management/related/).
## Single Page Configuration
```
tags: ["Android", "Apple", "iPhone"] # Adds tags to the post
image: https://example.com/img/1/image.jpg # Cover used for OpenGraph and Twitter Cards
adsenseTop: true # If adsense property is set (params.info.adsense) include an ad above content
adsenseBottom: true # If adsense property is set (params.info.adsense) include an ad below content
hidden: true # If true, page will not be shown in the list view
```
## Build
```
hugo server
```
You can go to localhost:1313 and this theme should be visible.
## License
Kiss is licensed under the MIT license. Check the [LICENSE](LICENSE.md) file for details.
The following resources are included in the theme:
- [Feather](https://feather.netlify.com/) by Cole Bemis - Licensed under the [MIT License](https://github.com/colebemis/feather/blob/master/LICENSE).
## Author
[Emir Ribic](https://github.com/ribice)
|
