Shortcode in Markdown
Gli shortcode sono una sintassi speciale che consente di incorporare funzionalità complesse nei documenti Markdown senza scrivere codice HTML o JavaScript completo.
Cosa sono gli Shortcode?
Gli shortcode sono brevi frammenti di codice forniti dai generatori di siti statici (come Hugo, Jekyll, Gatsby) per chiamare funzionalità o componenti predefiniti in Markdown.
Sintassi di base
Hugo
markdown
{{< shortcode-name param1="value1" >}}Jekyll
markdown
{% shortcode_name param1='value1' %}Docusaurus / MDX
markdown
<ShortcodeName param1="value1" />Shortcode comuni
Media
markdown
{{< youtube "dQw4w9WgXcQ" >}}
{{< vimeo "123456789" >}}Box di avviso
markdown
{{< note >}}
Questa è una nota.
{{< /note >}}
{{< warning >}}
Questo è un avviso.
{{< /warning >}}Schede
markdown
{{< tabs >}}
{{< tab "Scheda 1" >}}
Contenuto della scheda 1.
{{< /tab >}}
{{< tab "Scheda 2" >}}
Contenuto della scheda 2.
{{< /tab >}}
{{< /tabs >}}Creare shortcode personalizzati
Shortcode personalizzato Hugo
layouts/shortcodes/highlight-box.html:
html
<div class="highlight-box">
{{ .Inner | markdownify }}
</div>Uso:
markdown
{{< highlight-box >}}
Questo è contenuto **importante**.
{{< /highlight-box >}}Migliori pratiche
markdown
# Bene: semplice e chiaro
{{< note >}}
Nota importante
{{< /note >}}
# Evitare: troppo complesso
{{< container type="note" style="background:blue" >}}
Nota importante
{{< /container >}}Conclusione
Gli shortcode sono uno strumento potente per estendere le funzionalità di Markdown. Ti consentono di aggiungere funzionalità interattive ricche mantenendo la leggibilità dei contenuti.