File
The file shortcode prints the full content of any given file with syntax highlighting.
The file
shortcode prints and highlights the full content of a given input file. It recognizes the
languages supported by Hugo’s highlight function
.
[en]
languageName = "English"
contentDir = "content/en"
weight = 1
[en.params.head]
tagline = "A Hugo Theme"
[en.params.footer]
license = "Code licensed <a href='https://github.com/gethinode/hinode/blob/main/LICENSE' class='link-bg-footer fw-medium' target='_blank' rel='noopener noreferrer'>MIT</a>, docs <a href='https://creativecommons.org/licenses/by-nc/4.0/' class='link-bg-footer fw-medium' target='_blank' rel='noopener noreferrer'>CC BY-NC 4.0</a>"
{{< file path="./config/_default/languages.toml" id="file-collapse-1" >}}
Important
The definition of the default
id
field fails when embedding (multiple)file
shortcodes in an example. Provide an explicit, uniqueid
to prevent cross-interference.
The shortcode supports the following arguments:
Name | Type | Required | Default | Comment |
---|---|---|---|---|
class | string | Class attribute of the tab control that wraps the file element. | ||
full | bool | true | If unset, shows the filename only. By default, the entire path (relative to the base path) is shown. | |
id | string | Identifier of the collapse panel, defaults to file-collapse-n with a sequential number n starting at 1. |
||
lang | string | Language to be used by the syntax highlighter. If not set, the language is derived from the file extension. | ||
options | string | v0.27.6 Hugo highlighting options. | ||
path | string | yes | Path of the input file. The path is relative to the basePath defined in the docs section of the site’s parameters. If the file starts with ./ , the path of the repository is used as base path instead. |
|
show | bool | If unset, shows the panel with the code in collapsed state. By default, the panel is expanded. |
Change the style and language of your file preview with shortcode arguments.
Use the path
argument to print the content of a specific file. By default, the shortcode uses the site’s basePath
(see
page layout for more information).
# toml-docs-start lang-main
[en]
languageName = "English"
contentDir = "content"
weight = 1
# toml-docs-end lang-main
# toml-docs-start lang-param
[en.params.head]
tagline = "A Hugo Theme"
[en.params.social]
title = "Follow me"
caption = "I work on everything coding and tweet developer memes"
[en.params.footer]
# license = "Licensed under Creative Commons (<a href='https://creativecommons.org/licenses/by-nc-sa/4.0/' class='link-secondary' target='_blank' rel='noopener noreferrer nofollow'>CC BY-NC-SA 4.0</a>)."
# toml-docs-end lang-param
{{< file path="config/_default/languages.toml" id="file-collapse-2" >}}
Provide a path that starts with ./
to use the path of the repository as base path instead.
[en]
languageName = "English"
contentDir = "content/en"
weight = 1
[en.params.head]
tagline = "A Hugo Theme"
[en.params.footer]
license = "Code licensed <a href='https://github.com/gethinode/hinode/blob/main/LICENSE' class='link-bg-footer fw-medium' target='_blank' rel='noopener noreferrer'>MIT</a>, docs <a href='https://creativecommons.org/licenses/by-nc/4.0/' class='link-bg-footer fw-medium' target='_blank' rel='noopener noreferrer'>CC BY-NC 4.0</a>"
{{< file path="./config/_default/languages.toml" id="file-collapse-3" >}}
Set show
to false
to hide the file content on page load. The content is revealed when clicking the tab control.
[en]
languageName = "English"
contentDir = "content/en"
weight = 1
[en.params.head]
tagline = "A Hugo Theme"
[en.params.footer]
license = "Code licensed <a href='https://github.com/gethinode/hinode/blob/main/LICENSE' class='link-bg-footer fw-medium' target='_blank' rel='noopener noreferrer'>MIT</a>, docs <a href='https://creativecommons.org/licenses/by-nc/4.0/' class='link-bg-footer fw-medium' target='_blank' rel='noopener noreferrer'>CC BY-NC 4.0</a>"
{{< file show="false" path="./config/_default/languages.toml" id="file-collapse-4" >}}
Set full
to false
to show the filename only.
[en]
languageName = "English"
contentDir = "content/en"
weight = 1
[en.params.head]
tagline = "A Hugo Theme"
[en.params.footer]
license = "Code licensed <a href='https://github.com/gethinode/hinode/blob/main/LICENSE' class='link-bg-footer fw-medium' target='_blank' rel='noopener noreferrer'>MIT</a>, docs <a href='https://creativecommons.org/licenses/by-nc/4.0/' class='link-bg-footer fw-medium' target='_blank' rel='noopener noreferrer'>CC BY-NC 4.0</a>"
{{< file full="false" path="./config/_default/languages.toml" id="file-collapse-5" >}}
Use the
Hugo syntax highlighting options
for marking lines in the file. Pass the settings to the options
argument.
|
|
{{< file full="false" path="./config/_default/languages.toml" id="file-collapse-5"
options="linenos=table,hl_lines=2-4 6,linenostart=10" >}}