{"id":457,"date":"2024-05-28T16:57:43","date_gmt":"2024-05-28T14:57:43","guid":{"rendered":"https:\/\/wp-dsfr.fr\/demo\/?page_id=118"},"modified":"2024-09-02T13:36:15","modified_gmt":"2024-09-02T11:36:15","slug":"bouton","status":"publish","type":"page","link":"https:\/\/wp-dsfr.fr\/demo\/liste-des-blocs-wordpress-du-dsfr\/bouton\/","title":{"rendered":"Bouton & lien"},"content":{"rendered":"\n

Boutons et liens<\/h1>\n\n\n\n

Le bouton est un \u00e9l\u00e9ment d\u2019interaction avec l\u2019interface permettant \u00e0 l\u2019utilisateur d\u2019effectuer une action.<\/p>\n\n\n\n

Le lien permet la navigation entre une page et un autre contenu au sein de la m\u00eame page, du m\u00eame site ou externe. <\/p>\n\n\n\n

<\/div>\n\n\n\n

Types de boutons et liens<\/h2>\n\n\n\n

Retrouvez ici toutes les possibilit\u00e9s de personnalisation des boutons \u00e0 travers ce th\u00e8me. Trois types de boutons et un lien sont disponibles via la s\u00e9lection de style de WordPress :<\/p>\n\n\n\n

\n
Primaire<\/a><\/div>\n\n\n\n
Secondaire<\/a><\/div>\n\n\n\n
Tertiaire<\/a><\/div>\n\n\n\n
Lien simple<\/a><\/div>\n<\/div>\n\n\n\n
<\/div>\n\n\n\n

Personnalisation des boutons<\/h2>\n\n\n\n
\n
Bouton<\/a><\/div>\n<\/div>\n\n\n\n

Avec une ic\u00f4ne<\/h3>\n\n\n\n
\n
Ic\u00f4ne \u00e0 gauche<\/a><\/div>\n\n\n\n
Ic\u00f4ne \u00e0 droite<\/a><\/div>\n\n\n\n
bouton<\/a><\/div>\n<\/div>\n\n\n\n

Variation de taille<\/h3>\n\n\n\n
\n
Small<\/a><\/div>\n\n\n\n
Medium<\/a><\/div>\n\n\n\n
Large<\/a><\/div>\n<\/div>\n\n\n\n
<\/div>\n\n\n\n

Personnalisation des liens<\/h2>\n\n\n\n
\n
Lien simple<\/a><\/div>\n<\/div>\n\n\n\n

Avec une ic\u00f4ne<\/h3>\n\n\n\n
\n
Ic\u00f4ne \u00e0 gauche<\/a><\/div>\n\n\n\n
Ic\u00f4ne \u00e0 droite<\/a><\/div>\n<\/div>\n\n\n\n

Variation de taille<\/h3>\n\n\n\n
\n
Ic\u00f4ne \u00e0 gauche<\/a><\/div>\n\n\n\n
Lien Medium<\/a><\/div>\n\n\n\n
Ic\u00f4ne \u00e0 droite<\/a><\/div>\n<\/div>\n\n\n\n
<\/div>\n\n\n\n

Exemple d’utilisation<\/h2>\n\n\n\n
\"\"<\/figure>
\n

Ceci est un bloc m\u00e9dia & texte<\/h3>\n\n\n\n

Voici un exemple de paragraphe pour montrer comment int\u00e9grer un bouton dans une page. Il suffit d’ajouter une introduction pour contextualiser le bouton, ceci permet de savoir pr\u00e9cis\u00e9ment ce que fera le bouton.<\/p>\n\n\n\n

\n
Cliquez sur moi<\/a><\/div>\n<\/div>\n<\/div><\/div>\n","protected":false},"excerpt":{"rendered":"

Boutons et liens Le bouton est un \u00e9l\u00e9ment d\u2019interaction avec l\u2019interface permettant \u00e0 l\u2019utilisateur d\u2019effectuer une action. Le lien permet la navigation entre une page et un autre contenu au sein de la m\u00eame page, du m\u00eame site ou externe.  Types de boutons et liens Retrouvez ici toutes les possibilit\u00e9s de personnalisation des boutons \u00e0 […]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":30,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"templates\/empty-page.php","meta":{"footnotes":""},"class_list":["post-457","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/wp-dsfr.fr\/demo\/wp-json\/wp\/v2\/pages\/457","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/wp-dsfr.fr\/demo\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/wp-dsfr.fr\/demo\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/wp-dsfr.fr\/demo\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/wp-dsfr.fr\/demo\/wp-json\/wp\/v2\/comments?post=457"}],"version-history":[{"count":1,"href":"https:\/\/wp-dsfr.fr\/demo\/wp-json\/wp\/v2\/pages\/457\/revisions"}],"predecessor-version":[{"id":497,"href":"https:\/\/wp-dsfr.fr\/demo\/wp-json\/wp\/v2\/pages\/457\/revisions\/497"}],"up":[{"embeddable":true,"href":"https:\/\/wp-dsfr.fr\/demo\/wp-json\/wp\/v2\/pages\/30"}],"wp:attachment":[{"href":"https:\/\/wp-dsfr.fr\/demo\/wp-json\/wp\/v2\/media?parent=457"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}