Mettre en file d'attente une feuille de style pour la page de connexion et la faire apparaître dans l'élément head


10

J'essaie de styliser la page de connexion dans mon thème. Très simple:

add_action( 'login_enqueue_scripts', function()
{
    wp_enqueue_style( 'TEST', get_template_directory_uri() . '/css/login.css' );
});

Malheureusement, cela ne fonctionne pas comme prévu. L' linkélément apparaît bodytrès tard dans la page de connexion.

Sortie rendue:

<link rel='stylesheet' id='TEST-css'  href='http://themes.wp/t5-theme-base/css/login.css?ver=3.9-alpha' type='text/css' media='all' />
<div class="clear"></div>
</body>
</html>

C'est faux, comment puis-je imprimer l'élément de lien dans le head?

Réponses:


26

Pour chaque enqueueaction, il existe une print_stylesaction correspondante :

  • wp_enqueue_scriptswp_print_styles
  • admin_enqueue_scriptsadmin_print_styles
  • customize_controls_enqueue_scriptscustomize_controls_print_styles

Pas pour la page de connexion. Il n'y a aucune login_print_stylesaction ou fonction, donc vos feuilles de style sont jetées do_action( 'login_footer' );.

Mais il existe une solution simple:

if ( ! has_action( 'login_enqueue_scripts', 'wp_print_styles' ) )
    add_action( 'login_enqueue_scripts', 'wp_print_styles', 11 );

WordPress imprimera désormais tous les linkéléments enregistrés pour cette page au bon endroit, l' headélément, juste après les feuilles de style intégrées.

Résultat:

<link rel='stylesheet' id='dashicons-css'  href='http://git.wp/wp-includes/css/dashicons.min.css?ver=3.9-alpha' type='text/css' media='all' />
<link rel='stylesheet' id='wp-admin-css'  href='http://git.wp/wp-admin/css/wp-admin.min.css?ver=3.9-alpha' type='text/css' media='all' />
<link rel='stylesheet' id='buttons-css'  href='http://git.wp/wp-includes/css/buttons.min.css?ver=3.9-alpha' type='text/css' media='all' />
<link rel='stylesheet' id='colors-fresh-css'  href='http://git.wp/wp-admin/css/colors.min.css?ver=3.9-alpha' type='text/css' media='all' />
<!--[if lte IE 7]>
<link rel='stylesheet' id='ie-css'  href='http://git.wp/wp-admin/css/ie.min.css?ver=3.9-alpha' type='text/css' media='all' />
<![endif]-->
<link rel='stylesheet' id='TEST-css'  href='http://themes.wp/t5-theme-base/css/login.css?ver=3.9-alpha' type='text/css' media='all' />
En utilisant notre site, vous reconnaissez avoir lu et compris notre politique liée aux cookies et notre politique de confidentialité.
Licensed under cc by-sa 3.0 with attribution required.