Réglages de thème

Beaucoup de thèmes livrent une page de réglages à — une UI de configuration par thème où les admins customisent le thème sans quitter le CMS.

Beaucoup de thèmes livrent une page de réglages à /admin/#/theme-settings — une UI de configuration par thème où les admins customisent le thème sans quitter le CMS.

Ce qui est customisable dépend entièrement du thème. Le CMS fournit le framework ; chaque thème décide ce qu'il expose.

Où la trouver

Quand le thème actif a une page de réglages, une entrée Theme settings apparaît dans la sidebar (au-dessus de Plugins). Basculer vers un thème sans page de réglages cache l'entrée automatiquement.

La route admin est /admin/#/theme-settings. Le wrapping ThemeSettingsRoute résout le manifest du thème actif, merge le defaultConfig du manifest avec la valeur stockée en base, et passe le résultat au composant de réglages du thème.

Ce que chaque thème intégré expose

default

Quatre onglets :

  • Home — choix entre liste latest-posts ou static-page comme home
  • Single — toggle de la sidebar (auteur + liens connexes), toggle des breadcrumbs
  • Sidebar — éditer les items des sidebars (footer, header secondaire si présent)
  • Style — overrides de palette (22 variables CSS éditables), polices serif + sans

magazine

Quatre onglets :

  • HomeheroVariant (image-overlay / split / banner), listVariant (cards / list), listColumns, widgets sidebar du home (sidebarTop / sidebarBottom)
  • Single — toggle de la sidebar, breadcrumbs
  • Sidebar — composants disponibles : Most read, Promo card, Author bio, Related posts
  • Style — overrides Material 3 (couleurs RGB triplets + une font serif + une font sans + Material Symbols)

corporate

Quatre onglets :

  • Home — pas de personnalisation lourde (home est typiquement une static-page)
  • Single — CTAs de header (URL de contact, label), toggle de la sidebar
  • Form — paramètres du formulaire de contact (endpoint Formspree, fallback mailto)
  • Style — overrides palette (Material 3 indigo + navy), une seule police (sans-serif par défaut)

marketplace-core

Plusieurs onglets :

  • Home — composition des sections d'arrivée (hero, feature grid, cta banner, etc.)
  • Sidebar — items des 3 groupes (Discover, Categories, Documentation)
  • Footer — copyright text
  • Brand — wordmark text (override de settings.title pour le logo texte)
  • Style — overrides palette + fonts headline / body

Stockage

settings/site.themeConfigs[<theme-id>] est l'emplacement persisté. Survit aux basculements — si vous re-basculez vers ce thème plus tard, ses réglages sont restaurés.

updateThemeConfig(themeId, config) est le dispatcher qui écrit (Firestore ou SQLite selon backend).

Quand les changements s'appliquent

  • Réglages de style (palette, polices) → CSS regénérée via compileCss(config) ET uploadée à theme-assets/<id>.css au save → les pages déjà publiées affichent les nouveaux styles au prochain reload du navigateur (cache 1h Flexweg)
  • Réglages de layout (toggles de sidebar, choix de heroVariant) → nécessitent un Regenerate all HTML pour que chaque page existante reflète le changement (ces réglages sont consommés par les templates au moment du rendu HTML)

Pour résumer : palette / polices = sync auto, layout = nécessite Regenerate.

L'auto-resync

Quand l'utilisateur clique Save sur la page de réglages style, le pattern recommandé est que le thème :

  1. Patch pluginConfigs via updateThemeConfig
  2. Appelle compileCss(config) pour générer la CSS finale
  3. Upload la CSS via l'API Files (applyAndUploadCustomCss)

Sans le re-upload, l'utilisateur doit cliquer manuellement sur Sync theme assets pour voir le changement.

Voir Page de réglages thème pour le pattern d'auteur.

i18n

Les pages de réglages thème supportent l'i18n via useTranslation('theme-<id>'). Chaque thème intégré expose ses bundles dans manifest.i18n — donc les pages de réglages sont automatiquement traduites dans les 7 langues admin.

Reset to defaults

Pas de bouton standard. Pour purger les overrides, éditez settings/site.themeConfigs.<id> en base (Firestore Console ou SQLite directement).

Workaround utilisateur : pour purger uniquement les overrides de style, mettez chaque variable CSS à sa valeur par défaut manuellement dans la page de réglages.