web-dev-qa-db-fra.com

Utiliser wp_add_inline_style sans une feuille de style

J'ai besoin d'ajouter des styles en-ligne personnalisés à l'en-tête d'un thème personnalisé que je crée. J'ai rencontré la fonction wp_add_inline_style(), qui fonctionne mais ne me convient pas vraiment car elle dépend d'une feuille de style spécifique. J'aurais besoin d'ajouter des styles en ligne à la fin de la balise head sans dépendance à la feuille de style.

J'ai essayé de définir la feuille de style du thème ou une feuille de style inexistante. Dans les deux cas, cela fonctionne mais c'est un peu un sale bidouillage (charger la feuille de style de thème deux fois ou se référer à un fichier fantôme ...). Existe-t-il un moyen approprié d’ajouter des styles en ligne dans head sans s’appuyer sur une feuille de style?

Bien sûr, je pourrais les ajouter directement dans le fichier header.php mais j'aimerais éviter cela.

theme-developmentwp-enqueue-style
13
terzag

Vous devez simplement ajouter les styles directement à l'en-tête de la page. La meilleure façon de le faire est d'utiliser le hook d'action 'wp_head', en supposant que vous utilisez un thème qui a le hook. Ainsi:

add_action('wp_head', 'my_custom_styles', 100);

function my_custom_styles()
{
 echo "<style>*{color: red}</style>";
}

Consultez le WP codex pour en savoir plus sur les points d’accroche.

19
SkyShab

Vous pouvez simplement utiliser un "dummy" handle:

wp_register_style( 'dummy-handle', false );
wp_enqueue_style( 'dummy-handle' );

wp_add_inline_style( 'dummy-handle', '* { color: red; }' );
13
Flix

Votre thème a très certainement une feuille de style par défaut (sinon, il ne serait même pas chargé en tant que thème). Utilisez simplement cette feuille de style en tant que gestionnaire pour votre CSS en ligne. Un exemple peut être trouvé dans le fichier functions.php du thème TwentyFifteen (code ignoré pour être bref):

function twentyfifteen_scripts() {
    wp_enqueue_style( 'twentyfifteen-style', get_stylesheet_uri() );

}
function twentyfifteen_post_nav_background() {
    wp_add_inline_style( 'twentyfifteen-style', $css );
}
3
Casper