web-dev-qa-db-fra.com

Modification de la sortie HTML des images insérées

J'ai utilisé Wordpress pendant des années. Chaque fois que j'ajoutais une image à un article, j'écrivais manuellement tout le code HTML pour chaque image. J'ai également utilisé un plugin d'image lightbox appelé Highslide pour que les gens puissent agrandir leurs vignettes. Un exemple de miniature associé à une image plus grande ressemble à ceci dans mon manuel HTML:

<a href="large-file.jpg" rel="highslide" class="highslide"><img src="thumbnail.gif"></a>

Mais maintenant, j'ai installé la dernière version de Wordpress et j'ai constaté à quel point il est facile d'ajouter des images directement dans l'article sans avoir à écrire de code HTML. Le résultat obtenu est le suivant:

<a href="http://site.com/newwp/wp-content/uploads/2012/12/file.jpg"><img class="alignright size-medium wp-image-24971" alt="file" src="http://file.com/newwp/wp-content/uploads/2012/12/file-196x300.jpg" width="196" height="300" /></a>

Ce que je voudrais faire est de modifier Wordpress pour qu'il ajoute automatiquement les liens rel = "highslide" et class = "highslide" au lien chaque fois que j'insère une image liée afin que le plugin highslide fonctionne. Je suppose que le résultat final ressemblerait à ceci:

<a href="http://site.com/newwp/wp-content/uploads/2012/12/file.jpg" rel="highslide" class="highslide"><img class="alignright size-medium wp-image-24971" alt="file" src="http://file.com/newwp/wp-content/uploads/2012/12/file-196x300.jpg" width="196" height="300" /></a>

J'ai parcouru les fichiers de base mais je ne peux pas savoir où Wordpress génère le code HTML lorsqu'il insère des images. Alors, est-ce que quelqu'un sait comment modifier Wordpress pour ajouter ces deux attributs? J'apprécierais vraiment votre aide! :) Je vous remercie!

1
SurferBoy

Ce filtre vérifie si une ancre est dans l'image html envoyée à l'éditeur et, le cas échéant, ajoute rel et class à l'ancre.

function add_highslide_attr( $html ) {
    preg_match_all('/(<a[^>]*>)(.*)/i', $html, $result);

    if( !isset($result) || !isset($result[1][0]) || ! $result[1][0] )
        return $html;

    $anchor = $result[1][0];

    if( strstr($anchor, 'rel=') )
        $anchor = str_replace('rel="', 'rel="highslide ', $anchor);
    else
        $anchor = str_replace('href=', 'rel="highslide" href=', $anchor);

    if( strstr($anchor, 'class=') )
        $anchor = str_replace('class="', 'class="highslide ', $anchor);
    else
        $anchor = str_replace('href=', 'class="highslide" href=', $anchor);

    $html = $anchor . $result[2][0];

    return $html;
}
add_filter( 'image_send_to_editor', 'add_highslide_attr', 10 );
0
Rob Vermeer