Product:

Wonder Lightbox

Tutorial:

By using the Wonder Lightbox plugin, you can simply add a class name wplightbox to any link to activate the Lightbox effect. But sometimes, you may want to automatically enable the lightbox popup on all links to images or PDF files on the whole website.

To enable the lightbox popup on all links to images or PDF files, in your WordPress dashboard, go to the left menu Wonder Lightbox -> Lightbox Options, go to the Advanced Options tab, add the following code to the Custom JavaScript input box:

(function($){
  $(document).ready(function() {
    $("a").each(function() {
      var exts = [".png", ".jpg", ".jpeg", ".webp", ".gif", ".pdf"];
      var href = $(this).attr("href");
      if (href) {
        for (var i = 0; i < exts.length; i++) {
          if (href.toLowerCase().endsWith(exts[i])) {
            $(this).wonderpluginlightbox();
            break;
          }
        }
      }
    });
  });
})(jQuery);

In the above code, the following line defines the file types or extensions that will be automatically enabled the lightbox. You can change the line to add or remove the file extensions.

var exts = [".png", ".jpg", ".jpeg", ".webp", ".gif", ".pdf"];

For example, if you don't want to enable lightbox for PDF links, you can change the line to:

var exts = [".png", ".jpg", ".jpeg", ".webp", ".gif"];