3 verschiedene Möglichkeiten, benutzerdefinierte Schriftarten zu Ihrem WordPress-Site-Theme hinzuzufügen

Es gibt viele interessante und anpassbare Möglichkeiten, wie Sie Ihre WordPress-Website einzigartiger und optisch ansprechender gestalten können. Eine Möglichkeit besteht darin, Ihrer WordPress-Site benutzerdefinierte Schriftarten hinzuzufügen. Schauen Sie sich die Websites einiger Ihrer Konkurrenten an. Sie können den gleichen Ton und Stil nachahmen, den Sie auch mit Ihrer eigenen WordPress-Website zu erstellen hoffen. Achten Sie auf die Verwendung von Schriftarten. Viele erfolgreiche Websites verwenden in der Regel eine Handvoll sorgfältig ausgewählter Schriftarten, die auf der gesamten Website konsistent verwendet werden.

Es gibt so viele benutzerdefinierte Schriftarten, die kostenlos online verfügbar sind und die Sie ganz einfach zu Ihrer eigenen Website hinzufügen können. Nachdem Sie die richtigen Schriftarten gefunden haben, müssen Sie wissen, wie Sie sie auf Ihrer Website anwenden können. Es gibt eine Reihe von Methoden, die Sie ausprobieren können, um dies zu erreichen.

Das Wichtigste zuerst, die richtige Schriftart finden; Es gibt unzählige Websites, die Tausende von kostenlosen Schriftarten zum Herunterladen anbieten. Probieren Sie Google Fonts, TemplateMonster, MyFonts, FontSpring, Cufonfonts, Dafont, Font Squirrel, Edge Web Fonts, 1001 Free Fonts, Fonts.com aus.

Kurz gesagt, es gibt zwei Möglichkeiten, benutzerdefinierte Schriftarten zu Ihrer WordPress-Website hinzuzufügen: manuell oder mit Plugins.

Fügen Sie manuell benutzerdefinierte Schriftarten zu Ihrem WordPress-Site-Design hinzu

Das manuelle Hinzufügen benutzerdefinierter Schriftarten zu Ihrem WordPress kann von Vorteil sein, wenn Sie nicht riskieren möchten, Ihre WordPress-Site mit zu vielen Plugins zu überlasten. Dies kann durch Bearbeiten der @font-face-Direktive erreicht werden. Auf diese Weise können Sie mehrere Schriftarten beliebigen Formats mit Ihrer Website verbinden.

Dies umfasst die folgenden Schritte:

Schritt 1

Laden Sie zunächst Ihre ausgewählten benutzerdefinierten Schriftarten von der Website herunter, die Sie am nützlichsten finden. Sobald die Datei auf Ihrem Computer gespeichert ist, extrahieren Sie dieses .zip-Archiv.

Schritt 2

Anschließend können Sie diese Schriftartdatei auf Ihrem WordPress-Hosting-Server im Verzeichnis „wp-content/themes/your-theme-folder/fonts“ hochladen. Wenn Sie noch keinen bestimmten Ordner für Ihre benutzerdefinierten Schriftarten eingerichtet haben, erstellen Sie einen und speichern Sie ihn dort.

Schritt 3

