web-dev-qa-db-fra.com

Ajout de code personnalisé dans header.php à l'aide d'un plugin

J'ai un tas de code que j'ai tendance à mettre dans le header.php de chaque site que je fais et qui est spécifique à Internet Explorer.

Je me demandais s'il y avait un moyen d'insérer du code dans un header.php 'standard'.

Oui, je peux simplement modifier l'en-tête. Mais l’idée est de faire de cela un plugin qui soit générique.

Plus précisément, j'aimerais créer un plugin pour faire écho à ce qui suit dans l'en-tête immédiatement après la feuille de style par défaut:

<!--[if IE]>
  <link rel="stylesheet" href="<?php bloginfo('stylesheet_directory'); ?>/ie.css" type="text/css" />
<![endif]-->
2
jchwebdev

Plus précisément, je voudrais créer un plugin pour faire écho ce qui suit dans l'en-tête immédiatement après la feuille de style par défaut

La méthode préférée consiste à mettre en file d'attente it, avec la feuille de style par défaut/main comme dependency .

Voici un plugin de démonstration, avec la structure:

+ plugins/
|
+--+ my-ie-style/
   |    
   +--+ my-ie-style.php
   |
   +--+ css/
      |
      +--+ ie.css

où le fichier my-ie-style.php est:

<?php
/**
 * Plugin Name: Demo - My IE style
 * Plugin URI:  http://wordpress.stackexchange.com/a/85496/26350
 * Description: Enqueue With IE conditional, depending on the main-style stylesheet
 * Author:      wpse
 * Version:     1.0.0
 */
add_action( 'wp_enqueue_scripts', function()
{
    // Register
    wp_register_style( 
       'my-ie-style',                                 // handle
       plugin_dir_url( __FILE__  ) . 'css/ie.css',    // file
       [ 'main-style' ],                              // dependency    <-- ADJUST THIS!
       '1.0.0',                                       // version
       'all'                                          // media
    );

    // Enqueue
    wp_enqueue_style( 'my-ie-style' );

    // Add IE conditional
    wp_style_add_data( 
        'my-ie-style',  // handle
        'conditional',  // key ('conditional', 'rtl', 'suffix', 'after', 'alt', 'title')
        'IE'            // value
    );
} );

Cela générera les éléments suivants dans la balise <head>:

<link rel='stylesheet' 
      id='main-style-css'  
      href='http://example.tld/wp-content/themes/mytheme/style.css?ver=4.5.3' 
      type='text/css' 
      media='all' />

<!--[if IE]>
<link rel='stylesheet' 
      id='my-ie-style-css' 
      href='http://example.tld/wp-content/plugins/my-ie-style/css/ie.css?ver=1.0.0' 
      type='text/css' 
      media='all' />
<![endif]-->

où notre feuille de style custom IE est chargée après la feuille de style main .

J'espère que vous pourrez l'adapter à vos besoins.

1
birgire

Vous voulez wp_enqueue_style(). C'est considéré comme une pratique exemplaire et plus élégant que de se connecter au wp_head.

http://codex.wordpress.org/Function_Reference/wp_enqueue_style

0
Justin W Hall