Intégrer des liens
Cet article explique comment intégrer différents types de liens dans les pages de votre site Hugo. Ceci inclut les liens Markdown de base mais aussi des types de liens plus avancés comme les boutons et les cartes intégrées qui permettent de créer des liens plus visuels et attrayants vers d’autres pages de votre site ou vers des ressources externes.
Liens Markdown
Les liens de base du Markdown sont créés en entourant le texte du lien entre crochets [], suivi de l’URL entre parenthèses ().
Code :
Voici un lien : [ENSEIRB-MATMECA](https://enseirb-matmeca.bordeaux-inp.fr)
Résultat :
Voici un lien : ENSEIRB-MATMECA
Pour référencer une page de ce site, pouvez utiliser une URL relative à la racine du site (/). Exemple: /fr/tutorials/tuto-site/tuto-page-content/links/ pour référencer cette page.
Boutons
Il est possible de créer des boutons en utilisant le shortcode button. Celui-ci accepte les paramètres suivants:
- href: l’URL vers laquelle le bouton doit pointer.
- new-tab: si
true, le lien s’ouvrira dans un nouvel onglet. Par défaut, les liens s’ouvrent dans le même onglet. - icon: une classe d’icône font-awesome à afficher à côté du texte du bouton.
Boutons simples
Code :
{{% button href="/fr/tutorials/" %}}Voir tous les tutos{{% /button %}}
Résultat :
Boutons avec icônes
Code :
{{% button href="https://gitlab.bordeaux-inp.fr/" new-tab="true" icon="fa-brands fa-gitlab" %}}Gitlab Bordeaux INP{{% /button %}}
Résultat :
Code :
{{% button href="https://gitlab.bordeaux-inp.fr/" new-tab="true" icon="fa-brands fa-gitlab" icon-position="right" %}}Gitlab Bordeaux INP{{% /button %}}
Résultat :
Cartes intégrées
Pour reférencer une section ou un article de ce site, vous pouvez utiliser le shortcode card pour créer une carte intégrée qui agit comme un lien vers la page référencée.
Cartes de sections
Code :
{{% card ref="/fr/tutorials/tuto-site/tuto-page-content" %}}
Résultat :
Cartes d’articles
Code:
{{% card ref="/fr/tutorials/tuto-site/tuto-page-content/layout" %}}
Résultat :
