Is there some pre-packaged way to use Kroki from markdown?

mkdocs provides mkdocs-kroki-plugin · PyPI which makes it possible to do something like:

```kroki-blockdiag
blockdiag {
  blockdiag -> generates -> "block-diagrams";
  blockdiag -> is -> "very easy!";

  blockdiag [color = "greenyellow"];
  "block-diagrams" [color = "pink"];
  "very easy!" [color = "orange"];
}
```

And then get image embedded in your output:
f

Is there something that can do this for markdown in hugo that I don’t have to code up myself?

I think for asciidoc(tor) it is possible, but would like it for markdown also.

1 Like

No there is no way to use Python plugins in Hugo.

There is no API.

Kroki is not a python plugin, Kroki is a web service for rendering diagrams from text. mkdocs-kroki-plugin · PyPI is a python plugin for mkdocs that uses the kroki web service, no code in that is needed to create a diagram from text, that code only integrates mkdocs (a completely different static site generator) with kroki, and I understand that I can’t use plugins for mkdocs in hugo, I was asking if there is something similar for hugo, not if I can use the same plugin for hugo.

No, there is no support for rendering diagrams natively in Hugo.

But others are using ascii-doctor along with Hugo, so perhaps you can try going that route.

@aucampia Please take this for a spin.

git clone --single-branch -b hugo-forum-topic-36924 https://github.com/jmooring/hugo-testing hugo-forum-topic-36924
cd hugo-forum-topic-36924
hugo server

The shortcode can be used with content:

{{< kroki type="actdiag" >}}
{
  write -> convert -> image

  lane user {
    label = "User"
    write [label = "Writing reST"];
    image [label = "Get diagram IMAGE"];
  }
  lane actdiag {
    convert [label = "Convert reST to Image"];
  }
}
{{< /kroki >}}

Or by pointing at a page resource:

{{< kroki type="actdiag" file="diagram-a.txt" >}}

This wasn’t possible prior to the introduction of resources.GetRemote in v0.90.0.

5 Likes