📝 docs: add mermaid shortcode usage (#407)

Co-authored-by: welpo <welpo@users.noreply.github.com>

content/blog/shortcodes/index.ca.md

@@ -91,6 +91,18 @@ El shortcode de Mermaid admet dos paràmetres:
 
 {{ admonition(type="tip", title="CONSELL", text="Empra l'[editor de Mermaid](https://mermaid.live/) per crear i previsualitzar els teus diagrames.") }}
 
+#### Ús
+
+```
+{%/* mermaid(invertible=true, full_width=false) */%}
+
+El teu codi Mermaid va aquí.
+
+`invertible` or `full_width` poden ometre's per emprar els valors per defecte.
+
+{%/* end */%}
+```
+
 ## Shortcodes d'imatge
 
 Tots els shortcodes d'imatge admeten rutes absolutes, rutes relatives, i fonts remotes en el paràmetre `src`.

content/blog/shortcodes/index.es.md

@@ -91,6 +91,16 @@ El shortcode de Mermaid admite dos parámetros:
 
 {{ admonition(type="tip", title="CONSEJO", text="Puedes usar el [editor de Mermaid](https://mermaid.live/) para crear y previsualizar tus diagramas.") }}
 
+#### Uso
+
+```
+{%/* mermaid(invertible=true, full_width=false) */%}
+
+Tu diagrama Mermaid va aquí. Puedes omitir los parámetros para usar los valores predeterminados.
+
+{%/* end */%}
+```
+
 ## Shortcodes de imagen
 
 Todos los shortcodes de imagen admiten rutas absolutas, rutas relativas, y fuentes remotas en el parámetro `src`.

content/blog/shortcodes/index.md

@@ -91,6 +91,18 @@ The Mermaid shortcode supports two parameters:
 
 {{ admonition(type="tip", text="You can use the [Mermaid Live Editor](https://mermaid.live/) to create and preview your diagrams.") }}
 
+#### Usage
+
+```
+{%/* mermaid(invertible=true, full_width=false) */%}
+
+Your diagram goes here.
+
+`invertible` or `full_width` can be omitted if default values are used.
+
+{%/* end */%}
+```
+
 ## Image shortcodes
 
 All image shortcodes support absolute paths, relative paths, and remote sources in the `src` parameter.