Contenu de la page d'accueil et surcharges de marque

Audience

Cet article s'adresse aux opérateurs de la plateforme GCM. Les administrateurs d'église devraient consulter l'article sur la marque du Constructeur de site web — cette page-là concerne leur site public, celle-ci concerne le site marketing GCM à geniuschurchmanager.com.

Les onglets Landing et Marque contrôlent ensemble l'apparence de la plateforme pour un visiteur tout nouveau : la page d'accueil marketing, l'écran de connexion, la favicon dans son onglet de navigateur, le logo dans la barre latérale de chaque espace de travail connecté, l'image Open Graph quand quelqu'un partage un lien dans Slack. Tout cela vit dans deux tables, est modifié depuis deux onglets, et s'applique à l'échelle de la plateforme dès que vous enregistrez.

Deux onglets, un objectif

• Landing (/platform/landing) modifie le texte et les images par locale qui s'affichent sur la page d'accueil marketing. Stockés en tant que surcharges dans landing_page_content ; retombe sur les valeurs par défaut i18n cuites dans le bundle lorsqu'aucune surcharge n'existe.
• Marque (/platform/branding) modifie tout le reste : nom de la plateforme, slogan, logo, favicon, société de pied de page, e-mail de support, couleurs de thème, liens sociaux, bouton Visite guidée. Stockés dans la table clé-valeur plate platform_settings.

Les deux onglets partagent une bibliothèque de médias, limitée au chemin Supabase storage uploads/platform/. Les images téléversées pour la page d'accueil (platform/landing/) sont aussi visibles dans l'onglet Marque (platform/branding/) et l'onglet PWA (platform/pwa/), et vice versa — choisissez une fois, réutilisez partout.

Surcharges de contenu de la page d'accueil

L'onglet Landing liste neuf sections de la page marketing, chacune en accordéon :

1. Section héros — premier pli. Badge, titre, sous-titre, CTA, lien "voir les tarifs", illustration optionnelle.
2. Bandeau de preuve sociale — bande sous le héros ("Approuvé par 200+ églises").
3. Section problème — bloc narratif. Titre, description, citation, auteur de la citation, illustration.
4. Grille de fonctionnalités — six capacités produit avec titre + description chacune.
5. Interlude scripturaire — verset + référence.
6. Comment ça marche — explicatif en trois étapes.
7. Plus de fonctionnalités — liste à puces. Le champ items est un élément par ligne.
8. Aperçu des tarifs — bloc d'accroche.
9. CTA final — bannière de clôture.

