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?

fuxia
la source

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' />
fuxia
la source