Nous venons de publier la deuxième itération de notre refonte du thème. Alors que la première mise à jour était un rafraîchissement visuel construit sur la base du thème précédent « Meta Branded », cette version est essentiellement un nouveau thème entièrement reconstruit à partir de zéro. Le nouveau langage de marque avait déjà été introduit avec la version précédente, il n’y a donc pas de changement visible majeur de ce côté. Ce qui a considérablement changé avec cette mise à jour, c’est l’implémentation du thème elle-même, ainsi que ce qu’elle révèle de notre orientation en matière de personnalisation de Discourse dans son ensemble.
Je vais vous présenter quelques détails d’implémentation, en commençant par les éléments les plus petits :
Icônes Lucide
Lucide est un ensemble open source d’icônes modernes au trait, et nous l’avons adopté dans plusieurs de nos projets de personnalisation. Avec cette itération, nous l’avons également intégré au thème Meta Branded. Il n’est pas prévu de remplacer Font Awesome dans le cœur de Discourse, mais la version gratuite de Font Awesome ne propose qu’un choix limité d’icônes au trait, insuffisant pour former un système cohérent d’icônes au trait. Le composant de thème est disponible sur github.com/discourse/discourse-lucide-icons.
Modificateur de thème pour restreindre les palettes de couleurs
Nous avons ajouté un nouveau modificateur de thème only_theme_color_schemes qui restreint les palettes de couleurs disponibles pour un thème donné, tant pour les administrateurs que pour les utilisateurs dans leurs préférences d’interface. Meta propose plusieurs palettes sélectionnables par l’utilisateur qui entreraient en conflit avec l’identité visuelle du thème Meta Branded. Grâce à ce modificateur, seules les palettes fournies avec le thème sont proposées comme options.
PR : FEATURE: add modifier to restrict theme color schemes
Mise en page pleine largeur
Nous testons également quelques ajustements au composant Discourse Full-width pour mieux centrer le contenu principal de la page. De nombreux éléments dynamiques dans l’en-tête compliquent la configuration, et pour l’instant, cette fonctionnalité est expérimentale et disponible uniquement sur une branche du composant.
Transformateur de valeur pour contrôler la visibilité de la bannière de bienvenue
Nous avons utilisé un nouveau transformateur de valeur welcome-banner-display-for-route pour contrôler programmatiquement sur quelles routes la bannière de bienvenue principale s’affiche. Nous l’utilisons pour nous assurer que la bannière n’apparaît que sur la page d’accueil personnalisée par défaut et non sur les pages qu’un utilisateur aurait définies comme sa page d’atterrissage personnelle.
PR : DEV: Add welcome-banner-display-for-route value transformer
Cela nous amène aux deux changements plus importants :
Page d’accueil personnalisée via un modificateur de thème
Le modificateur de thème custom_homepage est disponible depuis près de deux ans, mais c’est la première fois que nous l’utilisons pour façonner l’expérience de la page d’accueil sur Meta lui-même. Nous introduisons une page d’atterrissage personnalisée remplie de composants mis en avant. Pour le lancement initial, cela comprend des catégories mises en avant et un aperçu des derniers sujets de discussion.
Nous avons créé ces composants mis en avant en utilisant notre nouvelle API Blocks expérimentale, ce qui nous amène au changement le plus important :
API Blocks : Première utilisation en production
L’API Blocks est un nouveau framework pour créer des mises en page modulaires et composites dans Discourse. Il permet aux développeurs de thèmes d’assembler des pages à partir de composants autonomes et réutilisables qui peuvent être placés dans des zones de mise en page définies. Le thème Meta est notre premier déploiement en production de cette API.
Le framework dispose d’un ensemble riche d’outils de développement : activez les outils de développement et vous pourrez inspecter la structure des blocs de n’importe quelle page avec une superposition intégrée qui visualise toutes les zones de mise en page actives et leurs composants.
Au-delà de la page d’accueil, nous utilisons également des blocs pour afficher des bannières de catégorie personnalisées qui montrent les sous-catégories de chaque catégorie :
Il s’agit toujours d’une prévisualisation précoce du système dans un contexte de production. Nous prévoyons de publier une documentation et plus d’exemples sous peu.
PR : DEV: Add Block API for declarative, validated UI extension points






