How-To Combine Function with ShortCode in Hugo

How can I combine functions into short codes for GoHugo

DATA/CONTENT.toml

content1 = """"

This is content 1

""""

content2 = """"

This is content 2

""""

/LAYOUTS/INDEX.HTML

{{ with .Site.Data.content.content1 }}
         <div> {{ . | markdownify }} </div>
 {{ end }}

{{ with .Site.Data.content.content1 }}
         <div> {{ . | markdownify }} </div>
{{ end }}

I want to apply the code to the contents of _index.md using shortcodes,

Example :{{< content dir="content1" />}}

I’m working hard, to move 10 sites from Jekyll. Please help me, I am new to the Gohugo community :wink:

thank you,

Question

What are you trying to accomplish here? Surely your content should be in the content file itself, not in the front matter. I notice the dir named parameter though - are you trying to make a section in some weird, roundabout way?

I can tell you with near certainty that there is a much better way to go about this than whatever you are trying to do…

That said, I also answered the question you asked. But rather than just take the answer and use it, let us help you better accomplish… whatever you’re trying to do.

The shortcode

In layouts/shortcodes/content.html

<div>{{ .Inner }}</div>

In the content file:

Blah blah blah...

{{% content %}}
This is *automatically* parsed as markdown.
{{% /content %}}

There are two ways of calling a shortcode, one of which parses the content as markdown automatically. See the docs.

Alternatively

You can also put HTML into the content file directly, so

Random markdown content

<div>
My div content
</div>

will work just as well.

1 Like