Featured image of post Coder
Theme

Coder

Coder是一款Hugo的简洁博客主题

配置

关于Hugo配置

本主题支持:

评论系统

评论会显示在帖子页面中，但可以通过“disableComments”设为首页禁用。

Disqus

参考 此文.

Commento 

1
2

[params]
  commentoURL = "https://cdn.commento.io" # Replace if you use a custom domain

Utterances 

1
2
3
4
5

[params.utterances]
  repo = "" # https://utteranc.es/#heading-repository
  issueTerm = "" # https://utteranc.es/#heading-mapping
  label = "" # https://utteranc.es/#heading-issue-label
  theme = "" # https://utteranc.es/#heading-theme

Giscus 

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14

[params.giscus] # https://giscus.app
  repo = ""
  repoID = ""
  category = ""
  categoryID = ""
  mapping = ""
  term = ""
  strict = ""
  reactionsEnabled = ""
  emitMetadata = ""
  inputPosition = ""
  theme = ""
  lang = ""
  loading = ""

Telegram 

1
2
3
4
5
6
7
8
9

[params.telegram] # https://comments.app/
  siteID = ""
  limit = ""
  height = ""
  color = ""
  dislikes = ""
  outlined = ""
  colorful = ""
  dark = ""

Cusdis 

1
2

[params.cusdis] # https://cusdis.com
  data_app_id = ""

语法高亮

主题使用Goldmark语法高亮显示系统。GitHub的浅色和深色设置为默认样式。要选择不同的样式，请确保“noClasses”未设置为false（默认值为true），并将其添加到“config.toml”中：

1
2

[markup.highlight]
style = "monokai"

所有style可参考 此文.

或者，可以对生成的CSS文件使用自定义样式。 参见 此文.

主题参数

这些都是“hugo coder”主题使用的参数。

Name Type Required Description Default Example
author string Yes 作者名 "John Doe"
info string Yes An headline, job title or similar. "Full Stack Developer"
description string Yes 站点描述 "John Doe's personal website"
keywords string Yes 站点关键词 "blog,developer,personal"
avatarURL string No 作者照片 "images/avatar.jpg"
gravatar string No 作者Gravatar图像 "[email protected]"
faviconSVG string No Custom path to a SCG favicon. "/img/favicon.svg" "/img/favicon.svg"
favicon_32 string No Custom path to a 32x32 favicon. "/img/favicon-32x32.png" "/img/favicon-32x32.png"
favicon_16 string No Custom path to a 16x16 favicon. "/img/favicon-16x16.png" "/img/favicon-16x16.png"
touchIcon string No Custom path to an apple-touch-icon "/images/apple-touch-icon.png" "/images/apple-touch-icon.png"
mask_icon string No Custom path to a mask-icon "/images/safari-pinned-tab.svg" "/images/safari-pinned-tab.svg"
mask_icon_color string No Custom color for mask-icon color "#5bbad5" "#5bbad5"
since string No Date shown in the footer before now year "2020"
maxSeeAlsoItems number No Series see also post count 5 10
commit string No Show the last git commit in the footer "https://github.com/luizdepra/hugo-coder/tree/"
rtl bool No Enable the Right To Left mode. false true or false
math bool No Enable MathJax Module and add JS into your site. false true or false
katex bool No Enable katex for all content types. false true or false
colorScheme string No Specify light/dark colorscheme "auto" "auto" or "light" or "dark"
hideColorSchemeToggle bool No If true, hides the color scheme toggle false true or false
customCSS list No Add extra CSS files to the website. [] ["css/extra-style.css"]
customSCSS list No Add extra SCSS files to the website. [] ["scss/extra-style.scss"]
customJS list No Add extra JS files to the website. [] ["js/extra-script.js"]
customRemoteJS list No Add extra remote JS files to the website. [] ["https://www.example.com/file.js"]
enableTwemoji bool No Adds support for Twemoji false true or false
disableDefaultJsScripts bool No If true, disables default js scripts (coder.js) false true or false

Social Icons Configuration

Social Icons are optional. To use them you will need to set at least all the following required parameters for each icon.

Configuration Type Required Description Example
name string Yes Icon name. "Github"
icon string Yes FontAwesome icon classes. "fa-brands fa-github"
weight int Yes Icon order. 1
url string Yes URL to redirect. "https://github.com/johndoe/"

An example:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15

[[params.social]]
  name = "Github"
  icon = "fa-brands fa-github fa-2x"
  weight = 1
  url = "https://github.com/johndoe/"
[[params.social]]
  name = "Gitlab"
  icon = "fa-brands fa-gitlab fa-2x"
  weight = 2
  url = "https://gitlab.com/johndoe/"
[[params.social]]
  name = "Twitter"
  icon = "fa-brands fa-x-twitter fa-2x"
  weight = 3
  url = "https://twitter.com/johndoe/"

Menu Items are optional. To use them you will need to set all the following required parameters for each icon.

Configuration Type Required Description Example
name string Yes Menu Item name. "Posts"
weight int Yes Menu Item order. 1
url string Yes URL to redirect. "/posts/"
class string No Menu Item extra class attribute. "menu-item"
target string No URL target attribute. "_blank"
rel string No URL rel attribute. "alternate"
type string No URL type attribute. "application/rss+xml"

An example:

1
2
3
4
5
6
7
8

[[menu.main]]
  name = "Blog"
  weight = 1
  url  = "posts/"
[[menu.main]]
  name = "About"
  weight = 2
  url = "about/"

CSP

CSP stands for Content Security Policy. These configurations are optional. To use them you will need to set all the following required parameters. See here for reference.

