Aller au contenu

Flexible Content - Bouton(s)

Ce composant permet d’afficher un ou plusieurs boutons centrés. Chacun peut avoir un titre, une icône et un lien qui peut envoyer vers une autre page du site ou n’importe quelle autre URL, et ouvert dans une nouvelle fenêtre si besoin.

Variantes

Icône

Attention, si le nom de l’icône ne correspond pas à un fichier physique du même nom dans wp-content/themes/wp-starter/images/dest/{nom}.svg, le composant affichera une erreur.

Couleurs

La variantes de couleurs sont disponibles via l’utilisation de classes CSS, à saisir dans le champ « Classes CSS », séparées par un espace.

Bouton primaire

Classes CSS : button-primary

Bouton secondaire

Classes CSS : button-secondary

Bouton primaire fantôme

Classes CSS : button-primary button-ghost

Bouton secondaire fantôme

Classes CSS : button-secondary button-ghost

Bouton fantôme inversé

Classes CSS : button-ghost button-opposite

Tailles

La variantes de tailles sont disponibles via l’utilisation de classes CSS, à saisir dans le champ « Classes CSS », séparées par un espace.

Bouton de grande taille

Classes CSS : button-primary button-lg

Bouton de petite taille

Classes CSS : button-primary button-sm

Bouton en pleine largeur

Classes CSS : button-primary button-full

Vue back office

composant Bouton

Tutoriel

Appel du composant Bouton hors Flexible Content

PHP
<?= ifc_render_component'button', [
  
'text' => "Label du bouton",
  
'url' => "https://...",
  
'target' => "_self"// '_blank' pour ouvrir dans un nouvel onglet
  
'icon' => "",
  
'classes' => ""// Classes CSS supplémentaires
]) ?>

Ces composants peuvent vous intéresser