Galerie d'images : Image statique
Le type de galerie Image statique affiche les photos du bien immobilier sous forme de composition HTML+CSS — sans défilement automatique, sans librairie JavaScript Swiper. Un clic ouvre une lightbox avec toutes les images. Avantage : temps de chargement rapide et comportement visuel calme, idéal pour des présentations photos haut de gamme.
Activer le type de galerie
Section intitulée « Activer le type de galerie »Accédez dans le backend de votre site (wp-admin) sous WP-ImmoMakler → Customizer → Galerie d’images → Présentation des photos du bien immobilier et sélectionnez Image statique.
Les options suivantes apparaissent dans la section Galerie d’images.
Sélection d’images
Section intitulée « Sélection d’images »Détermine quelles images du bien immobilier apparaissent dans la galerie — Toutes les images (par défaut), Plans uniquement ou Sans plans. Cette option s’applique de la même manière aux galeries Swiper et statiques — voir la section Sélection d’images dans la documentation de la galerie Swiper.
Mise en page
Section intitulée « Mise en page »La désignation décrit la forme de la galerie dans son ensemble :
| Mise en page | Description | Preset utilisé |
|---|---|---|
| Vertical (par défaut) | Image principale en haut, grille de vignettes configurable en dessous (par défaut : une rangée de quatre vignettes ; jusqu’à 4 lignes × 10 colonnes possible). La galerie est haute/empilée dans l’ensemble. | static_compact |
| Horizontal | Grande image principale à gauche, grille de vignettes à droite (style JamesEdition). Configurable via les options supplémentaires. | static_fullwidth |
| Sans vignettes | Uniquement l’image principale avec un bouton “Afficher toutes les photos” en bas à droite. | static_hero |
Rapport d’aspect de l’image principale (mise en page Horizontale)
Section intitulée « Rapport d’aspect de l’image principale (mise en page Horizontale) »Cette option n’apparaît qu’avec la mise en page Horizontal (la grande mise en page de style JamesEdition avec grille de vignettes à droite).
| Mode | Description |
|---|---|
| Rapport d’aspect fixe | L’image principale détermine la hauteur de la galerie via le rapport d’aspect. La grille de vignettes remplit la même hauteur et ajuste automatiquement la taille de ses cellules. |
| Répartition 50/50 | L’image principale et la grille de vignettes se partagent exactement la moitié de la largeur. Le champ de rapport d’aspect fait alors référence à la galerie entière (image principale + grille de vignettes ensemble). Idéal pour les mises en page très larges de type Cinemascope ou Panorama. |
Rapport d’aspect (Static)
Section intitulée « Rapport d’aspect (Static) »S’applique dans toutes les mises en page avec vignettes :
- Mise en page Verticale : Rapport d’aspect de l’image principale (au-dessus de la rangée de vignettes).
- Horizontal + “Rapport d’aspect fixe” : Rapport d’aspect de l’image principale (détermine la hauteur de la galerie).
- Horizontal + “Répartition 50/50” : Rapport d’aspect de l’ensemble de la galerie.
Valeurs disponibles :
| Valeur | Description |
|---|---|
| 16:9 | Format large. |
| 3:2 | Format photo classique (par défaut). |
| 4:3 | Format standard. |
| 1:1 | Carré. |
| Nombre d’or (1,618:1) | Proportion esthétiquement équilibrée. |
| 2:1 (Cinemascope) | Format cinématographique très large. Particulièrement impressionnant en mode 50/50 comme bannière hero. |
| 3:1 (Panorama) | Format panoramique extrêmement large. |
| Original | En mode 50/50, “Original” revient à 3:2 (une boîte CSS unique avec grille de vignettes nécessite une hauteur définie). |
Rapport d’aspect des vignettes (Static)
Section intitulée « Rapport d’aspect des vignettes (Static) »Apparaît uniquement avec la mise en page Verticale. Détermine le rapport d’aspect de chaque vignette dans la rangée sous l’image principale. Valeur par défaut : 16:9.
Vignettes : Lignes / colonnes (mise en page Verticale)
Section intitulée « Vignettes : Lignes / colonnes (mise en page Verticale) »N’apparaissent qu’avec la mise en page Verticale. Déterminent la taille de la grille de vignettes directement sous l’image principale.
- Lignes : 1–4, par défaut 1.
- Colonnes : 1–10, par défaut 4.
- Total de vignettes visibles = Lignes × Colonnes.
Avec le réglage par défaut 1 × 4, une rangée étroite de quatre vignettes est visible directement sous l’image principale — le comportement par défaut de longue date. Avec des valeurs plus élevées, on obtient une grille complète (p. ex. 2 × 6 pour un panneau de vignettes dense).
Si le bien immobilier a plus de photos que la grille ne peut en afficher, l’option Si plus de photos que d’emplacements de vignettes ci-dessous gère la manière dont les photos supplémentaires sont signalées.
Hauteur de la galerie (mise en page Horizontale)
Section intitulée « Hauteur de la galerie (mise en page Horizontale) »N’apparaît qu’avec la mise en page Horizontal.
| Mode | Description |
|---|---|
| Automatique (par défaut) | La hauteur de la galerie est déterminée par le rapport d’aspect choisi (ou par la grille de vignettes en mode 50/50). |
| Hauteur fixe | Vous définissez une valeur de hauteur fixe + une unité. |
Lorsque Hauteur fixe est sélectionné, les champs supplémentaires suivants apparaissent :
- Hauteur de la galerie (valeur) : Valeur numérique de la hauteur. Plage 100–2000.
- Hauteur de la galerie (unité) :
px,vw,vh,svh,lvh,dvh.
Consultez le tableau des unités de hauteur dans la documentation de la galerie Swiper pour la signification des différentes unités viewport.
Vignettes : Lignes / colonnes (mise en page Horizontale)
Section intitulée « Vignettes : Lignes / colonnes (mise en page Horizontale) »N’apparaissent qu’avec la mise en page Horizontal. Déterminent la taille de la grille de vignettes à droite de l’image principale.
- Lignes : 1–4, par défaut 3.
- Colonnes : 1–4, par défaut 2.
- Total de vignettes visibles = Lignes × Colonnes.
Avec le réglage par défaut 3 × 2, 6 vignettes sont visibles. Si le bien immobilier possède plus de photos, l’option Si plus de photos que d’emplacements de vignettes ci-dessous gère la manière dont les photos supplémentaires sont signalées.
Si plus de photos que d’emplacements de vignettes
Section intitulée « Si plus de photos que d’emplacements de vignettes »Apparaît dans les deux mises en page avec vignettes (Vertical et Horizontal). Détermine comment les photos supplémentaires sont signalées lorsque la grille de vignettes ne peut pas afficher toutes les photos :
| Option | Description |
|---|---|
| Superposition compteur sur la dernière vignette (+N) (par défaut) | La dernière vignette visible est recouverte d’une superposition semi-transparente ”+ N”, où N est le nombre de photos masquées. Un clic ouvre la lightbox exactement sur cette photo — le visiteur voit en premier ce qui était caché sous la superposition. |
| Bouton sous la galerie (Afficher toutes les N photos) | Un bouton indépendant en forme de pilule apparaît en bas à droite avec le texte “Afficher toutes les N photos”. Un clic ouvre la lightbox à partir de la première photo. |
Zone de contrôle pour actions supplémentaires
Section intitulée « Zone de contrôle pour actions supplémentaires »Le bouton pilule “Afficher tous les N photos” est rendu dans une zone de contrôle en bas à droite au-dessus de la galerie (.immomakler-gallery__controls). Cette zone est extensible : d’autres fonctionnalités de WP-ImmoMakler ou des theme builders peuvent y insérer des actions supplémentaires, par exemple “Afficher le plan”, “Vidéo” ou “Visite virtuelle”, qui renvoient vers les sections correspondantes de la page de détail.
Note pour les développeurs : Le filtre PHP immomakler_gallery_static_controls_items permet d’ajouter des éléments d’action personnalisés — voir Bibliothèque de galerie : Personnaliser.
Animation au survol
Section intitulée « Animation au survol »Retour visuel lorsque la souris passe sur l’image principale et les vignettes. Trois options :
| Option | Description |
|---|---|
| Zoom doux (par défaut) | L’image est à peine agrandie au survol — image principale à 100,5 %, vignettes à 100,75 %. L’effet est intentionnellement très discret : l’image « respire » au survol sans distraire. |
| Éclaircir | Au survol, l’image est légèrement éclaircie (filter: brightness(1.08)). Également discret : les photos de biens immobiliers sont souvent déjà claires, les hautes lumières ne doivent pas brûler. |
| Aucune | Pas d’animation. Utile pour les thèmes au style très calme, de type album photo — ou lorsque la page de détail comporte déjà de fortes animations ailleurs et que la galerie ne doit pas paraître davantage « vivante ». |
La transition s’effectue dans les deux sens en 200 ms (linéaire) — elle s’amorce et se résorbe à la même vitesse. En mode Slideshow, ce réglage n’est pas appliqué : l’animation du slider lors du changement d’image est le seul retour visuel là-bas ; un effet de survol supplémentaire paraîtrait surchargé.
Espacement entre les images, arrondi des coins
Section intitulée « Espacement entre les images, arrondi des coins »Ces options s’appliquent de la même manière aux galeries Swiper et statiques — voir les sections correspondantes dans la documentation de la galerie Swiper.
“Afficher la galerie d’images en pleine largeur”
Section intitulée « “Afficher la galerie d’images en pleine largeur” »Cette option est un réglage de mise en page (et non un réglage interne de la galerie) et ne se trouve donc pas sous Galerie d’images, mais sous WP-ImmoMakler → Customizer → Vue détaillée des biens immobiliers → Afficher la galerie d’images en pleine largeur.
Elle détermine si la galerie s’étend sur les deux colonnes dans la mise en page à deux colonnes de la vue détaillée ou si elle s’affiche uniquement dans la colonne de droite. Elle n’affecte PAS la mise en page interne de la galerie elle-même — celle-ci est choisie via l’option Mise en page (Static) ci-dessus.
Pour les développeurs
Section intitulée « Pour les développeurs »Le comportement peut être personnalisé davantage via des hooks de filtre, des variables CSS et des intégrations de theme builder — voir Bibliothèque de galerie : Personnaliser.
La galerie peut également être utilisée en dehors de la page de détail via le Shortcode de galerie.