Une liste déroulante de locale dans l'en-tête de la carte bascule entre English, Español, Français, Português. Chaque locale est un ensemble séparé de surcharges ; basculer ne perd pas les modifications non enregistrées dans la locale d'origine (l'état par locale est indépendant).

Comment fonctionne le pré-remplissage

Chaque champ de texte est pré-rempli avec le texte effectif actuel, pas la surcharge. Cela signifie :

• Si aucune surcharge n'existe, le champ affiche la valeur par défaut i18n de src/i18n/locales/{en,es,fr,pt}.json.
• Si une surcharge existe, le champ affiche la valeur surchargée.
• Le badge de statut vous dit lequel : surchargé (violet) ou non enregistré (ambre).

De cette façon, lorsque vous ajustez le titre de "Know Your Flock" à "Know Your Flock Better", vous n'avez pas à retaper toute la chaîne — vous modifiez le texte visible et le système détecte le diff. Vider le champ et enregistrer est la façon canonique de réinitialiser à la valeur par défaut i18n ; la ligne est supprimée de landing_page_content afin que le texte du bundle transparaisse.

Enregistrer

Trois portées d'enregistrement :

• Enregistrer au niveau champ — apparaît à côté d'un champ une fois que vous avez des modifications. Persiste juste ce champ.
• Enregistrer au niveau section — apparaît en haut d'une section d'accordéon quand n'importe lequel de ses champs est sale. Persiste tous les champs sales de cette section en un seul upsert.
• Réinitialiser au niveau section — apparaît quand n'importe lequel des champs de la section est surchargé. Supprime ces lignes afin que les valeurs par défaut i18n reviennent.

Les enregistrements invalident deux caches de requête : landing-content-admin (cet onglet) et landing-content (la page marketing en direct). Le changement apparaît sur geniuschurchmanager.com au prochain rendu.

Champs d'image

Les champs d'image (hero_image, problem_image, cta_image) utilisent le StorageMediaLibraryDialog partagé. Cliquez sur Choisir / téléverser pour ouvrir le sélecteur, qui vous permet de téléverser un nouveau fichier ou de choisir parmi les fichiers existants dans uploads/platform/landing/, uploads/platform/branding/, ou uploads/platform/pwa/.

Le sélecteur stocke le chemin, pas l'URL — resolveStorageUrl le transforme en URL publique au moment du rendu, donc si vous déplacez le bucket plus tard, les références continuent de fonctionner. Une petite vignette d'aperçu et un lien "Voir en taille réelle" se trouvent à côté du champ.

Chemins de stockage, pas URLs

Coller une URL complète https://... dans un champ d'image fonctionne pour l'aperçu mais contourne le résolveur d'URL à l'échelle de la plateforme. Les futures migrations de bucket le casseront. Choisissez toujours depuis la bibliothèque.

Onglet Marque

L'onglet Marque est disposé en cinq sections :

1. Identité de la plateforme

• Nom de la plateforme — affiché sur la page de connexion et le titre de l'onglet du navigateur.
• Slogan / Sous-titre — affiché sous le nom de la plateforme sur la page de connexion.
• Logo — carré. Recommandé 512x512 PNG ou SVG. Le sélecteur se limite à uploads/platform/branding/.
• Favicon — petit carré. Recommandé 32x32 ou 64x64 ICO/PNG.
• Société de pied de page / URL / e-mail de support / année de copyright — utilisés dans le pied de page marketing et dans les e-mails transactionnels.

2. Couleurs et thème

Trois sélecteurs de couleur (primaire, secondaire, accent), chacun avec une entrée hex en direct et une rangée d'échantillons d'aperçu en direct en bas de la carte. Les changements s'appliquent globalement via les variables CSS — ils affectent le site marketing et la coque connectée.

3. Marketing et SEO

Titre / sous-titre / CTA / lien CTA du héros, plus l'URL de l'image OG et la méta description (plafonnée à 160 caractères avec un compteur en direct). Ce sont les valeurs par défaut à l'échelle de la plateforme ; la surcharge du héros de l'onglet Landing les bat quand présente.

4. Liens sociaux

URLs Facebook, Instagram, Twitter / X, YouTube, TikTok. Les champs vides sont masqués dans le pied de page rendu.

5. Bascules de fonctionnalités

Actuellement une : Visite guidée. Quand activée, les nouveaux utilisateurs obtiennent un assistant de visite pas à pas à la première connexion. La bascule écrit à la fois dans platform_settings.guided_tour_enabled et platform_config.guided_tour_enabled pour garder les deux sources de vérité alignées ; si l'écriture miroir échoue, la bascule revient en arrière et un toast vous le dit.

Le bouton "Tout enregistrer"

Les modifications de marque ne s'enregistrent pas par champ — elles s'accumulent dans l'état local jusqu'à ce que vous appuyiez sur Enregistrer tous les paramètres de marque en bas. L'enregistrement :

1. Upsert chaque ligne modifiée dans platform_settings avec la nouvelle valeur et un updated_at frais.
2. Invalide le cache platform_branding_settings.
3. Appelle refetchBranding() sur le BrandingContext afin que la barre latérale, l'en-tête et les couleurs de thème de la page se rafraîchissent sans rechargement complet.

Si l'enregistrement échoue à mi-chemin, l'état local est préservé pour que vous puissiez réessayer — la page ne se réinitialise pas.

Quels changements sont audités

Les modifications de marque et de landing écrivent dans platform_audit_log avec les actions branding_settings_saved et landing_content_updated respectivement. Les valeurs avant / après sont capturées dans les métadonnées, donc une future question "qui a changé le texte du héros il y a trois semaines" a une réponse claire dans le Journal d'audit.