MOINS CSS enqueue_style avec add_filter pour changer l'attribut rel

8

Ce que j'essaie de faire, c'est d'utiliser moins de CSS avec Wordpress.

Vous êtes censé créer un lien vers vos fichiers .less avec l'attribut rel défini sur «feuille de style / moins». Mais je ne peux pas comprendre comment modifier le code généré par enqueue_style.

Existe-t-il un moyen d'appliquer un filtre et d'affecter la sortie?

EDIT: Si quelqu'un est curieux de savoir comment j'ai fini par le faire fonctionner, voici l'extrait de code:

function enqueue_less_styles($tag, $handle) {
    global $wp_styles;
    $match_pattern = '/\.less$/U';
    if ( preg_match( $match_pattern, $wp_styles->registered[$handle]->src ) ) {
        $handle = $wp_styles->registered[$handle]->handle;
        $media = $wp_styles->registered[$handle]->args;
        $href = $wp_styles->registered[$handle]->src . '?ver=' . $wp_styles->registered[$handle]->ver;
        $rel = isset($wp_styles->registered[$handle]->extra['alt']) && $wp_styles->registered[$handle]->extra['alt'] ? 'alternate stylesheet' : 'stylesheet';
        $title = isset($wp_styles->registered[$handle]->extra['title']) ? "title='" . esc_attr( $wp_styles->registered[$handle]->extra['title'] ) . "'" : '';

        $tag = "<link rel='stylesheet' id='$handle' $title href='$href' type='text/less' media='$media' />";
    }
    return $tag;
}
add_filter( 'style_loader_tag', 'enqueue_less_styles', 5, 2);

filters wp-enqueue-style

— cbaigorri
source

Pourquoi voudriez-vous charger une feuille de style .less? Ils sont mieux utilisés dans le processus de développement, puis exportés en CSS normal, ce qui ne vous semble pas être le cas, car vous demandez comment le faire fonctionner avec enqueue_style :)

— onetrickpony

Je les convertis en CSS dans le processus de construction. Vous avez raison, c'est uniquement à des fins de développement.

— cbaigorri

Merci d'avoir publié l'extrait de code, car cela a résolu mes problèmes. J'avais trouvé un script similaire ailleurs, mais il n'a pas fonctionné.

— ScottS

J'ai ajouté "\ r \ n" à la fin de la valeur $ tag car il joignait des lignes dans mon HTML. $tag = "<link rel='stylesheet/less' id='$handle' $title href='$href' type='text/less' media='$media' />\r\n";

— jnthnclrk

5

Oui, la sortie du lien de style final passe par le style_loader_tagfiltre.

— Rarst
source

2

J'ai créé une fonction qui utilise la méthode query () de la classe WP_Dependancies. De plus, il ne régénère pas la sortie, mais réécrit simplement les parties nécessaires.

La fonction accède à l'objet global $ wp_styles et exécute une requête pour obtenir l'objet de feuille de style. Avec l'expression régulière, le src est vérifié s'il contient un fichier .less, et si cela est vrai, l'attribut rel est modifié en conséquence. Dans ma fonction, j'ai en outre remplacé le suffixe -css dans l'ID par un suffixe -less, supprimez simplement cette ligne si vous ne l'aimez pas.

function allow_less_stylesheets( $style_tag, $handle )
{
    global $wp_styles;

    $obj = $wp_styles->query( $handle );
    if( $obj === false )
    {
        return $style_tag;
    }
    if( !preg_match( '/\.less$/U', $obj->src ) )
    {
        return $style_tag;
    }

    // the current stylesheet is a LESS stylesheet, so make according changes
    $rel = isset( $obj->extra['alt'] ) && $obj->extra['alt'] ? 'alternate stylesheet' : 'stylesheet';
    $style_tag = str_replace( "rel='" . $rel . "'", "rel='stylesheet/less'", $style_tag );
    $style_tag = str_replace( "id='" . $handle . "-css'", "id='" . $handle . "-less'", $style_tag );
    return $style_tag;
}

— flixos90
source

0

changer rel=stylesheetà rel=stylesheet/lessen $tagdéfinition .. aussi rel=alternate stylesheet/less, ne fonctionne pas ..

— user32359
source

2

"Cette réponse a été automatiquement signalée comme étant de faible qualité en raison de sa longueur et de son contenu", ce dont je suis sûr que vous ne voulez pas. Pouvez-vous ajouter quelques explications sur votre solution et expliquer pourquoi vous pensez que cela résoudra le problème.

— s_ha_dum

-1

Merci pour votre réponse. Cela n'a pas fonctionné pour moi jusqu'à ce que je mette l'écho à la place du retour:

function enqueue_less_styles($tag, $handle) {
    global $wp_styles;
    $match_pattern = '/\.less$/U';
    if ( preg_match( $match_pattern, $wp_styles->registered[$handle]->src ) ) {
        $handle = $wp_styles->registered[$handle]->handle;
        $media = $wp_styles->registered[$handle]->args;
        $href = $wp_styles->registered[$handle]->src . '?ver=' . $wp_styles->registered[$handle]->ver;
        $rel = isset($wp_styles->registered[$handle]->extra['alt']) && $wp_styles->registered[$handle]->extra['alt'] ? 'alternate stylesheet' : 'stylesheet';
        $title = isset($wp_styles->registered[$handle]->extra['title']) ? "title='" . esc_attr( $wp_styles->registered[$handle]->extra['title'] ) . "'" : '';

        $tag = "<link rel='stylesheet' id='$handle' $title href='$href' type='text/less' media='$media' />";
    }
    echo $tag;
}
add_filter( 'style_loader_tag', 'enqueue_less_styles', 5, 2);

— drskullster
source

1

Cela ne semble pas correct, les filtres doivent absolument renvoyer la sortie, sinon vous cassez la chaîne de filtres et gâchez les choses.

— Rarst