X

Ajouter rel=”lightbox” à toutes les images intégrées dans un article

Snippets by IsItWP

Vous cherchez un moyen d’ajouter l’attribut lightbox à toutes les images intégrées dans vos articles ? Bien qu’il existe probablement un plugin pour cela, nous avons créé un extrait de code rapide que vous pouvez utiliser pour ajouter rel=”lightbox” à toutes les images intégrées dans un article et également ajouter le titre de l’article en tant qu’attribut title de la balise d’ancrage de l’image dans WordPress.

Instructions:

Tout ce que vous avez à faire est d’ajouter ce code dans le fichier functions.php de votre thème ou dans un plugin spécifique à votre site:

add_filter('the_content', 'my_addlightboxrel');
function my_addlightboxrel($content) {
       global $post;
       $pattern ="/<a(.*?)href=('|")(.*?).(bmp|gif|jpeg|jpg|png)('|")(.*?)>/i";
       $replacement = '<a$1href=$2$3.$4$5 rel="lightbox" title="'.$post->post_title.'"$6>';
       $content = preg_replace($pattern, $replacement, $content);
       return $content;
}

Note : Si c’est la première fois que vous ajoutez des extraits de code dans WordPress, veuillez vous référer à notre guide sur comment copier/coller correctement des extraits de code dans WordPress, afin de ne pas casser accidentellement votre site.

Si vous avez aimé cet extrait de code, n’hésitez pas à consulter nos autres articles sur le site comme : Comment transférer WordPress d’un serveur local à un site live et 7 meilleurs plugins WordPress de génération de leads.

Commentaires   laisser une réponse

  1. If there’s a custom link or a link to the attachment page this adds the data attributes to the image instead which breaks the link. It also breaks srcset images.

  2. ???????! ????????!

  3. How would i go about changing the title attribute to display the images caption intstead? I’ve tried replacing .$post->post_title. with .$attachment->post_excerpt but doesn’t work. Any idea what I’m doing wrong?

  4. well. that’s what makes me happy today.. thanks ))

  5. Hi all! It’s sounds great, but is there any exact place in the function.php where to put the code?

  6. Thanks. Perfect.

  7. How to use it for video? WordPress autoembed feature is great, but I hate it that if I want to show the video in lightbox, I’ve to add some class etc to the video. It’d great it there’s workaround to autoadd the rel=lightbox to video too 😀

  8. Thank you for this!

  9. Worked beautifully! Thanks!

    1. Cool glad to hear you like the snippet.

  10. Thank you for this!

    1. No problem glad you like the snippet, be sure to follow wpsnipp or like us for new snippets! Enjoy.

  11. Wordpress : How to add rel=”lightbox” to all images embedded in a post « Wordpress « Cms « Codes php – Share your php snippets octobre 14, 2011 à 5:41 am

    […] WPsnipp [!] Report this snippet Processing your request, Please wait…. […]

Ajouter un commentaire

Nous sommes heureux que vous ayez choisi de laisser un commentaire. N'oubliez pas que tous les commentaires sont modérés conformément à notre privacy policy, et que tous les liens sont en nofollow. N'utilisez PAS de mots-clés dans le champ du nom. Engageons une conversation personnelle et constructive.

WordPress Launch Checklist

L'ultime liste de contrôle pour le lancement de WordPress

Nous avons rassemblé tous les éléments essentiels de la liste de contrôle pour le lancement de votre prochain site Web WordPress dans un ebook pratique.
Oui, envoyez-moi le gratuit !