Als nächstes gehen Sie zum Admin-Bereich von WordPress. Wählen Sie Darstellung und gehen Sie dann zum Design-Editor. An diesem Punkt sehen Sie die style.css-Datei des Themas auf Ihrem Bildschirm. Darunter müssen Sie diesen Codeabschnitt hinzufügen:

 @font-face { font-family: Aguafina Script-Regular; src: url(http://test-site.com/wp-content/themes/your-theme-folder/fonts/AguafinaScript-Regular.ttf); font-weight: normal; }

Denken Sie daran, „URL“ und „font-family“ im Code durch die entsprechenden Werte zu ersetzen, die der von Ihnen gewählten Schriftart entsprechen. Sie sollten diesen Codeabschnitt auch am Anfang der CSS-Datei einfügen, jedoch nach dem Kommentieren des Themas.

Schritt 4

Stellen Sie schließlich sicher, dass Sie auf die wichtige Schaltfläche Datei aktualisieren klicken. Dadurch wird sichergestellt, dass Ihre Änderungen ordnungsgemäß gespeichert werden, bevor Sie die Seite verlassen.

Schritt 5

Anschließend können Sie die Schriftart problemlos überall dort verwenden, wo Sie sie im Stylesheet Ihres Designs anwenden möchten. Unter Verwendung des folgenden Codes:

 .h1 site-title { font-family: "Aguafina Script-Regular", Arial, sans-serif; }

Nachdem Sie diesen Font-Face-Code bearbeitet haben, wird die Schriftart jedes Mal geladen, wenn jemand Ihre Website besucht. Aber Sie haben es noch nicht auf ein bestimmtes Element auf der Seite angewendet. Dazu müssen Sie die entsprechende style.css-Datei, auf die Sie gerade zugegriffen haben, noch einmal abschließend bearbeiten. Sie müssen Code wie den folgenden in die Datei eingeben:

 .site-title { font-family: "Aguafina Script-Regular", Arial, sans-serif; }

Für Sie empfohlen: Anfängerleitfaden: Wie installiere ich ein WordPress-Theme?

Schnelle Notiz:

Denken Sie wie zuvor daran, den Wert für die Schriftfamilie so zu bearbeiten, dass er für die von Ihnen verwendete Schriftart geeignet ist.

Wenn Sie beispielsweise benutzerdefinierte Schriftarten von Google Fonts verwenden, werden Sie sehen, dass es eine Registerkarte namens @import gibt, die Ihnen den entsprechenden Code zum einfachen Kopieren und Einfügen in die style.css-Datei Ihres Designs bereitstellt. Dies kann den gesamten Prozess viel einfacher machen, wenn Sie mit zu viel Codierung nicht vertraut sind.

Dies ist jedoch keine sehr empfehlenswerte Methode mehr. Es sind einige Leistungsprobleme aufgetreten, die Browser daran hindern, mehrere Stylesheets gleichzeitig herunterzuladen. Dies führt letztendlich zu langsameren Seitenladezeiten. Denken Sie also daran, wenn Sie Ihre Schriftarten und Methoden zu ihrer Verwendung auswählen.

Andererseits ermöglicht die manuelle Installation benutzerdefinierter Schriftarten über CSS die Verbindung von Schriftarten in einer Reihe von Formaten, einschließlich SVG, WOFF, TTF und OTF. Mit dieser Methode können Sie auch arbeiten, ohne auf Dienste von Drittanbietern angewiesen zu sein. Ihre Schriftdateien befinden sich auf Ihrem Server. Dies ist der direkteste Weg, benutzerdefinierte Schriftarten zu WordPress hinzuzufügen.

Verwenden Sie Plugins, um benutzerdefinierte Schriftarten zu Ihrem WordPress-Site-Design hinzuzufügen

Viele Leute entscheiden sich für die Verwendung von Plugins, um ihre benutzerdefinierten Schriftarten in ihre WordPress-Sites einzubinden, da dies in vielerlei Hinsicht die einfachste Methode dafür sein kann. Dies gilt insbesondere dann, wenn Sie sich nicht mit der CSS-Codierung beschäftigen möchten. Google Fonts ist eine beliebte Wahl, vor allem, weil es einfach zusammen mit dem WordPress-Plugin verwendet werden kann. Die beiden besten Optionen für Sie sind Easy Google Fonts und Google Fonts Typography. Sobald Sie eines dieser Plugins aktiviert haben, können Sie problemlos auf den gesamten Google Fonts-Katalog von Schriftarten zugreifen, um sie Ihren Seiten hinzuzufügen, ohne sich mit kompliziertem Code befassen zu müssen.

Die Verwendung von Google Fonts ist der einfachste Weg, dies zu tun, und Sie können eine Vorschau Ihrer Änderungen und benutzerdefinierten Schriftarten in Echtzeit auf dem Bildschirm anzeigen.

Je nachdem, welche Schriftdateien Sie verwenden möchten und ob Sie beabsichtigen, ein einzelnes Repository zu verwenden oder nicht, sollten Sie möglicherweise die Verwendung eines alternativen Plugins in Betracht ziehen, z. B. das Plugin für benutzerdefinierte Schriftarten.

Schritt 1

Sobald Sie das Plugin Ihrer Wahl installiert und aktiviert haben, gehen Sie zu Appearance und klicken Sie dann auf die Customizer-Seite, die die Live-WordPress-Design-Customizer-Oberflächenseite öffnet. Hier sehen Sie die Registerkarte Typografie, die Ihnen jeden Abschnitt Ihrer eigenen Website zeigt, auf den Sie Ihre eigenen benutzerdefinierten Schriftarten anwenden können.

Schritt 2

Sobald Sie diese Seite geöffnet haben, können Sie in dem Abschnitt der Seite, den Sie bearbeiten möchten, auf die Schaltfläche Schriftart bearbeiten klicken. Dann können Sie die verschiedenen Unterabschnitte durcharbeiten und Schriftart, Größe, Rand usw. auswählen – diese Abschnitte variieren je nach verwendetem Thema.

Ihr Thema könnte auch bedeuten, dass Sie Ihre Auswahl an Schriftarten für verschiedene Bereiche Ihrer Website nicht direkt bearbeiten können. Es gibt jedoch eine einfache Lösung für dieses Problem: Gehen Sie einfach zu Einstellungen und dann zu Google Fonts, wo Sie Ihre eigenen Schriftsteuerelemente erstellen können. Geben Sie dazu einfach einen Steuerelementnamen in das Feld ein und wählen Sie CSS-Selektoren aus. Auf diese Weise können Sie beliebige HTML-Elemente hinzufügen, die Sie für diese Schriftart verwenden möchten. Nachdem Sie diese Informationen eingegeben haben, achten Sie darauf, Ihre Änderungen zu speichern, indem Sie auf die Schaltfläche Schriftsteuerung speichern klicken, damit Ihre Einstellungen vollständig aktualisiert werden. Sie können dann weiterhin so viele benutzerdefinierte Schriftsteuerelemente erstellen, wie Sie für jeden Abschnitt Ihrer WordPress-Website benötigen.

Schritt 3

Um diese neuen Schriftart-Controller zu verwenden, nachdem Sie sie erstellt haben, gehen Sie einfach zurück zum Abschnitt Aussehen, klicken Sie auf Customizer und dann auf die Registerkarte Typografie. Anschließend sehen Sie die Option mit der Bezeichnung Thementypografie – wenn Sie darauf klicken, können Sie auf Ihre benutzerdefinierten Schriftarten zugreifen, indem Sie einfach auf die Schaltfläche Bearbeiten klicken, damit Sie die gewünschten Schriftarten und das gewünschte Erscheinungsbild für diese bestimmte auswählen können Steuerung. Vergessen Sie noch einmal nicht, Ihre Änderungen zu speichern, indem Sie auf die Schaltfläche „Veröffentlichen“ oder „Speichern“ klicken, um Ihre Website zu aktualisieren.

Schnelle Notiz:

Einige andere großartige benutzerdefinierte WordPress-Schriftart-Plugins, die wir empfehlen würden, sind Custom Font Uploader und Use Any Font – aber es gibt unzählige andere zur Auswahl, also erkunden Sie Ihre Optionen, bevor Sie sich für die entscheiden, die Sie verwenden möchten.

Das könnte Ihnen auch gefallen: 20 meistverkaufte Mikro-Nischen-WordPress-Themes.

Versuchen Sie schließlich, Themen zu verwenden

Zusätzlich zu diesen beiden Hauptmethoden zum Hinzufügen benutzerdefinierter Schriftarten und Typografien zu Ihrer WordPress-Website können Sie auch die Themen verwenden, aus denen Sie auswählen können. Es stehen zahlreiche Designs zur Verfügung, von denen viele über integrierte Optionen verfügen, mit denen Sie Ihre installierten Schriftarten anpassen können. Der Vorgang dafür variiert je nach verwendetem Theme. Suchen Sie also unbedingt nach dem passenden Leitfaden für Ihr Thema. Hochwertige Premium-WordPress-Designs bieten auch Dokumente für den Online-Zugriff, die Richtlinien zum Hinzufügen benutzerdefinierter Schriftarten zu diesem bestimmten Design enthalten.

Visuelle und gestalterische Elemente sind wohl einer der wichtigsten Faktoren bei der Erstellung einer effektiven Website, die die Aufmerksamkeit jedes Besuchers auf sich ziehen wird. Eines der größten Features in diesem Bereich ist die Verwendung von Schriftarten. Unabhängig davon, wie Sie benutzerdefinierte Schriftarten zu Ihrer WordPress-Website hinzufügen, sollten Sie die am besten geeigneten Schriftarten für den Stil, das Publikum, den Inhalt, das Thema und den Ton Ihrer gesamten Website und Marke finden und verwenden.

 Dieser Artikel wurde von Beatrice Beard geschrieben. Beatrice ist professionelle Texterin bei Academic Brits, die sich auf eine beeindruckende Bandbreite an Themen und Fachgebieten spezialisiert hat. Beatrice ist immer offen dafür, ihre persönlichen Erfahrungen zu teilen und Anfängern fachkundige Ratschläge zu geben, um all die vielen Herausforderungen und Besonderheiten bei der Erstellung hochwertiger Inhalte aufzudecken, die sich wirklich verkaufen.