| Résumé | F NAV - Onglets de navigation mobile | |
| : eyeglasses: | Aperçu | Theme Creator |
| Dépôt | GitHub - VaperinaDEV/f-nav-for-mobile: F NAV - Mobile Navigation Tabs | |
| Guide d’installation | Comment installer un thème ou un composant de thème | |
| Nouveau sur les thèmes Discourse ? | Guide du débutant pour l’utilisation des thèmes Discourse |
Installer ce composant de thème
Bonjour ![]()
Auparavant, j’ai créé un sujet Dev sujet pour cela en tant que concept de composant de thème et maintenant il est dans un état pour être un Theme component.
Assurez-vous de le tester avant de l’utiliser en direct.
Quelques informations ici sur le composant : F NAV - Theme component concept
À propos du composant de thème. J’ai lu tellement de publications à ce sujet qu’il serait formidable de rendre la Barre d’onglets Discourse pour mobile plus dynamique et d’ajouter la possibilité de gérer par exemple les notifications, etc… F-NAV peut faire cela et plus encore…
En-tête
Il masque le hamburger, le menu utilisateur, la recherche et le chat et ajoute un bouton de menu de profil (avatar) qui contient le contenu par défaut de l’onglet de profil du menu utilisateur.
Paramètres
Il contient également un paramètre où vous pouvez ajouter des éléments personnalisés avant l’élément Déconnexion.
Il contient trois champs où vous pouvez facilement ajouter des éléments personnalisés.
Il existe quelques paramètres pour afficher/masquer les icônes d’en-tête par défaut, ce qui est utile lorsque vous ne souhaitez pas placer l’onglet exact dans F NAV afin qu’il soit affiché dans l’en-tête.
Onglets
Il est possible d’associer différentes fonctions aux onglets. Ces fonctions permettent à chaque onglet de changer dynamiquement.

Ces changements comprennent :
Fonctions
home
- transforme l’icône de l’onglet d’accueil sur les routes de sujets en une flèche gauche qui ajoute une fonction de retour arrière

- ajoute un point indicateur de sujet nouveau ou non lu

hamburger (ouvre le menu hamburger)
multi
Onglet multi
L’onglet Multi est automatiquement remplacé par l’onglet message si le chat n’est pas activé ou si l’utilisateur le désactive dans les paramètres utilisateur.
La bulle de notifications change selon qu’elle est urgente ou non.
Les notifications urgentes de l’onglet Multi sont vertes et ressemblent à ceci. ![]()
Développé
Le message personnel est toujours vert mais le chat peut être bleu comme à l’origine, par exemple une notification de message de canal non lu.
Développé
Notification unique
message
- ajoute un bouton de message avec notifications et le cliquer ouvre une modale de messages pour un aperçu rapide
chat
- ajoute un bouton de chat avec ses fonctions
notificationToRoute
-
si le mode ne pas déranger est actif, l’icône de cloche changera en icône de cloche barrée et le temps jusqu’au dnd apparaîtra

-
redirige vers la page de notifications du profil en contournant le menu de notification
-
si il y a une notification, redirige vers
/notifications?filter=unread -
s’il n’y a pas de notification, redirige vers
/notifications -
s’il y a un contenu à réviser, un drapeau rouge apparaîtra et redirigera vers
/review
notificationMenu
-
si le mode ne pas déranger est actif, l’icône de cloche changera en icône de cloche barrée et le temps jusqu’au dnd apparaîtra

-
ouvre le menu de notification
search
- redirige vers la page
/searchbasée sur le contexte
Paramètres
J’ai essayé de rendre les paramètres aussi simples que possible.
Ils contiendront quatre champs.
- name : Ceci est juste pour identifier plus facilement l’onglet dans les paramètres.
- icon : Ajoute une icône à l’onglet. Remarque : Si vous sélectionnez une fonction, il peut y avoir des icônes qui ne peuvent pas être remplacées par ce paramètre.
- destination : Ajoute une destination pour votre onglet personnalisé. Remarque : Si vous sélectionnez une fonction qui gérera la destination, vous pouvez la laisser vide. Le composant gère les destinations
/my/...en les convertissant automatiquement en/u/username/...afin que le statut actif des onglets puisse être ajouté correctement. - function : Choisissez une fonction pour l’onglet.
Les administrateurs peuvent simplement créer/supprimer/modifier des onglets et choisir parmi l’une des fonctions ou ajouter une destination personnalisée à l’onglet.
Fonctions ![]()
Par exemple, l’ajout d’un onglet de création de sujet ressemblera simplement à ceci.
Crédit : Barre d’onglets Discourse pour mobile et merci à tous pour vos commentaires dans le sujet F NAV - Concept de composant de thème. ![]()


















