Scorpion Gallery

Scorpion Gallery

Overal zie je afbeeldingen op websites in galerijen, maar we missen altijd wel iets in alle bestaande extensies van anderen.

Natuurlijk is deze module ook weer ontstaan voor een specifiek project waarbij de klant een logo heeft in een ruitvorm. Om deze vorm wat door te trekken in de huisstijl van de website maakte we een image gallery die de afbeeldingen in diezelfde ruitvorm weergeeft. Omdat we dit eigenlijk op meerdere plekken op de website gingen toepassen hebben we er maar gewoon een module van gemaakt. Dit maakt het meteen beter beheerbaar voor de eigenaar van de website.

Tijdens het ontwikkelen van deze module bedachten we dat we ook nog veel meer templates konden inbouwen. Zoals we ook al eerder hadden gedaan in de Scorpion Sponsors module. We zijn dus aan de slag gegaan om direct een aantal templates (weergave mogelijkheden) toe te voegen aan de module. Hierdoor wordt de Scorpion Sponsor module en de Scorpion Diamond Gallery module meteen overbodig. Alles wat daar aan mogelijkheden beschikbaar was hebben we direct geïntegreerd in deze module.

En natuurlijk delen we ook deze module weer met de gemeenschap.

Compatible met Joomla! 4, 5 & 6

Laatste versie: v1.7.0

Download
 

 
TIP 1: Gebruik the hexagon template en probeer de volgende code maar eens toe te voegen aan de custom CSS

.ssg-tmpl-hexagons .shg-hex-inner {
clip-path: polygon(50% 0%, 61% 35%, 98% 35%, 68% 57%, 79% 91%, 50% 70%, 21% 91%, 32% 57%, 2% 35%, 39% 35%);
}

TIP 2: Er staan leuke suggesties op https://bennettfeely.com/clippy

TIP 3: Kijk eens helemaal onderaan, daar staat nog een leuke special als voorbeeld.

Scorpion Gallery Demo [Polaroid]

Terug naar hoger niveauHuidig album: submap1

Scorpion Gallery Demo [Hexagons]

Scorpion Gallery Demo [Diamond]

Scorpion Gallery Demo [Slider]

Scorpion Gallery Demo [Moving Circles]

Scorpion Gallery Demo [Even]

Scorpion Gallery Demo [Masonry]

Scorpion Gallery Demo [Metro]

Scorpion Gallery Demo [Justified]

Scorpion Gallery Demo [Thumbs on the bottom]

Scorpion Gallery Demo [Thumbs on the side]

Scorpion Gallery Demo [Special]

Je kan met wat creatieve aanpassingen in de CSS van de module echt alles maken wat je maar wil. Het onderstaande voorbeeld maakte we voor een klant met een hondenfokkerij met Franse bulldogs.

Technisch: We veranderde van een clip-path naar een mask-image in de css en gebruikte een SVG-afbeelding om de weergave te bepalen.

Changelog - Scorpion Gallery

v1.7.0 2026-07-06
  • Opgeloste Fouten Module cache setting verified as correctly disabled by default (cache=0) for interactive video features
  • Taal New language keys added: MOD_SCORPION_GALLERY_MEDIA_TYPE, MOD_SCORPION_GALLERY_VIDEO_URL, MOD_SCORPION_GALLERY_VIDEO_POSTER, MOD_SCORPION_GALLERY_VIDEO, MOD_SCORPION_GALLERY_IMAGE in en-GB, nl-NL, de-DE, fr-FR
  • Nieuwe Functies Complete video file support: MP4, WebM, OGV, OGG and MOV formats work seamlessly alongside images in all gallery layouts
  • Nieuwe Functies Folder source mode: Auto-detects and displays video files from selected folders (recursive mode included)
  • Nieuwe Functies Manual source mode: Each gallery item has a Media type selector (Image/Video) with dedicated video URL and poster fields
  • Nieuwe Functies Display modes: Choose lightbox playback (GLightbox) or inline HTML5 video player with controls
  • Nieuwe Functies Intelligent poster image strategy: (1) Automatic filename matching (video.mp4 + video.jpg), (2) HTML5 Canvas frame extraction (client-side), (3) Dark placeholder fallback
  • Nieuwe Functies Canvas extraction uses metadata readiness detection with 15-attempt retry mechanism for reliable cross-browser thumbnail generation
  • Nieuwe Functies Play button overlay automatically appears on all video thumbnails
  • Nieuwe Functies Thumbs-bottom and thumbs-side templates support switching between images and inline video in main viewer
  • Nieuwe Functies Video support is transparent - existing image galleries work without any configuration changes