Bouton de nouveau sujet

:discourse2: Résumé Nouveau Topic Header Button ajoute un bouton « Nouveau sujet » pratique dans l’en-tête de toutes les pages
:eyeglasses: Aperçu Aperçu sur Discourse Theme Creator
:hammer_and_wrench: Dépôt https://github.com/discourse/discourse-new-topic-button-theme-component
:question: Guide d’installation Comment installer un thème ou un composant de thème
:open_book: Nouveau sur les thèmes Discourse ? Guide de débutant pour utiliser les thèmes Discourse

Installer ce composant de thème

Fonctionnalités

Un composant de thème simple permettant d’ajouter le bouton + Nouveau sujet à l’en-tête. Le bouton s’affichera sur chaque page, même à l’intérieur des sujets.

Captures d’écran :

Bureau :

Mobile :

Paramètres :

Nom Description
icône du bouton nouveau sujet Choisissez une icône pour le bouton. Vous pouvez utiliser n’importe quel nom d’icône gratuit FontAwesome 6 comme music ou star.
texte du bouton nouveau sujet Saisissez le texte que vous souhaitez que le bouton utilise. Vous pouvez également laisser ce champ vide si vous souhaitez utiliser uniquement une icône.
titre du bouton nouveau sujet Saisissez le titre que vous souhaitez que le bouton utilise. Si ce champ est laissé vide, le titre sera identique au texte du bouton.
masquer le bouton par défaut Masquer le bouton « Nouveau sujet » par défaut dans les listes de sujets
afficher aux anonymes Afficher le bouton aux visiteurs non connectés et les rediriger vers la page de connexion au clic

:discourse2: Hébergé par nous ? Les composants de thème sont disponibles pour une utilisation sur nos plans Standard, Business et Enterprise.

57 « J'aime »

Pretty awesome. Now we’re talking!

FYI, we pushed the button yesterday and it was our 2nd biggest day in registrations for the past 30 days. Not sure if it was coincidence or not, but I have a feeling it’s a good way to onboard new users. Will keep an eye on the metrics

(Realizing now it must have been a coincidence, because the button only appears for users who have already logged in. Nonetheless, activity does seem to be higher)

5 « J'aime »

Hi,

Is it possible to change the color of the button, but not change the color of all buttons in the site?

If so, which is the css code for the button only?

thanks!

1 « J'aime »

Use this code, changing the color obviously.

#new-create-topic {
    background-color: red;
}
3 « J'aime »

Hm, how about showing the new topic button for everyone and make it act like the default Reply-to-topic button, i.e. as the user to login/sign up if they’re not logged in?

In fact, this might be something to consider for the default new topic button too, but I guess this feature would be most effective in this theme component…

4 « J'aime »

Inviting every random visitor to create a new topic… will end in tears :sob:

Nothing kills a site quicker than a page full of low-value or gibberish topics.

7 « J'aime »

Well, they can’t create that topic unless they sign up. And encouraging people to sign up is obviously a good thing (and is being done by default via the sign-up button and the reply-to-topic button). So I don’t really see why the new topic button should cause any problems.

6 « J'aime »

Is it possible to hide the button on mobile but show the floating button?

To hide the button on mobile add

.header-buttons #new-create-topic {
    display:none;
}

in your mobile > CSS tab

The floating button you are referring is the one used on the Material Design Theme component? If so you need to copy and paste the part of CSS relative to the floating button (New Topic Fab) from material-design-stock-theme/desktop/desktop.scss at main · discourse/material-design-stock-theme · GitHub to your mobile > CSS tab (deleting the lines that start with @include [...]).

However your requests are going off topic, it’s better if you open another topic.

4 « J'aime »

Thanks, sorry for the offtopicing :slight_smile:

1 « J'aime »