Configuration Type Required Description Example
childsrc string list Yes ["'self'"]
fontsrc string list Yes ["'self'"]
formaction string list Yes ["'self'"]
framesrc string list Yes ["'self'"]
imgsrc string list Yes ["'self'"]
objectsrc string list Yes ["'self'"]
stylesrc string list Yes ["'self'"]
scriptsrc string list Yes ["'self'"]
connectsrc string list Yes ["'self'"]

An 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

[params.csp]
  childsrc = ["'self'"]
  fontsrc = [
    "'self'",
    "https://fonts.gstatic.com",
    "https://cdn.jsdelivr.net/"
  ]
  formaction = ["'self'"]
  framesrc = ["'self'"]
  imgsrc = ["'self'"]
  objectsrc = ["'none'"]
  stylesrc = [
    "'self'",
    "'unsafe-inline'",
    "https://fonts.googleapis.com/",
    "https://cdn.jsdelivr.net/"
  ]
  scriptsrc = [
    "'self'",
    "'unsafe-inline'",
    "https://www.google-analytics.com"
  ]
  # connect-src directive – defines valid targets for XMLHttpRequest (AJAX), WebSockets or EventSource
  connectsrc = ["'self'"]

Complete Example

This is a complete configuration example with some recommended values.

 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

baseurl = "http://www.example.com"
title = "johndoe"
theme = "hugo-coder"
languagecode = "en"
defaultcontentlanguage = "en"

paginate = 20

[services]
[services.disqus]
disqusShortname = "yourdiscussshortname"

[markup.highlight]
style = "github-dark"

[params]
  author = "John Doe"
  info = "Full Stack DevOps and Magician"
  description = "John Doe's personal website"
  keywords = "blog,developer,personal"
  avatarurl = "images/avatar.jpg"
  #gravatar = "[email protected]"

  faviconSVG = "/img/favicon.svg"
  favicon_32 = "/img/favicon-32x32.png"
  favicon_16 = "/img/favicon-16x16.png"

  since = 2019

  enableTwemoji = true

  colorScheme = "auto"
  hidecolorschemetoggle = false

  # customCSS = ["css/custom.css"]
  # customSCSS = ["scss/custom.scss"]
  # customJS = ["js/custom.js"]

[taxonomies]
  category = "categories"
  series = "series"
  tag = "tags"
  author = "authors"

# Social links
[[params.social]]
  name = "Github"
  icon = "fa-brands fa-github fa-2x"
  weight = 1
  url = "https://github.com/johndoe/"
[[params.social]]
  name = "Gitlab"
  icon = "fa-brands fa-gitlab fa-2x"
  weight = 2
  url = "https://gitlab.com/johndoe/"
[[params.social]]
  name = "Twitter"
  icon = "fa-brands fa-x-twitter fa-2x"
  weight = 3
  url = "https://twitter.com/johndoe/"

# Menu links
[[menu.main]]
  name = "Blog"
  weight = 1
  url  = "posts/"
[[menu.main]]
  name = "About"
  weight = 2
  url = "about/"

Front Matter

Hugo documentation: https://gohugo.io/content-management/front-matter

This theme includes one content type:

  • Posts, useful to display blog posts

Posts

These are the front matter variables used by hugo-coder theme.

Name Type Required Description Default Example
tags list No Add tag(s) to this post. ["Hugo", "Go"]
categories list No Add categorie(s) to this post. ["Hugo", "Go"]
series list No Add series to this post (used by OpenGraph). ["Theme Demo"]
author list No Add author to this post. ["John Doe"]
externalLink string No Link to an external post. "https://github.com/luizdepra/hugo-coder/wiki"
featuredImage string No Link/path to add an image below post metadata. "https://github.com/luizdepra/hugo-coder/blob/master/images/screenshot.png"
math bool No If true, MathJax is enabled only for this post. false true or false
katex bool No If true, katex is enabled only for this post. false true or false
disableComments bool No If true, comments are disabled. false true or false
canonicalUrl string No Link to override in false "https://my-company.com/blog/my-blog-post-that-I-repost-without-hurtiong-seo"

“tags”, “categories”, “series” and “authors” are taxonomies defined in the config.toml file.

Multilingual-Mode

Available Languages

This theme supports the following languages:

  • Arabic
  • Bengali
  • Czech
  • German
  • English
  • Spanish
  • Finnish
  • French
  • Hebrew
  • Hindi
  • Hungarian
  • Italian
  • Japanese
  • Malay
  • Dutch
  • Polish
  • Brazilian Portuguese
  • Romanian
  • Russian
  • Swedish
  • Slovak
  • Turkish
  • Simplified Chinese
  • Taiwan Chinese
  • Urdu

Configure languages

Go to this Hugo documentation page to configure one or multiple languages for your website.

Translation File 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

[category]
other = "category"

[tag]
other = "tag"

[series]
other = "series"

[author]
other = "author"

[reading_time]
one = "One-minute read"
other = "{{ .Count }}-minute read"

[page_not_found]
other = "Page Not Found"

[page_does_not_exist]
other = "Sorry, this page does not exist."

[head_back]
other = "You can head back to <a href=\"{{ . }}\">homepage</a>."

[powered_by]
other = "Powered by"

[see_also]
other = "See also in"

via https://github.com/luizdepra/hugo-coder

comments powered by Disqus
CDN   VPS   Autohotkey   openSUSE   李跳跳   7zip   LTE中文网   QGIS中文网   白鹿原   冰与火之歌   LearnSQL   RGB色码   UNIX   晚清沧海事   十三经