diff --git a/Home.md b/Home.md index 6ac6e47..3bf6c37 100644 --- a/Home.md +++ b/Home.md @@ -78,8 +78,15 @@ ### Change Default Format ## Usage -After successful [installation](#installing), code blocks with the appropriate -language will now be converted to images. +Code blocks with the appropriate language label will be converted to an image. +Specifying the language of a code block depends on the template +engine—examples are provided in this section. Refer to the +[supported diagrams](#supported-diagrams) section for a list of diagram +languages. + +### Markdown + +For Markdown, specify the diagram language after the starting triple backticks: ````markdown ```plantuml @@ -90,6 +97,25 @@ ## Usage ``` ```` +### HTML-Like Template Engines Such as Vento and JSX + +Template engines which have HTML-like syntax can specify the language using the +`class` or `className` attribute: + +```vento +
+
+ @startuml
+ Alice -> Bob: Hi
+ Bob -> Alice: Hi
+ @enduml
+
+
+```
+
+> [!NOTE]
+> The language name must be prefixed with `language-`.
+
## Supported Diagrams
A table of supported diagrams—each with their available output formats and