Boutons
Le bouton principal est utilisé pour le CTA principal d'une page. Il est mis en œuvre en recherchant "bouton" dans les blocs Gutenberg et en sélectionnant Bouton (et non Buttons - c'est un bloc différent).
Le bouton secondaire est plus petit que le bouton principal. Il est utilisé lorsqu'un CTA plus discret est souhaité (par exemple, l'inscription à la newsletter dans le pied de page). Pour le mettre en œuvre, ajoutez le bloc Button Gutenberg comme décrit ci-dessus, puis ajoutez "btn-secondary" dans le champ Additional CSS classes.
Le bouton Alt ressemble à un lien texte avec un élément flèche :après. Utilisé lorsqu'un CTA plus silencieux est souhaité. Pour le mettre en œuvre, ajoutez le bloc Button Gutenberg comme décrit ci-dessus, puis ajoutez "btn-alt" au champ Additional CSS classes.
Liste déroulante
Les menus déroulants seront presque exclusivement mis en œuvre par l'équipe de développement.
Ils peuvent être utilisés de manière autonome ou faire partie d'une structure de navigation interne plus large (nous utilisons l'élément .wp-block-buttons
qui permet également de centrer le bouton). Exemple en direct.
Entrée simple + bouton (formulaire en ligne)
Il sera exclusivement mis en œuvre par l'équipe de développement. Peut faire partie d'un .wp-block-buttons
pour qu'il soit centré et qu'il ait un style supplémentaire. Exemple en direct.
Info Boxes - 3 variétés
Standard
Toutes les boîtes d'information sont placées à droite. La mise en œuvre se fait en sélectionnant "Info Box" dans les blocs Gutenberg.
Avec image
Adresse d'expédition WBC
BA - WBC 2020 587 S. Taylor Avenue
Louisville, CO 80027
Ajouter "with-image" au champ Classes CSS supplémentaires
Avec un texte plus petit
Lorsque vous avez beaucoup de contenu à faire tenir dans une info-bulle, vous pouvez souhaiter que le texte ait une taille de police plus petite. Pour ce faire, ajoutez "with-smaller-text" au champ "Additional CSS Classes".
Accordéon
Mettez-le en œuvre en sélectionnant Accordion dans les blocs Gutenberg.