Portfolio et galeries sur Showit : simple, mosaïque, slider et plein écran expliqués

27 mai 2026 — Tutoriels Showit en français

partager

[ez-toc]

Le guide pour créer un site web qui bosse pour ton business

Votre portfolio, c’est souvent ce qui fait la différence entre une visiteuse qui repart et une qui envoie un message. Sur Showit, vous avez accès à 3 formats de galeries natives – plus une option plein écran pour les hero sections, chacun adapté à un style de présentation différent. Ce guide vous explique comment les configurer, les alimenter et choisir le bon format selon ce que vous voulez mettre en valeur.

Les 3 formats de galerie – et quand utiliser lequel

Avant d’ajouter quoi que ce soit, voilà un aperçu rapide des options disponibles :

  • Simple → les images s’affichent en rangées régulières, côte à côte. Format propre et structuré, idéal pour un portfolio classique.
  • Tiled (mosaïque) → les images s’organisent dynamiquement en pavés de tailles variées. Format éditorial, idéal pour les portfolios créatifs qui veulent casser la grille.
  • Sliding (slider) → les images défilent une par une. Format épuré, idéal pour une sélection reserrée de visuels forts ou une galerie de témoignages avec photos.

Ajouter une galerie à sa page

  1. Sélectionnez le canvas où vous voulez faire apparaître la galerie
  2. Cliquez sur Add Element dans la barre du bas
  3. Choisissez Gallery dans le menu

Une boîte noire apparaît sur votre canvas – c’est votre galerie vide. Vous pouvez la redimensionner en faisant glisser ses coins. Dans le panneau de droite, deux onglets sont maintenant disponibles : Gallery Images pour gérer vos photos, et Gallery Settings pour choisir le type et configurer l’affichage.

Ajouter et gérer ses photos

  1. Sélectionnez votre galerie sur le canvas
  2. Dans le panneau de droite, onglet Gallery Images, cliquez sur le bouton bleu Manage Images

La fenêtre de gestion s’ouvre. Depuis votre médiathèque, survole les images → cochez celles que vous voulez ajouter → cliquez sur la flèche bleue pour les déplacer dans la galerie → Save.

Réorganiser l’ordre

Glissez-déposer les vignettes en haut ou en bas dans la liste pour changer leur ordre d’apparition.

Supprimer des photos

Sélectionnez les images à retirer (Shift + clic pour une sélection multiple) → cliquez sur la corbeille rouge → Save.

<aside> ⚠️ ⚠️ Dans une galerie Tiled, les photos peuvent se réorganiser dynamiquement pour s’adapter aux dimensions de la galerie. L’ordre que tu définis peut donc varier légèrement à l’affichage.

</aside>

La galerie Simple

Le format par défaut de Showit. Les images s’affichent en rangées régulières avec un espacement uniforme . Vous contrôlez le nombre de colonnes, l’espacement et les proportions depuis l’onglet Gallery Settings. Idéale pour un portfolio organisé par projets, une galerie de réalisations avant/après, un trombinoscope d’équipe.

💡 La galerie Simple supporte le Lightbox – au clic sur une image, elle s’agrandit en plein écran. Activez cette option dans Gallery Settings pour que vos visiteurs puissent voir les détails de votre travail.

La galerie Tiled (mosaïque)

La galerie Tiled crée un effet mosaïque en organisant vos photos en pavés de hauteurs variables, comme un magazine. Le rendu est dynamique et créatif – parfait pour montrer du travail photographique, des projets de décoration ou du contenu éditorial.

Pour l’activer

  1. Sélectionnez votre galerie → onglet Gallery Settings
  2. Dans le menu déroulant Type, choisissez Tiled Gallery

<aside> ⚠️ ⚠️ Réglage indispensable : la galerie Tiled déborde du canvas si celui-ci a une hauteur fixe. Solution : dans l’onglet Canvas du panneau de droite, passe le Canvas Type en Grow with Content. Le canvas s’adaptera automatiquement à la quantité d’images.

</aside>

La galerie Sliding (slider)

Le slider affiche les images une par une, en pleine largeur de votre galerie. Idéale pour une galerie de témoignages clients avec photos, un avant/après, une sélection de 5-6 images fortes d’un projet marquant.

  1. Sélectionnez votre galerie → onglet Gallery Settings
  2. Dans le menu déroulant Type, choisissez Sliding Gallery

💡 Ajoutez des flèches de navigation à votre slider (voir section suivante) – sans elles, les visiteurs ne savent pas qu’ils peuvent naviguer entre les images.

Ajouter des flèches de navigation

Les galeries ne viennent pas avec des flèches précédent/suivant par défaut . Vous les créez vous-même avec des icônes et des click actions. Ça vous donne un contrôle total sur leur design et leur placement.

  1. Ajoutez deux icônes fléchées sur votre canvas (Add Element → Icon)
  2. Sélectionnez l’icône « suivant » → panneau de droite, section Click Action → choisissez Gallery → action Next
  1. Dans le champ Target, sélectionnez votre galerie dans la liste déroulante
  1. Répètez l’opération pour l’icône « précédent » avec l’action Previous

Bonus : la galerie hero plein écran

Vous voulez créer un diaporama en pleine page à l’ouverture de votre site, comme ces sites de photographes où les images s’enchaînent en grand format ? C’est possible sans galerie native, via les Canvas Views. Cette technique est idéale pour 3 à 6 images maximum – au-delà, utilise plutôt une galerie standard.

Mettre en place la galerie hero

  1. Sélectionnez votre canvas → onglet Canvas dans le panneau de droite → règle le Canvas Type sur Window Height
  2. Dans le panneau gauche, cliquez sur les ... à droite du nom du canvas → Add Canvas View → répètez pour chaque image
  1. Pour chaque vue : sélectionnez-la onglet Canvas View , définissez le Canvas View Background sur l’image souhaitée

Faire avancer les images

Deux options : auto-avancement (active l’option dans l’onglet Canvas View et définis l’intervalle en secondes) ou flèches manuelles (icônes avec Click Action → Canvas → Next/Previous View).

Ce que vous pouvez faire maintenant

  1. Choisissez votre format selon l’effet voulu : Simple pour un portfolio structuré, Tiled pour un rendu éditorial, Sliding pour une sélection reserrée
  2. Vérifiez votre Canvas Type si vous utilisez une galerie Tiled – sans « Grow with Content », vos images seront coupées
  3. Ajoutez des flèches à votre slider – une galerie sans navigation, c’est une galerie que personne ne scrolle
  4. Testez la galerie hero si vous voulez un impact visuel fort dès l’arrivée sur votre site – idéal pour la page d’accueil d’une photographe ou d’une créative