summaryrefslogtreecommitdiff
path: root/themes/LoveIt/exampleSite/content/posts/theme-documentation-built-in-shortcodes/index.en.md
diff options
context:
space:
mode:
authorChristoph Cullmann <cullmann@kde.org>2022-08-14 19:01:21 +0200
committerChristoph Cullmann <cullmann@kde.org>2022-08-14 19:01:21 +0200
commit51fb029ca27d67d7cd67352cdede45e5b25868f7 (patch)
tree6d8e34b2abdc757310ffe11189e926d017417bae /themes/LoveIt/exampleSite/content/posts/theme-documentation-built-in-shortcodes/index.en.md
parent260b6803e78609e16ad3d59792f1681d9df0f1e4 (diff)
switch back to LoveIt, other theme is deprectated
Diffstat (limited to 'themes/LoveIt/exampleSite/content/posts/theme-documentation-built-in-shortcodes/index.en.md')
-rw-r--r--themes/LoveIt/exampleSite/content/posts/theme-documentation-built-in-shortcodes/index.en.md179
1 files changed, 179 insertions, 0 deletions
diff --git a/themes/LoveIt/exampleSite/content/posts/theme-documentation-built-in-shortcodes/index.en.md b/themes/LoveIt/exampleSite/content/posts/theme-documentation-built-in-shortcodes/index.en.md
new file mode 100644
index 0000000..a94d81e
--- /dev/null
+++ b/themes/LoveIt/exampleSite/content/posts/theme-documentation-built-in-shortcodes/index.en.md
@@ -0,0 +1,179 @@
+---
+weight: 3
+title: "Theme Documentation - Built-in Shortcodes"
+date: 2020-03-04T16:29:41+08:00
+lastmod: 2020-03-04T16:29:41+08:00
+draft: false
+author: "Dillon"
+authorLink: "https://dillonzq.com"
+description: "Hugo provides multiple built-in shortcodes for author convenience and to keep your markdown content clean."
+images: []
+resources:
+- name: "featured-image"
+ src: "featured-image.png"
+
+tags: ["shortcodes"]
+categories: ["documentation"]
+
+lightgallery: true
+---
+
+**Hugo** provides multiple built-in shortcodes for author convenience and to keep your markdown content clean.
+
+<!--more-->
+
+Hugo uses Markdown for its simple content format. However, there are a lot of things that Markdown doesn’t support well. You could use pure HTML to expand possibilities.
+
+But this happens to be a bad idea. Everyone uses Markdown because it’s pure and simple to read even non-rendered. You should avoid HTML to keep it as simple as possible.
+
+To avoid this limitations, Hugo created [shortcodes](https://gohugo.io/extras/shortcodes/).
+A shortcode is a simple snippet that can generate reasonable HTML code and conforms to Markdown's design philosophy.
+
+Hugo ships with a set of predefined shortcodes that represent very common usage. These shortcodes are provided for author convenience and to keep your markdown content clean.
+
+## 1 figure {#figure}
+
+[Documentation of `figure`](https://gohugo.io/content-management/shortcodes#figure)
+
+Example `figure` input:
+
+```markdown
+{{</* figure src="/images/lighthouse.jpg" title="Lighthouse (figure)" */>}}
+```
+
+The rendered output looks like this:
+
+{{< figure src="/images/lighthouse.jpg" title="Lighthouse (figure)" >}}
+
+The HTML looks like this:
+
+```html
+<figure>
+ <img src="/images/lighthouse.jpg"/>
+ <figcaption>
+ <h4>Lighthouse (figure)</h4>
+ </figcaption>
+</figure>
+```
+
+## 2 gist
+
+[Documentation of `gist`](https://gohugo.io/content-management/shortcodes#gist)
+
+Example `gist` input:
+
+```markdown
+{{</* gist spf13 7896402 */>}}
+```
+
+The rendered output looks like this:
+
+{{< gist spf13 7896402 >}}
+
+The HTML looks like this:
+
+```html
+<script type="application/javascript" src="https://gist.github.com/spf13/7896402.js"></script>
+```
+
+## 3 highlight
+
+[Documentation of `highlight`](https://gohugo.io/content-management/shortcodes#instagram)
+
+Example `highlight` input:
+
+```markdown
+{{</* highlight html */>}}
+<section id="main">
+ <div>
+ <h1 id="title">{{ .Title }}</h1>
+ {{ range .Pages }}
+ {{ .Render "summary"}}
+ {{ end }}
+ </div>
+</section>
+{{</* /highlight */>}}
+```
+
+The rendered output looks like this:
+
+{{< highlight html >}}
+<section id="main">
+ <div>
+ <h1 id="title">{{ .Title }}</h1>
+ {{ range .Pages }}
+ {{ .Render "summary"}}
+ {{ end }}
+ </div>
+</section>
+{{< /highlight >}}
+
+## 4 instagram
+
+[Documentation of `instagram`](https://gohugo.io/content-management/shortcodes#instagram)
+
+{{< admonition question "Instagram’s API was deprecated since October 24th, 2020" >}}
+The instagram-shortcode refers an endpoint of Instagram’s API, that’s deprecated since October 24th, 2020.
+Thus, no images can be fetched from this API endpoint, resulting in an error when the instagram-shortcode is used.
+For more information please have a look at GitHub issue [#7879](https://github.com/gohugoio/hugo/issues/7879).
+{{< /admonition >}}
+
+## 5 param
+
+[Documentation of `param`](https://gohugo.io/content-management/shortcodes#param)
+
+Example `param` input:
+
+```markdown
+{{</* param description */>}}
+```
+
+The rendered output looks like this:
+
+{{< param description >}}
+
+## 6 ref and relref {#ref-and-relref}
+
+[Documentation of `ref` and `relref`](https://gohugo.io/content-management/shortcodes#ref-and-relref)
+
+## 7 tweet
+
+[Documentation of `tweet`](https://gohugo.io/content-management/shortcodes#tweet)
+
+Example `tweet` input:
+
+```markdown
+{{</* tweet 917359331535966209 */>}}
+```
+
+The rendered output looks like this:
+
+{{< tweet 917359331535966209 >}}
+
+## 8 vimeo
+
+[Documentation of `vimeo`](https://gohugo.io/content-management/shortcodes#vimeo)
+
+Example `vimeo` input:
+
+```markdown
+{{</* vimeo 146022717 */>}}
+```
+
+The rendered output looks like this:
+
+{{< vimeo 146022717 >}}
+
+## 9 youtube
+
+[Documentation of `youtube`](https://gohugo.io/content-management/shortcodes#youtube)
+
+Example `youtube` input:
+
+```markdown
+{{</* youtube w7Ft2ymGmfc */>}}
+```
+
+The rendered output looks like this:
+
+{{< youtube w7Ft2ymGmfc >}}