HUGO

List of Shortcodes used within .Page

Hi,

I know that there is the .HasShortcode test, but I was wondering if there is a way (other than some RegExs) to list the shortcodes used within a page along with their parameters.

My intention is to insert code blocks (each which runs its own canvas (using p5.js and/or two.js)) with shortcodes and then go through them to either load them in a <head> partial and/or <script> element after the <body>.

For example:

with a directory structure like this:

site/
├── content/
│   ├── pageA/
│   ├── pageB/
│   └── pageC/
│       └── index.md
│       └── scriptA.js
│       └── scriptB.js
└── static/
    ├── libs/
    └── libA.js
    └── libB.js

And looking at site/content/pageC/index.md


---
title : example page
---

{{< canvasScript src="scriptA.js" dep="libA.js" >}}
{{< canvasScript src="scriptB.js" dep="libB.js" >}}

If I can get a list of the shortcodes used then I can insert the dependencies within the <head> and even the <scripts> after the <body>

a note: I was doing this before with frontmatter but this lacks the elegance of what I’m looking for.

Thanks, hgs

I think that would be super useful as well. But I don’t think there is an implementation for it. Have a look at this thread, where something similar is done for a todo shortcode and it’s parameter.

Another workaround I thought of was to add to a scratch for each specific site that is filled from the shortcode to pass the parameter to that scratch. So when I iterate over that scratch I have the information. I haven’t tried to implement it though. It might not work in your case, because the head is probably build before the content and shortcodes are processed. But maybe referencing in the footer would work…

Yeah, it seems that .RawContent is not available after it has been processed? which means that even if you do this with regexs, then they will have to be different depending on when/where you do this during a .Page build/render.

I’ll try with a .Page Scratch and report back.

Yeah, b/c the .Content (and along with it, it’s shortcodes) has not been built at the time of building the <head> using a .Scratch which picks up parameters from within a shortcode doesn’t work.

Though, since we already have .HasShortcode which can be used before the .Content is built, there exists, somewhere, an interface to reach into the .Content and find things. Can we use this in some way?

1 Like

I know this is an old post but in case it’s helpful for others.

This relates to a problem I encounter frequently. For example using a shortcode for page section titles and then creating an anchor menu above the content to “Jump to” a section.

The shortcode passes the section’s title info to the page’s Scratch (in an array). Since the “Jump to” menu comes before the page’s content the Scratch variables set by the shortcode don’t exist. So to compensate for this I instead render the content to a variable at the top of the page’s template, which processes the shortcodes and populates Scratch. Now you can access the variables from the page’s content before you decide to print it out.

<!-- Process shortcodes in content -->
{{ $content := .Content }}
<!-- Use variables passed via Scratch from shortcodes in content -->
{{ partial "anchor-menu.html" . }}
<!-- Printing out the pages content that has the shortcodes -->
<div id="page-content">
      {{ $content }}
</div>
1 Like

@bep, would it be possile to make this feature? Or t least a .GetShortcodes, which lists the names of the shortcodes used in the page? Thanks :slight_smile:

1 Like