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 :
- Home —
heroVariant(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.titlepour 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>.cssau 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 :
- Patch
pluginConfigsviaupdateThemeConfig - Appelle
compileCss(config)pour générer la CSS finale - 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.