Le lancement de la version 7 de l'éditeur GemPages a représenté une avancée majeure, non seulement en termes de performances, mais aussi dans la façon dont les marchands conçoivent leurs produits. Mais derrière chaque page de destination, chaque fiche produit et chaque mise en page d'offre groupée se cache une constante : les paramètres des éléments.
Et au fil du temps, ces paramètres ont commencé à montrer leur âge.
Au cours de l'année écoulée, nous avons discuté avec des marchands, et une chose revenait sans cesse : ils savaient quoi construire, mais les paramètres rendaient la tâche plus difficile qu'elle n'aurait dû l'être. Nous nous sommes donc demandé :
À quoi ressembleraient les paramètres des éléments s'ils étaient conçus en fonction de la manière dont Vous Pensez-y — pas seulement à la façon dont fonctionne le code ?
Cette version, lancée le 29 juillet 2025, est notre réponse.
Nous avons mis l'accent sur une création plus fluide et intuitive, avec des mises à jour clés concernant le nouveau modèle d'interface utilisateur et le comportement des paramètres. Ces améliorations visent à simplifier les tâches quotidiennes et à mieux accompagner les commerçants dans leur processus de création.
Voici les améliorations qui transformeront l'expérience de création dans GemPages – pour le mieux :
1. Séparation plus claire des contrôles de style et de mise en page
Pendant longtemps, l'inspecteur d'éléments de GemPages utilisait un système à deux onglets : l'un pour le style, l'autre pour personnaliser l'apparence de l'élément sur la page. Cela fonctionnait, mais il n'était pas toujours évident de savoir par où commencer. Certains utilisateurs ignoraient des paramètres clés simplement parce qu'ils n'étaient pas présentés comme prévu.
Comment nous l'avons amélioré :
Dans cette mise à jour, nous avons conservé la structure à deux onglets, mais avons clarifié leurs rôles.
- L'onglet Paramètres se concentre désormais uniquement sur la présentation visuelle d'un élément, incluant la typographie, la couleur, les arrière-plans, les bordures et les images. Ces contrôles s'appliquent à zone de contenu principale de l'élément.
- L'onglet Avancé Gère le comportement et l'intégration de l'élément dans la mise en page, notamment l'espacement, l'alignement, le positionnement, la visibilité et l'affichage réactif. Ces paramètres s'appliquent à récipient extérieur, ou boîte englobante, de l'élément.
Qu'est-ce que cela signifie pour vous?
En séparant clairement la conception visuelle du placement structurel, cette mise à jour apporte plus de clarté et de contrôle à votre flux de travail.
Plus besoin de deviner où se trouve un paramètre ni de naviguer entre les panneaux pour effectuer les modifications nécessaires. Le style visuel (typographie, couleurs et images, par exemple) est regroupé là où il doit être. Les commandes d'espacement, d'alignement et de visibilité sont organisées de manière logique et conservées à l'écart jusqu'à ce que vous en ayez besoin.
Cette structure améliorée permet de réduire la charge cognitive, de minimiser les retouches et de vous concentrer sur la création de pages à la fois visuellement cohérentes et structurellement solides.
2. Nouvelle interface utilisateur avec un modèle de numérisation plus lisible
| Conception ancienne | Refonte |
 |
 |
