Migrating Bootstrap docs to Hugo

Re highlight, I implemented inline shortcodes to cover your use cases. I think it helps to remember that shortcodes can be nested, eg.:

{{< highlight go >}}
{{< foo.inline >}}
func foo() {
  fmt.Println("{{ .Site.Title }}");
{{< /foo.inline >}}
{{< /highlight >}}

Here’s the doc on those inline shortcodes, I think this is what you’re looking for: https://gohugo.io/templates/shortcode-templates/#inline-shortcodes

But one can’t use shortcodes in template partials, right?

I have shown you two variants above to cover your needs. For the example you presented above in the template partial, I think you currently would need to do something ala:

{{ $str := "" }}
{{ $str = $str | add (printf "<script src=%q></script>\n" .Site.Title) }}
{{ $str = $str | add (printf "<script src=%q></script>\n" .Site.Title) }}

{{ highlight $str "html" "" }}  

Others will chime in if the above can be done simpler. The above may look clunky, but it certainly works – and it has the added benefit that it can be made into a general loop (if you organize your params a little different).

Also note that both Hugo and Go’s template engine will improve in this and other department.

Thanks for the reply, I’m still trying to understand how I can make this modular.

With Jekyll we did

{% capture example %}
{% for color in site.data.theme-colors %}
<div class="alert alert-{{ color.name }}" role="alert">
  A simple {{ color.name }} alert—check it out!
</div>{% endfor %}
{% endcapture %}
{% include example.html content=example %}

We pass many such cases. If it was one I’d make a shortcode just for this. But I’m trying to find a way to make this modular.

I have made an example shortcode which takes care of the normal examples, but doesn’t work in the above cases.

{{< example html >}}
{{- range $i, $color := $.Site.Data.theme_colors -}}
<div class="alert alert-{{ .name }}" role="alert">
  A simple {{ .name }} alert—check it out!
{{- end -}}
{{< /example >}}

Maybe I’m missing an important bit in the new inline shortcodes, so please bear with me :slight_smile:

I think you need to understand shortcodes in general. I would very much like to help you, but I don’t think this forum is a good … forum to help you with concrete cases. If you have a PR/branch somewhere where you can make me a collabrator (give me commit access), then I could provide running examples/fixes of this.

Thank you for the offer! I added you in my fork. The branch is v4-dev-xmr-hugo-2.

1 Like

If you have issues after doing npm i when running npm run docs-serve, please run npm run css-copy & npm run js-copy. I still haven’t found a cleaner way to do this unfortunately .

I have pushed a fix for that issue to the branch. I suggest that we take further questions on that repo (create an issue and mention my name…)

Thank you very much! Now I finally get how it works :slight_smile:

I enabled the issues in my fork, and I’m gonna make an issue with the remaining stuff after I finish most of the easy remaining ones.

1 Like