Quelques conseils
- Deux couleurs sont disponibles. Le noir et le blanc. Prioriser le bouton noir parce qu’il est plus visible. Le bouton blanc est une option dans les situations où il y a plus d’un bouton sur une ligne.
- L’outils d’édition bouton hyperlien peut être utilisé pour la création d’un bouton à la suite de toutes les autres boîtes de contenu.
- Ci-bas, voir les instructions pour créer manuellement les boutons dans les contenus standards avec 2 ou 3 colonnes, dans les contenus groupés et dans les widgets.
Deux modèles de boutons
Outil de création de boutons hyperliens
- Dans l’outil d’édition, cliquer sur le bouton «Ajouter un élément» et sélectionner «Bouton hyperlien»
- Cliquer sur «Ajouter un lien»
- Inscrire le titre du bouton dans : «Titre»
- Inscrire l’adresse url dans : «Hyperlien»
- Inscrire le code de l’image MDI. Le code de l’image MDI est un texte de programmation informatique pour créer l’image de l’icône disponible dans le répertoire des icônes MDI (site Material Design Icons)

Comment choisir une image MDI et copier le code
1. Cliquer sur le bouton «Choisir une image MDI»
2. Une fois sur le site Icône Material Design, cliquer sur l’image de son choix
![]()
3. Sélectionner le menu « POLICE WEB »
4. Copier la partie du code en vert surlignée dans l’exemple ci-dessous en ne copiant qu’un seul mdi. Dans cet exemple, le code à copier est « mdi-shape »

5. Coller le code dans la cellule «Code de l’image (MDI)»

Création manuelle d’un bouton hyperlien
L’outil de création d’un bouton hyperlien dans les contenus groupés n’est pas disponible dans les outils d’édition de contenu groupé les boîtes de contenu standard.
Pour créer un bouton, copier l’un des codes suivant dans la section «Texte» :
Le code suivant :
[uqac_btn lien_site_web="https://www.uqac.ca" titre_du_bouton="Site UQAC" icone_mdi="mdi-alarm-light" couleur_bouton="noir"]
Donne ce bouton :
Le code suivant :
[uqac_btn lien_site_web="https://www.uqac.ca" titre_du_bouton="Site UQAC" couleur_bouton="blanc"]
Donne ce bouton :
Comment modifier le code pour créer son bouton
Modifier les information suivantes, en préservant bien attentivement les guillemets et les autres éléments du code.
Modifier l’hyperlien
https://www.uqac.ca
Modifier le titre du bouton
titre_du_bouton
Mofifier le code de l’image mdi
mdi-alarm-light