Error with my Highlight shortcode

support
1

Hey folks!

Getting back with Hugo after a long time!

I’m trying to create a custom highlight shortcode to add some functionality to it. Here’s the code for now:

{{- $count := 1 -}}
{{- $id := .Get 1 -}}
{{- $lang := .Get 0 -}}
{{- $regex := (findRE "[^\r\n]*" (trim .Inner "\n")) -}}
<div class = "bg-[#282a36] relative rounded-lg w-full">
  <table class = "pt-8">
    <tbody>
      <tr>
        <td class = "pl-1 text-right">
          {{- range $regex -}}
            <a class = "block no-underline text-[#f8f8f2]/50" href = "#{{- $id -}}-{{- $count -}}" id = "{{- $id -}}-{{- $count -}}">
              {{- $count -}}
            </a>
            {{ $count = add $count 1 }}
          {{- end -}}
        </td>
        <td class = "pl-2.5">
          {{- range $regex -}}
            {{- if findRE . "\n" -}}
              <br/>
            {{- else -}}
              {{- highlight . $lang "" -}}
            {{- end -}}
          {{- end -}}
        </td>
      </tr>
    </tbody>
  </table>
  <div class = "absolute bg-[#ffad42] flex items-center p-1 right-0 rounded-bl-lg rounded-tr-lg text-[#472d0b] top-0">
    <span class = "mr-0.5">
      {{- upper $lang -}}
    </span>
    {{- partial "icon.html" (dict "context" . "path" "M8 5H6a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2v-1M8 5a2 2 0 002 2h2a2 2 0 002-2M8 5a2 2 0 012-2h2a2 2 0 012 2m0 0h2a2 2 0 012 2v3m2 4H10m0 0l3-3m-3 3l3 3") -}}
  </div>
</div>

This might be a bit hacky, but gets the job done (though I’m open for improvements).

This adds the following features:

  1. Unique IDs for line-numbers on the same page.
  2. Copy code button in the top right

It’s working fine except for this piece of text:

{{< highlight txt 24 >}}
{
  [
    "foo",
    2020-06-23 20:28:31.084 UTC
  ],
  [
    "bar",
    2020-10-15 09:43:22.306 UTC
  ]
}
{{< /highlight >}}

I get the error:

failed to render shortcode "highlight": failed to process shortcode: "/layouts/shortcodes/highlight.html:19:19": execute of template failed: template: shortcodes/highlight.html:19:19: executing "shortcodes/highlight.html" at <findRE . "\n">: error calling findRE: error parsing regexp: missing closing ]: `[`

I can’t seem to understand why it needs the bracket to be closed for the RegEx to work. I should be able to pass any string in there, correct? Am I missing something?

2

Args are reversed.

3

Oops, yeah that was it. Wonder how it was producing expected results for other code blocks and now it doesn’t work :man_facepalming:. Anyways, that’s for me to fix. Thanks!

4

In case anyone comes across this in future, now this part works:

        <td class = "pl-2.5">
          {{- range $regex -}}
            {{- if eq (len .) 0 -}}
              <br/>
            {{- else -}}
              {{- highlight . $lang "" -}}
            {{- end -}}
          {{- end -}}
        </td>

This part should go in place of the second <td>.

5

With v0.90.0 and later, the options arg to the highlight function is optional.

https://github.com/gohugoio/hugo/issues/9249

6

That’s awesome! I had not checked it, thanks!

7

This topic was automatically closed 2 days after the last reply. New replies are no longer allowed.