it-swarm.com.de

Twitter bootstrap 3 - erstelle ein benutzerdefiniertes Glyphicon und füge es dem Glyphicon "font" hinzu

Ich verwende Twitter bootstrap3 und bin äußerst zufrieden mit der neuen Art und Weise, wie das Symbol als Schriftart behandelt wird. Allerdings: Ich benötige einige benutzerdefinierte Symbole. Ich muss sie selbst erstellen und im Idealfall in die vorhandene Schriftart integrieren. Ich habe ohne Glück gesucht. Ich kenne mich gut mit Illustratoren, Vektorgrafiken usw. aus, aber wie integriere ich sie?

Im schlimmsten Fall mache ich Bilder auf herkömmliche Weise, hoffe aber, dass es eine bessere Lösung gibt.


Wie integriere ich ein benutzerdefiniertes Glyphicon in die vorhandene Glyphicon-Schriftart (Bootstrap 3)?

62
benteh

Dieser Prozess kann eine Option sein.

Sie können die IcoMoon App verwenden. Ihre Bibliothek enthält FontAwesome, mit dem Sie schnell loslegen können, oder Sie laden Glyphicon herunter und laden die Datei fontawesome-webfont.svg hoch

Erstellen Sie für Ihre benutzerdefinierten Symbole SVGs, laden Sie sie zu IcoMoon hoch und fügen Sie sie dem FontAwesome/Glyphicon-Set hinzu.

Wenn Sie fertig sind, exportieren Sie den Zeichensatz und laden Sie ihn wie jede andere Symbolschrift.

Viel Glück!

[~ # ~] Update [~ # ~]

Wenn Ihre importierten SVG-Dateisymbole nach dem Import in iconmoom.app nicht richtig ausgerichtet sind, überprüfen Sie zunächst, wie sie bei der Verwendung auf einer Webseite tatsächlich aussehen. Mir scheint, dass die Vorschau nicht immer perfekt ist. Alternativ gibt es ein Bearbeitungssymbol in der Symbolleiste von iconmoon.app, mit dem Sie die Größe ändern und verschieben können.

82
David Taiaroa

Wenn jemand nach einem anderen Tool als dem hier genannten sucht, hat sich Glyphter als sehr nützlich erwiesen. Es ist ziemlich einfach und ermöglicht es Ihnen, ein .svg Datei, pflegen Sie es und fügen Sie weitere Glyphen aus mehreren anderen Schriftpaketen hinzu. Sie können dann das gesamte Bundle als eigene Schriftart herunterladen.

1
MattMakes