web-dev-qa-db-fra.com

Ajoute l'attribut 'title' aux feuilles de style avec wp_enqueue_style ()

Lisez ci-dessous si vous voulez commencer par là où je me suis arrêté. Mais la question de base est la suivante: je dois ajouter un attribut "title" à mes feuilles de style et wp_enqueue_style () ne permet pas ce paramètre, pour autant que je sache. Existe-t-il un moyen par lequel WordPress nous permet d’ajouter le titre à une feuille de style?

En fouillant dans le noyau, je remarque qu’une variable $title peut être définie à l’aide de $style->extra['title'].

$title = isset($this->registered[$handle]->extra['title']) ? "title='" . esc_attr( $this->registered[$handle]->extra['title'] ) . "'" : '';

(class.wp-styles.php)

Et $ title figure également dans le filtre appliqué lors de la mise en file d'attente d'une feuille de style. Alors, comment pouvez-vous définir ce tableau 'supplémentaire' dans l'objet style?

wp-enqueue-style
6
Tom Auger

Ok, voici où je suis avec une solution.

wp_enqueue_style( 'my-handle', 'mystyle.css' );
global $wp_styles;
$wp_styles->add_data( 'my-handle', 'title', 'my_stylesheet_title' );

N'aime pas utiliser le global. Y a-t-il quelque chose de mieux?

4
Tom Auger

En regardant le fichier que vous avez mentionné dans votre message class.wp-styles.php, vous avez la ligne suivante, $tag .= apply_filters( 'style_loader_tag', "<link rel='$rel' id='$handle-css' $title href='$href' type='text/css' media='$media' />\n", $handle );. Vous pouvez donc vous connecter au filtre "style_loader_tag" et ajouter la balise title. J'aime aussi votre réponse, mais je ne sais pas laquelle serait la meilleure, car je ne suis pas sûre s'il y a des problèmes d'utilisation du global ou non.

2
Kevin Langley Jr.

Il me semble que vous pourriez aussi utiliser style_loader_tag. Voir mon autre réponse pour une interprétation plus détaillée de style_loader_tag et script_loader_tag API:
Comment ajouter crossorigin et intégrité à wp_register_style? (Font Awesome 5)

style_loader_tag est une API WordPress officielle, voir la documentation: https://developer.wordpress.org/reference/hooks/style_loader_tag/

apply_filters( 'style_loader_tag', $html, $handle, $href, $media )
Filtre la balise de lien HTML d'un style mis en file d'attente.



Commencez par mettre en file d'attente vos feuilles de style 

function add_styles() {
    // Example loading external stylesheet, could be used in both a theme and/or plugin
    wp_enqueue_style( 'font-awesome-5', 'https://use.fontawesome.com/releases/v5.5.0/css/all.css', array(), null );

    // Example theme
    wp_enqueue_style( 'font-awesome-5', get_theme_file_uri( '/assets/css/fontawesome.min.css' ), array(), null );

    // Example plugin
    wp_enqueue_style( 'font-awesome-5', plugins_url( '/assets/css/fontawesome.min.css', __FILE__ ), array(), null );
};
add_action( 'wp_enqueue_scripts', 'add_styles' );



Deuxièmement, utilisez style_loader_tag
Utilisez ensuite style_loader_tag pour ajouter votre titre à la feuille de style spécifique.

function add_stylesheet_attributes( $html, $handle ) {
    if ( 'font-awesome-5' === $handle ) {
        return str_replace( "rel='stylesheet'", "rel='stylesheet' title='something'", $html );
    }
    return $html;
}
add_filter( 'style_loader_tag', 'add_stylesheet_attributes', 10, 2 );
1
Remzi Cavdar

J'ai utilisé le chemin avec style_loader_tag. De ce fait, j'ai mal utilisé la poignée pour transporter ma balise de titre supplémentaire. Cela ressemble à ce qui suit:

// Enqueue style
wp_enqueue_style( 'twentytwelve-style-Xstyle1', get_stylesheet_uri() );

// my filter function
add_filter('style_loader_tag', 'my_style_loader_tag_function');

function my_style_loader_tag_function($tag){
    $customXML = new SimpleXMLElement($tag);
    $id = (string)$customXML->attributes()->id;
    $values = explode('-X',$id);
    if(!isset($values[1])){
        return $tag;
    }
    $customXML->attributes()->id = $values[0].'-css';
    $title = str_replace('-css', '', $values[1]);
    $customXML->addAttribute('title', $title);
    $dom = dom_import_simplexml($customXML);

    return $dom->ownerDocument->saveXML($dom->ownerDocument->documentElement);
}

Donc, je cherche -X et tout après cette chaîne est mon attribut de titre.

0
testing