/** * Lightbox semplice per le gallerie WordPress. * Nessun plugin / nessuna libreria esterna. */ function lem_gallery_lightbox() { // CSS wp_register_style( 'lem-gallery-lightbox', false ); wp_enqueue_style( 'lem-gallery-lightbox' ); wp_add_inline_style( 'lem-gallery-lightbox', ' .lem-lightbox { position: fixed; inset: 0; z-index: 999999; background: rgba(0,0,0,.92); display: none; align-items: center; justify-content: center; } .lem-lightbox.is-open { display: flex; } .lem-lightbox__image { display: block; max-width: 90vw; max-height: 88vh; width: auto; height: auto; object-fit: contain; } .lem-lightbox__close, .lem-lightbox__prev, .lem-lightbox__next { position: absolute; border: 0; background: rgba(0,0,0,.35); color: #fff; cursor: pointer; z-index: 2; font-family: Arial, sans-serif; } .lem-lightbox__close { top: 20px; right: 20px; width: 48px; height: 48px; border-radius: 50%; font-size: 34px; line-height: 48px; } .lem-lightbox__prev, .lem-lightbox__next { top: 50%; transform: translateY(-50%); width: 55px; height: 70px; font-size: 46px; line-height: 60px; } .lem-lightbox__prev { left: 20px; } .lem-lightbox__next { right: 20px; } .wp-block-gallery img { cursor: zoom-in; } body.lem-lightbox-open { overflow: hidden; } @media (max-width: 700px) { .lem-lightbox__image { max-width: 96vw; max-height: 82vh; } .lem-lightbox__prev, .lem-lightbox__next { width: 44px; height: 60px; font-size: 38px; background: rgba(0,0,0,.25); } .lem-lightbox__prev { left: 5px; } .lem-lightbox__next { right: 5px; } } ' ); // JS wp_register_script( 'lem-gallery-lightbox', '', array(), null, true ); wp_enqueue_script( 'lem-gallery-lightbox' ); wp_add_inline_script( 'lem-gallery-lightbox', ' document.addEventListener("DOMContentLoaded", function () { const galleries = document.querySelectorAll(".wp-block-gallery"); if (!galleries.length) { return; } const lightbox = document.createElement("div"); lightbox.className = "lem-lightbox"; lightbox.innerHTML = ` `; document.body.appendChild(lightbox); const lightboxImage = lightbox.querySelector(".lem-lightbox__image"); const closeButton = lightbox.querySelector(".lem-lightbox__close"); const prevButton = lightbox.querySelector(".lem-lightbox__prev"); const nextButton = lightbox.querySelector(".lem-lightbox__next"); let currentImages = []; let currentIndex = 0; let touchStartX = 0; function getLargeImage(img) { // Se la foto è già linkata al file originale, usa quello. const link = img.closest("a"); if ( link && link.href && /\.(jpg|jpeg|png|gif|webp|avif)(\\?.*)?$/i.test(link.href) ) { return link.href; } // Altrimenti usa l'immagine più grande disponibile nel srcset. if (img.srcset) { const sources = img.srcset .split(",") .map(function(item) { const parts = item.trim().split(/\\s+/); return { src: parts[0], width: parseInt(parts[1]) || 0 }; }) .sort(function(a, b) { return b.width - a.width; }); if (sources.length) { return sources[0].src; } } return img.src; } function showImage(index) { if (!currentImages.length) { return; } if (index < 0) { index = currentImages.length - 1; } if (index >= currentImages.length) { index = 0; } currentIndex = index; const img = currentImages[currentIndex]; lightboxImage.src = getLargeImage(img); lightboxImage.alt = img.alt || ""; } function openLightbox(images, index) { currentImages = images; currentIndex = index; showImage(currentIndex); lightbox.classList.add("is-open"); document.body.classList.add("lem-lightbox-open"); } function closeLightbox() { lightbox.classList.remove("is-open"); document.body.classList.remove("lem-lightbox-open"); lightboxImage.src = ""; } function nextImage() { showImage(currentIndex + 1); } function prevImage() { showImage(currentIndex - 1); } galleries.forEach(function(gallery) { const images = Array.from( gallery.querySelectorAll("img") ); images.forEach(function(img, index) { img.addEventListener("click", function(e) { // Evita che WordPress apra direttamente il jpg. const link = img.closest("a"); if (link) { e.preventDefault(); } openLightbox(images, index); }); const link = img.closest("a"); if (link) { link.addEventListener("click", function(e) { e.preventDefault(); }); } }); }); nextButton.addEventListener("click", function(e) { e.stopPropagation(); nextImage(); }); prevButton.addEventListener("click", function(e) { e.stopPropagation(); prevImage(); }); closeButton.addEventListener("click", function(e) { e.stopPropagation(); closeLightbox(); }); lightbox.addEventListener("click", function(e) { if (e.target === lightbox) { closeLightbox(); } }); document.addEventListener("keydown", function(e) { if (!lightbox.classList.contains("is-open")) { return; } if (e.key === "ArrowRight") { nextImage(); } if (e.key === "ArrowLeft") { prevImage(); } if (e.key === "Escape") { closeLightbox(); } }); // Swipe mobile lightbox.addEventListener("touchstart", function(e) { touchStartX = e.changedTouches[0].screenX; }, { passive: true }); lightbox.addEventListener("touchend", function(e) { const touchEndX = e.changedTouches[0].screenX; const difference = touchStartX - touchEndX; if (Math.abs(difference) < 50) { return; } if (difference > 0) { nextImage(); } else { prevImage(); } }, { passive: true }); }); ' ); } add_action( 'wp_enqueue_scripts', 'lem_gallery_lightbox' ); https://www.lemindustriesspa.com/post-sitemap.xml 2026-08-06T09:34:29+00:00 https://www.lemindustriesspa.com/page-sitemap.xml 2026-08-05T14:04:10+00:00 https://www.lemindustriesspa.com/press-sitemap.xml 2021-08-13T10:04:32+00:00 https://www.lemindustriesspa.com/category-sitemap.xml 2026-08-06T09:34:29+00:00 https://www.lemindustriesspa.com/post_tag-sitemap.xml 2025-04-28T08:57:13+00:00