Oh my - that did the trick, thank you so much!
I tried “building” just in the theme component (didn’t work) and “fas-building” in both places (didn’t work) but it didn’t cross my mind to try the plain version in both fields.
I still would suggest to make this differene between fa(s) and fab/far more clear in the component description.
Hello.
Thanks for the great plugin.
I would be grateful if you could provide one support.
I have a Login Required setting on my Discourse.
When I visit a site with this setting, I am naturally asked to create an account or log in, and the header shows an icon that I created with this plugin.
Need account or login page(in Japanese)
If that’s all there is to it, there’s no problem, but if you click on them, you will be able to open the linked page without logging in.
(The link is to a plugin that I created myself, and the Path is a path directly under the site root, such as /test_path. Even with this path, if you specify the URL directly, etc., you will be asked to create an account or log in. Only if you go through the header icon of this plugin, the page will be displayed without login).
The best solution is to not show the icon in the first place, but at the very least, you need to be able to click on the icon to see the page that asks you to log in.
I would really appreciate it if you could help me with a solution. Thank you very much.
Hey @Johani. It looks like this needs to be updated for the new way theme variables work. I see this error in the admin panel:
Error: Undefined variable: "$add-whitespace". on line 14 of common.scss >> @if $add_whitespace == "true" { ----^
Hello,
I’m linking to a limited access page, where I need to pass in some variables to the url. Would it be possible to get some system variables like username, userid, mail etc?
I am looking for the same thing. I want to post the logged-in user’s username to a remote server when the header icon is clicked. I understand that I can get the username via javascript, but I am not sure how I can do so this via a header icon:
<script type="text/discourse-plugin" version="0.8">
const username = api.getCurrentUser().username;
</script>
Thanks!
Nur zur Information, ich habe einen Fehler in den Anweisungen zu den Theme-Einstellungen bemerkt.
Oben steht, dass die Reihenfolge title, icon, URL, view, target lautet.
Unten steht jedoch, dass die Reihenfolge title, icon, view, URL, target lautet.
Die obere Angabe ist korrekt, da die URL vor der Ansicht steht.
Siehe unten für den Screenshot:
Ich habe gerade einen PR dafür gemacht:
Danke! Ich nehme an, eines Tages werde ich lernen, wie man einen PR macht und den Mut dazu haben 
Gibt es eine Möglichkeit, die Position des Icons anzugeben? Ich verwende ein benutzerdefiniertes Icon, aber ich habe den Chat und eine weitere Theme-Komponente Icon im selben Header und möchte das benutzerdefinierte Header-Icon neben dem Such-Icon platzieren.
Hallo zusammen!
Vielen Dank für die tolle Theme-Komponente! Ich bin jedoch auf ein kleines Problem gestoßen: Einige Icons funktionieren einwandfrei, z. B. fa-rocket, aber andere werden nicht angezeigt, z. B. fa-rocketchat, obwohl ich glaube, dass ich alle notwendigen Icon-Klassen installiert habe. Irgendwelche Ideen, was das verursacht? Ich würde mich sehr freuen 
Außerdem: Wie bekomme ich normale Font Awesome Icons anstelle der soliden? Ich habe versucht, far-iconname und fa-regular einzubinden, aber das scheint nicht zu funktionieren…
Wahrscheinlich wegen diesem
Für den ersten Teil deiner Frage. Ich könnte falsch liegen, aber versuche, das Rocket.Chat-Icon zu deinem svg icon subset in den Website-Einstellungen hinzuzufügen.
Leider löst das das Problem für mich nicht.
Der Header-Link lautet:
Rocket.Chat,rocket,https://chat.domain.de,vdo,blank
Unter Svg Icons in den Theme Component Settings und Svg icon subset in den Discourse Main Settings habe ich fa-rocketchat und fa-brands hinzugefügt, wie in der Font Awesome Icon-Beschreibung beschrieben. Es wird seit FA Version 5.0.0 unterstützt, das kann es also nicht sein…
Hat jemand Ideen und kann mir vielleicht helfen?
Sie müssen:\n\n1. fab-rocketchat zu svg icon subset hinzufügen.\n2. Header links zu Rocket.Chat,fab-rocketchat,https://chat.domain.de,vdo,blank ändern.\n\nDie Anweisungen sind irreführend, aber wenn man sie noch einmal betrachtet, wahrscheinlich nicht ungenau:\n\n[quote="Joe, post:1, topic:86307, username:Johani"]\nIcon kann jeder FontAwesome 5 (free) Icon Name ohne die Präfixe fa-, fab- oder far- sein.\n\nWenn das von Ihnen gewünschte Icon nicht angezeigt wird, fügen Sie es zur Einstellung svg_icons in der Komponente hinzu. Wenn Sie neue Icons hinzufügen, müssen diese mit den FontAwesome 5 Präfixen wie fab, far und fas versehen werden.\n[/quote]\n\nDer schwierige Teil ist, dass Sie fab fa-rocketchat (auf der Font Awesome Website) in fab-rocketchat (auf Discourse) umwandeln müssen.
Gibt es eine Möglichkeit, SVG-Icons, die ich auf meine Website hochlade, hinzuzufügen? (Ohne die von der Font Awesome-Website zu verwenden)
Ich zerbreche mir den Kopf über etwas, das ich nicht lösen kann!
Ich benutze das “headset”-Symbol und kann es normal verwenden
aber wenn ich das “light headser”-Symbol verwenden möchte, kann ich es überhaupt nicht benutzen
Ich habe es bereits mit ‘fab-’ ‘fas-’ oder ‘far-’ versucht, ich habe es ohne versucht, ich habe den Namen bereits im SVG-Teil angegeben, ich habe alles versucht, aber ich kann es nicht benutzen
[image]
dasselbe mit dem Google Play Store-Symbol, ich kann es nicht benutzen und keinen Weg
Warum passiert das?
Es könnte sein, dass die helle Version ein „Pro“-Symbol ist:
Um den hellen Stil von „headset“ zu verwenden, benötigen Sie ein Abonnement für einen Pro-Tarif oder eine unbefristete Pro-Lizenz, die die spezifische Version von Font Awesome enthält, in der dieses Symbol (oder dieser Stil) veröffentlicht wurde.
Das würde ich auch gerne wissen. Ich möchte ein Letterboxd-Icon einfügen (irgendwo im Web, solche wurden bereits erstellt und Fontawesome vorgeschlagen, aber nicht akzeptiert).
Sie können Ihre eigenen SVG-Icons mit einem Thema hinzufügen:
Wie platziere ich die Symbole am unteren Rand der Website (im mobilen Modus), sodass sie für alle gleich angezeigt werden?
Zum Beispiel: Der Zeitleistenschaltfläche erscheint für alle verschiedenen Mobiltelefonmodelle und mobilen Systeme an der gleichen Position.
Wenn ich jetzt CSS verwende, um das Menü der Header-Schaltflächen unten zu platzieren, erscheint es auf einigen Handys an der richtigen Stelle, auf anderen erscheint die Position etwas nach oben verschoben, auf anderen etwas zur Seite. Warum passiert das?
Noch ein Zweifel: Gibt es eine Möglichkeit, ein Symbol zu platzieren, das, wenn ich darauf klicke, andere Optionen mit anderen Symbolen öffnet, wie im folgenden Beispiel?