WordPress : Comment utiliser une couleur parmi les options de thème ?

Publié par Jean-Michel le

Je construis un thème, et dans les options j’ai créé un emplacement pour la couleur des liens. Je n’arrive pas à intégrer cela dans le thème de manière raisonnable. Le mieux que je puisse faire est de le mettre après wp_head… mais cela ne semble pas correct. La couleur sera une couleur hexadécimale, donc je ne peux pas simplement configurer des feuilles de style pour un nombre fixe de couleurs et en mettre une en file d’attente de manière conditionnelle. Je suppose que je pourrais le faire avec jQuery mais j’espère vraiment ne pas avoir à recourir à cela. J’imagine que tout ce que je cherche, c’est un moyen de mettre en file d’attente un style en ligne, mais un tel concept existe-t-il et, sinon, quelle est la meilleure façon de s’y prendre. Je pensais vraiment que les options de couleur de lien et autres seraient courantes et faciles à mettre en œuvre.

Solution n°1 trouvée

wp_headest généralement la façon dont cela se fait, au moins pour de petits changements cosmétiques. Ce que vous devriez vérifier, c’est l’API de personnalisation du thème, en particulier les WP_Customize_Color_Controlliens et les didacticiels au bas de cette page. De cette façon, vous pouvez accéder à un aperçu et modifier les couleurs à la volée avec une roue chromatique intégrée, puis enregistrer la couleur souhaitée.

Solution n°2 trouvée

Vous appelleriez simplement cette option à l’intérieur d’un rappel et l’accrocheriez à wp_print_stylesou wp_head(l’un ou l’autre est sémantiquement correct dans ce cas).

Tout d’abord, configurez votre callback, qui imprimera une feuille de style en ligne :

function wpse74013_print_custom_styles() {
    ?>
<style type="text/css">

</style>
    <?php
}
add_action( 'wp_head', 'wpse74013_print_custom_styles' );

L’étape suivante consiste à accéder à votre option Thème :

$options = get_option( 'my_theme_options' );

Vous devez maintenant appliquer la couleur du lien, que je supposerai être $options['link_color'], à votre CSS. Supposons que la couleur de votre lien soit définie style.csscomme suit :

a { color:#0000FF; }

Remplacez simplement la valeur HEX comme il convient :

a { color:#<?php echo $options['link_color']; ?>; }

Rassemblez tout cela dans votre rappel :

function wpse74013_print_custom_styles() {
// Get Theme options
$options = get_option( 'my_theme_options' );
    ?>
<style type="text/css">
a { color:#<?php echo $options['link_color']; ?>; }
</style>
    <?php
}
add_action( 'wp_head', 'wpse74013_print_custom_styles' );

Et c’est tout! Vous devriez voir la sortie de votre feuille de style en ligne dans l’en-tête de votre document, avec la sortie de réglage de l’utilisateur pour la valeur HEX de la couleur du lien.

Catégories : Wordpress

Jean-Michel

Jean-Michel est en charge de la partie blog du site. Il met en place la stratégie de contenu et répond aux questions fréquentes sur Wordpress.

0 commentaire

Laisser un commentaire

Avatar placeholder

Votre adresse e-mail ne sera pas publiée. Les champs obligatoires sont indiqués avec *