Ich habe das Tutorial auf www.OXYGEN4FUN.supadezign.com gefunden, denn dies ist die beste Möglichkeit, in Gutenberg eine Lightbox zu aktivieren, ohne extra ein Plugin zu installieren.
Die Anleitung ist gemacht für jene, welche das Plugin Advanced Script haben, dieses ist aber nicht kostenlos und auch nur für jene, die nicht auf die DSGVO achten müssen.
Da ich aber aus Österreich bin, brauche ich eine bessere Lösung. Matthias Altmann hat mir dabei geholfen den Code zu ändern, damit man Lokal die Datei laden kann, anstelle des CDN. Und der weitere Vorteil ist, dass man den Code nur noch 1:1 dann in den CodeSnippet (kostenloses Plugin) kopieren muss.
Hier ist auch noch darauf zu achten, die Dateien per FTP hochzuladen, oder mit eine File-Manager Plugin. Bei mir hat es nicht gut funktioniert und habe es dann per FTP erledigt.
Hier ist die Anleitung
1) CodeSnippet installieren
2) Code herunterladen
https://cdn.jsdelivr.net/npm/glightbox/dist/css/glightbox.min.css
https://cdn.jsdelivr.net/gh/mcstudios/glightbox/dist/js/glightbox.min.js
3) Am Server speichern
Ich habe es z.B unter "/wp-content/uploads/GLightbox" gespeichert. Die URL im Code ist dann bitte noch zu ändern.
Da ich WorpPress 6.0.2 zum jetzigen Zeitpunkt verwende, musste die Klasse im Code angepasst werden, da diese sich durch ein Update von WordPress geändert hat. Hierbei hat Matthias auch wieder sehr gute Arbeit geleistet!
4) Code in CodeSnippet aktivieren
Die URL für die JS und CSS Datei muss noch auf deine URL geändert werden. Dann bist du fertig,
function GLightbox_init() {
?>
<script src="https://cdn.jsdelivr.net/gh/mcstudios/glightbox/dist/js/glightbox.min.js"></script>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/glightbox/dist/css/glightbox.min.css"/>
<script>
var lightbox = GLightbox({ selector: '.wp-block-gallery .wp-block-image a' });
</script>
<?php
}
add_action('wp_footer','GLightbox_init');
5) Galerie in Gutenberg erstellen
Hier muss IMMER darauf geachtet werden, dass die Bilder zu Mediendatei verweisen, denn es ist standardgemäß auf KEINE eingestellt.