3.1.x 3.2.x Font Awesome Icons für Topics und Forums
Verfasst: Mi 14. Feb 2018, 14:10
Du möchtest eigene Grafiken für die Forum- und Topic-Icons verwenden, kennst dich aber nicht mit Grafikprogrammen aus und kannst keine eigene erstellen? In diesem Fall kannst du auch die Icons von Font Awesome verwenden. Ich habe das mal mit Icons aus dem medizinischen Bereich gemacht. Und so sieht das dann aus:
Vorgehensweise:
Lade den Ordner herunter und extrahiere die Dateien. Der Ordner enthält das Stylesheet font_awesome_for_topics_and_forums.css. Das musst du noch in das Stylesheet deines Styles einfügen, indem du diese Zeile kopierst
dann das stylesheet.css im Ordner theme deines Styles öffnest und die Zeile am Ende einfügst. Danach das geänderte Stylesheet abspeichern.
Im Stylesheet font_awesome_for_topics_and_forums.css kannst du die Grafiken und die Farben definieren.
Für die Grafiken brauchst du den jeweiligen vierstelligen Unicode aus Buchstaben und Zahlen. Den fügst du dann bei content: ein. Gehe zur Seite https://fontawesome.com/v4.7.0/icons/ und such dir ein Icon aus. Nehmen wir die Badewanne. Du klickst die Badewanne an und kommst zur Seite für das Icon Badewanne. Unter der Badewanne findest du Unicode: f2cd . Der Unicode für die Badewanne ist also f2cd. Diesen Code kopierst du und fügst ihn in das Stylesheet ein, z.B. bei forum_read:before: { content: "\f2cd"; Die Farbe für die Grafik kannst du unter color:#29599b; definieren. Du möchtest z.B., dass das Icon schwarz angezeigt wird, dann gibst du bei Farbe color:#000000; an, denn #000000 ist der Farbcode für schwarz. Einen Color Picker findest du hier: https://htmlcolorcodes.com/. Kopiere jeweils den hex Farbwert.
Danach speicherst du die Änderungen ab, leerst den Cache und aktualisierst die Seite und dann sollten die Icons angezeigt werden.
Du musst ansonsten nichts am Stylesheet ändern. Du musst lediglich den Unicode für das Bild und den Farbwert für die Farbe anpassen. Mehr nicht.
Ein Videotutorial gibt es hier: https://www.youtube.com/watch?v=3AKJggZ ... e=youtu.be
WICHTIG: Wenn du das Stylesheet font_awesome_for_topics_and_forums.css in prosilver einbaust, wird es möglicherweise beim nächsten Update gelöscht. Du musst es dann wieder manuell hinzufügen.
Lade den Ordner herunter und extrahiere die Dateien. Der Ordner enthält das Stylesheet font_awesome_for_topics_and_forums.css. Das musst du noch in das Stylesheet deines Styles einfügen, indem du diese Zeile kopierst
Code: Alles auswählen
@import url("font_awesome_for_topics_and_forums.css?v=3.2");Im Stylesheet font_awesome_for_topics_and_forums.css kannst du die Grafiken und die Farben definieren.
Für die Grafiken brauchst du den jeweiligen vierstelligen Unicode aus Buchstaben und Zahlen. Den fügst du dann bei content: ein. Gehe zur Seite https://fontawesome.com/v4.7.0/icons/ und such dir ein Icon aus. Nehmen wir die Badewanne. Du klickst die Badewanne an und kommst zur Seite für das Icon Badewanne. Unter der Badewanne findest du Unicode: f2cd . Der Unicode für die Badewanne ist also f2cd. Diesen Code kopierst du und fügst ihn in das Stylesheet ein, z.B. bei forum_read:before: { content: "\f2cd"; Die Farbe für die Grafik kannst du unter color:#29599b; definieren. Du möchtest z.B., dass das Icon schwarz angezeigt wird, dann gibst du bei Farbe color:#000000; an, denn #000000 ist der Farbcode für schwarz. Einen Color Picker findest du hier: https://htmlcolorcodes.com/. Kopiere jeweils den hex Farbwert.
Danach speicherst du die Änderungen ab, leerst den Cache und aktualisierst die Seite und dann sollten die Icons angezeigt werden.
Du musst ansonsten nichts am Stylesheet ändern. Du musst lediglich den Unicode für das Bild und den Farbwert für die Farbe anpassen. Mehr nicht.
Ein Videotutorial gibt es hier: https://www.youtube.com/watch?v=3AKJggZ ... e=youtu.be
WICHTIG: Wenn du das Stylesheet font_awesome_for_topics_and_forums.css in prosilver einbaust, wird es möglicherweise beim nächsten Update gelöscht. Du musst es dann wieder manuell hinzufügen.