diff options
| author | Bjørn Erik Pedersen <bjorn.erik.pedersen@gmail.com> | 2024-01-27 10:48:33 +0100 |
|---|---|---|
| committer | Bjørn Erik Pedersen <bjorn.erik.pedersen@gmail.com> | 2024-01-27 10:48:57 +0100 |
| commit | 5fd1e7490305570872d3899f5edda950903c5213 (patch) | |
| tree | f0cdc490a0942d720494c0044a64c6397d1ab6a5 /docs/content/en/methods/page/HasShortcode.md | |
| parent | fc7de7136acbcf0aef54ae8460c7702bc83709be (diff) | |
| parent | 9b0050e9aabe4be65c78ccf292a348f309d50ccd (diff) | |
| download | hugo-5fd1e7490305570872d3899f5edda950903c5213.tar.gz hugo-5fd1e7490305570872d3899f5edda950903c5213.zip | |
Merge commit '9b0050e9aabe4be65c78ccf292a348f309d50ccd' as 'docs'
```
git subtree add --prefix=docs/ https://github.com/gohugoio/hugoDocs.git master --squash
```
Closes #11925
Diffstat (limited to 'docs/content/en/methods/page/HasShortcode.md')
| -rw-r--r-- | docs/content/en/methods/page/HasShortcode.md | 50 |
1 files changed, 50 insertions, 0 deletions
diff --git a/docs/content/en/methods/page/HasShortcode.md b/docs/content/en/methods/page/HasShortcode.md new file mode 100644 index 000000000..2846e9535 --- /dev/null +++ b/docs/content/en/methods/page/HasShortcode.md @@ -0,0 +1,50 @@ +--- +title: HasShortcode +description: Reports whether the given shortcode is called by the given page. +categories: [] +keywords: [] +action: + related: [] + returnType: bool + signatures: [PAGE.HasShortcode NAME] +--- + +By example, let's use [Plotly] to render a chart: + +[Plotly]: https://plotly.com/javascript/ + +{{< code file=contents/example.md lang=markdown >}} +{{</* plotly */>}} +{ + "data": [ + { + "x": ["giraffes", "orangutans", "monkeys"], + "y": [20, 14, 23], + "type": "bar" + } + ], +} +{{</* /plotly */>}} +{{< /code >}} + +The shortcode is simple: + +{{< code file=layouts/shortcodes/plotly.html >}} +{{ $id := printf "plotly-%02d" .Ordinal }} +<div id="{{ $id }}"></div> +<script> + Plotly.newPlot(document.getElementById({{ $id }}), {{ .Inner | safeJS }}); +</script> +{{< /code >}} + +Now we can selectively load the required JavaScript on pages that call the "plotly" shortcode: + +{{< code file=layouts/baseof.html >}} +<head> + ... + {{ if .HasShortcode "plotly" }} + <script src="https://cdn.plot.ly/plotly-2.28.0.min.js"></script> + {{ end }} + ... +</head> +{{< /code >}} |