hugo-theme-introduction/exampleSite/content/en/blog/configuration.md
Victoria Drake e781be1620 Add example site configuration post, shortcodes
- Hopefully help explain related issues #217, #194

Close #226
2020-07-25 09:57:40 -04:00

2 KiB

title date tags
Theme Features 2020-07-25T02:04:06-05:00
code

Here are some helpful tips for setting up this theme.

Syntax Highlighting

Introduction allows the use of Hugo's rich built-in syntax highlighting capabilities. See Syntax Highlighting in the Hugo docs.

Below is an example configuration for Highlight. See Highlight in the Hugo docs for more.

[markup]
  [markup.highlight]
    codeFences = true
    guessSyntax = false
    hl_Lines = ""
    lineNoStart = 1
    lineNos = false
    lineNumbersInTable = true
    noClasses = true
    # For styles, see https://xyproto.github.io/splash/docs/longer/all.html
    style = "friendly"
    tabWidth = 4

Shortcodes

Custom shortcodes can be added to a layouts/shortcodes/ directory in your site root. Below, I use two custom shortcodes to display a data file: the current configuration file for this site! See the source for this page to understand how to use shortcodes.

Show HTML in Posts

To ensure Hugo renders any HTML that your shortcode or other additions like Font Awesome uses in posts, make sure these lines for the Goldmark renderer are in your config.toml:

[markup]
defaultMarkdownHandler = "goldmark"

[markup.goldmark]

[markup.goldmark.renderer]
unsafe = true

Configuration

Introduction can be easily configured using Hugo's configuration file. You can copy the config.toml in the exampleSite/ to your site root get started.

Here are all the options included in the configuration file for this example site!

{{% md %}}
{{< readfile file="config.toml" >}}
{{% /md %}}