C’est bien, mais cela présente deux inconvénients à mon avis.
Premièrement, l’emplacement du bouton dans la barre supérieure. Nous avons déjà d’autres éléments ajoutés à cette barre, ce qui la rend un peu encombrée.
Deuxièmement, le fait qu’il apparaisse sur toutes les pages, même là où cela semble illogique (par exemple sur ma page de profil ou la liste des groupes).
Le cas d’utilisation principal, selon moi, est de faciliter légèrement aux utilisateurs l’évitement des réponses hors sujet lorsqu’ils consultent un fil de discussion. L’endroit où je trouve qu’il est vraiment nécessaire et utile est lors de la consultation d’un sujet/fil, et idéalement, j’aimerais qu’il apparaisse à la fois en haut (en ligne avec le titre du sujet) et en bas, à côté du bouton bleu principal « Répondre ».
Une solution intermédiaire consisterait à l’afficher à la position actuelle, mais uniquement sur les pages /t/xxx.
Est-ce possible ?

Je ne veux pas l’afficher sur mobile, comment faire ?

Je souhaite également le montrer aux utilisateurs non enregistrés ; en cliquant sur le bouton, vous serez invité à vous connecter.

Oh. C’est dommage. Je ne sais pas ce que signifie « mauvaise position » (cela semble correct sur mon site de test), mais je supposais que le bouton fonctionnerait, ce que je vois maintenant ne pas être le cas. On dirait que ce n’est pas aussi simple que je le pensais. :visage_triste:

1 « J'aime »

Créez un nouveau composant de thème et ajoutez ceci dans l’onglet Mobile > CSS :

.mobile-view #new-create-topic {
    display:none
}
4 « J'aime »

Bonne idée — l’as-tu fait ?

Quelqu’un peut-il m’aider à identifier le CSS à cibler pour que ce bouton « + Nouveau sujet » ait exactement le même aspect et le même fonctionnement que le bouton coloré « Répondre » sur mon site ? (c’est-à-dire à l’état normal, ainsi qu’au survol et lors du clic — état actif ?)

Voici une explication visuelle de ce que je souhaite faire…

8 avril 2020 - Enregistrement Loom|vidéo

changer sa classe en btn-primary ?
(je ne suis pas sûr qu’on puisse avoir deux éléments btn-primary sur une page)
Si vous voulez une solution purement CSS, inspectez le style du bouton bleu principal (dans tous ses états) et reproduisez-le.

Merci pour ce composant @Joe.
Il fonctionne parfaitement, à une petite exception près :slight_smile:
Sur mobile, j’ai toujours deux boutons : le nouveau et le bouton par défaut + Nouveau sujet.

J’ai fait disparaître le bouton par défaut en modifiant la définition de style suivante :


Maintenant, tout fonctionne bien sur les ordinateurs de bureau et sur les mobiles, mais il serait appréciable que votre composant gère cela. Surtout que, pour une raison quelconque, si un administrateur désactive votre composant, aucun bouton + Nouveau sujet ne sera visible.

4 « J'aime »

@Johani, j’ai créé une demande de tirage avec la modification mentionnée ci-dessus.

Pourrais-tu s’il te plaît la consulter ?

2 « J'aime »

Merci pour le composant ! Je pense qu’il existe de bons cas d’usage pour toujours avoir l’option de créer un nouveau sujet dans l’en-tête. Cependant, je rencontre une difficulté concernant un détail de l’implémentation et je me demande comment d’autres l’abordent :

Actuellement, le composant reflète la catégorie sur laquelle se trouve l’utilisateur et ouvre l’éditeur avec cette catégorie pré-remplie. Mais il ne prend pas en compte si l’utilisateur dispose des droits d’écriture pour cette catégorie spécifique. Ainsi, il pré-remplit l’éditeur avec cette catégorie (alors que l’utilisateur ne pourrait pas la sélectionner manuellement) et entraîne une erreur lors de la tentative d’enregistrement du sujet.

Le bouton « Nouveau sujet » par défaut résout ce problème en étant désactivé sur ces catégories. Mais je pense qu’il ne serait pas très intuitif de copier ce comportement, car l’idée du bouton dans l’en-tête est d’offrir un accès global pour créer de nouveaux sujets. Il serait donc étrange qu’il ne soit pas fonctionnel dans certains cas.

Quelle pourrait être une bonne approche générale pour cela ? Ou comment d’autres utilisateurs de ce composant le gèrent-ils ? Faut-il simplement abandonner le pré-remplissage ?

3 « J'aime »