Dans les versions précédentes de l'inspecteur d'éléments, la structure des contrôles variait d'un paramètre à l'autre. Certains utilisaient des piles verticales, d'autres combinaient libellés et valeurs de manière incohérente. À mesure que de nouveaux paramètres étaient ajoutés, le panneau devenait plus difficile à parcourir, surtout lors d'un travail rapide ou de la modification de plusieurs éléments à la suite.
Comment nous l'avons résolu :
Un modèle de balayage cohérent de gauche à droite.
Chaque paramètre de cet onglet suit désormais un modèle clair de gauche à droite : Étiquette → Valeur.
À première vue, ce n'est qu'un léger changement. Mais lorsque vous modifiez des dizaines d'éléments, cette cohérence se renforce. de confianceVous n'avez pas besoin de réapprendre la structure des paramètres d'un bloc à l'autre. Votre œil sait où aller.
Ce modèle améliore non seulement l'évolutivité à mesure que davantage de paramètres sont introduits, mais il forme également les utilisateurs à naviguer plus efficacement dans l'éditeur, aidant ainsi les équipes débutantes et expérimentées à progresser plus rapidement, avec moins d'erreurs.
Paramètres imbriqués dans les popovers.
Certains paramètres ne se limitent pas à une seule valeur : ils ouvrent des ensembles complets de commandes connexes. Auparavant, ces options supplémentaires étaient affichées en ligne, ce qui agrandissait rapidement le panneau Paramètres et rendait l'interface trop chargée.
Pour y remédier, nous avons introduit une nouvelle structure : paramètres imbriqués dans les fenêtres contextuelles.
Cliquer sur un paramètre comme « Bordure » ouvre une fenêtre contextuelle claire et ciblée (une fenêtre flottante à côté du panneau) affichant uniquement les commandes pertinentes. Ces fenêtres contextuelles peuvent comporter jusqu'à trois niveaux de profondeur, chaque groupe enfant ne s'ouvrant qu'en cas de besoin.
Qu'est-ce que cela signifie pour vous?
- It maintient le panneau principal des paramètres bien rangé, affichant uniquement les options de niveau supérieur par défaut.
- It réduit le débordement, en particulier pour les nouveaux utilisateurs qui n'ont pas besoin de tous les paramètres avancés au préalable.
En masquant la complexité jusqu'à ce qu'elle soit nécessaire, l'éditeur devient plus facile à analyser et plus rapide à parcourir, sans sacrifier la puissance.
3. Nouveau comportement des paramètres
Cette mise à jour de la version 7 introduit de nouveaux types de paramètres et affine le comportement de certains paramètres existants, rendant les interactions plus rapides, plus claires et plus faciles à contrôler.
De nombreux paramètres fonctionnent désormais selon le principe « ajouter/supprimer ». Au lieu de partir d'un champ vide, cliquer sur un contrôle insère automatiquement une valeur par défaut. Vous pouvez ensuite l'ajuster ou la supprimer d'un simple clic.
Ce simple changement d'interaction permet de réduire les efforts manuels souvent nécessaires à la configuration. Il vous offre un point de départ clair, sans approximation, pour vous concentrer sur les ajustements plutôt que sur la création de nouvelles fonctionnalités.
Pourquoi cela compte
En appliquant automatiquement les valeurs par défaut, l'éditeur supprime les étapes inutiles et maintient votre flux de travail en mouvement.
Vous prendrez des décisions plus rapidement, réduirez les saisies répétitives et éviterez d'être ralenti par des paramètres qui ne nécessitent pas de personnalisation approfondie.
Qu'est-ce qui a changé dans le panneau Paramètres ?
| Paramètres | Conception ancienne | Refonte |
|---|---|---|
| Mise en page: Les paramètres imbriqués sont désormais regroupés dans une fenêtre contextuelle, affichant uniquement l'étiquette parent et sa valeur actuelle. |
 |
  |
| Mise en contexte: Le paramètre d'arrière-plan mis à jour vous offre plus de flexibilité en ajoutant la vidéo comme nouvelle option, aux côtés de la couleur et de l'image. |
 |
 |
| Forme: Les paramètres de bordure sont ajustés à l'intérieur d'une fenêtre contextuelle, y compris les paramètres :
|
 |
|
| Rembourrage: Dans l'ancienne version, le Padding était parfois placé dans l'onglet Paramètres ou l'onglet Avancé. Dans cette mise à jour, le remplissage a été déplacé vers l’onglet Paramètres. |
|
|
| Alignement: Le paramètre d'alignement est désormais situé en bas du panneau de l'éditeur, sous Taille et Arrière-plan. |
 |
 |
Parcourir les paramètres des éléments par type
Pour vous aider à naviguer plus rapidement, voici une liste catégorisée de tous les éléments pris en charge dans l'éditeur mis à niveau.
Chaque lien vous mène à un article dédié contenant des détails sur le fonctionnement de l’élément et sur la façon de configurer ses paramètres.
1. Éléments de base
2. Éléments interactifs
3. Éléments multimédias
4. Éléments du produit
- Produit
- Liste des produits
- Bouton du panier de produits
- Titre du produit
- Prix du produit
- Comparaison de prix des produits
- Description du produit
- Voir le produit Plus
- Paiement dynamique des produits
- La quantité de produit
- Fournisseur de produits
- Produit REF
- Image du produit
- Variante et échantillon du produit
- Insigne de produit
- Étiquette de remise sur le produit
- Compteur de stock de produits
- Sticky Ajouter au panier
- Téléchargement du fichier produit
- Ensemble de produit
- Champ personnalisé de produit
5. Éléments de l'article
- Liste d'articles
- Image de l'article
- Le titre de l'article
- Extrait de l'article
- Contenu de l'article
- Date de l'article
- Article Auteur
- Catégorie d'article
- Balise de l'article
- Lire l'article
6. Éléments de formulaire
- FORMULAIRE D'INFORMATION
- Infolettre
- Déroulante
- Case à cocher
- Bouton Soumettre
- Champ e-mail
- Champ de texte
- Zone de texte
Merci pour vos commentaires