einzelne Wörter in anderer Schriftart

  • Gelöst Anna

    (@anna88sabu)


    vor 1 Jahr, 7 Monaten

    Hallo zusammen, ich benutze Gutenberg und Theme Astra Free. Ist es möglich, dass man in einer einzelnen Zeile oder Überschrift ein einzelnes Wort in einer anderen Schriftart anzeigen lassen kann?
    Ich habe 2 eigene Schriften lokal auf dem Server eingebunden, diese sind mit Serifen und ohne Serifen.
    Jetzt möchte ich eine Überschrift gestalten und ein oder mehrere Wörter in einer anderen Schriftart zeigen.

    Ich war schon im Bereich der Blocks: „in HTML bearbeiten“, aber ich wusste nicht genau, was ich eingeben soll. Es geht nicht um Änderung der Farben für einzelne Wörter, dies kann ich erledigen. Es geht um Änderung der Schriftart für einzelne Wörter. Ist dies überhaupt möglich in Gutenberg?
    Oder gibt es ein Plugin für dieses Problem?

Ansicht von 3 Antworten – 1 bis 3 (von insgesamt 3)
  • Moderator Bego Mario Garde

    (@pixolin)

    Moderator (nicht mehr aktiv)

    vor 1 Jahr, 7 Monaten

    Der Bockeditor bietet keine Formatierungsmöglichkeit, um in einem Absatz oder einer Überschrift die Schriftart zu wechseln.

    Als Workaround kannst du aber in Überschriften und Absätzen einzelne Wörter z.B. als „Tastatureingabe“ formatieren. Dazu markierst du das Wort, klickst auf den Pfeil nach unten (1) und wählst „Tastatur-Eingabe“ (2) als Formatierung:

    Screenshot
    Zum Vergrößern bitte anklicken …

    Das sieht zunächst etwas ungewöhnlich aus, aber du kannst zusätzlich im Customizer unter Zusätzliches CSS angeben, wie das HTML-Tag <kdb> aussehen soll. Ist die Überschrift mit Serifen, möchtest du vielleicht sowas verwenden:

    kbd {
  font-family: Helvetica, Arial, sans-serif;
  font-style: normal;
}

    Für den eher unwahrscheinlichen Fall, dass du das Tag <kbd> doch irgendwo auf deiner Website einsetzen oder die Schriftart in Überschrift und Absatz unterscheiden willst, kannst du das ein bisschen ergänzen. Beispiel:

    h2 kbd {
  font-family: Helvetica, Arial, sans-serif;
  font-style: normal;
}

p kbd strong {
  font-family: "Times New Roman", Times, serif;
  font-style: normal;
}

    (Die untere Regel sorgt dafür, dass Text in Absätzen, der als Tastatur-Eingabe und fett formatiert wurde, in einer Serifenschrift ausgegeben wird).

    Ein wenig getrickst, aber eine effektive Methode. 😉

    Thread-Starter Anna

    (@anna88sabu)

    vor 1 Jahr, 7 Monaten

    Hallo und erst einmal vielen Dank! Ich habe das jetzt folgendermassen gelöst: ich habe im jeweiligen Blockabschnitt statt visuelles Bearbeiten die HTML-Bearbeitung eingestellt(ich arbeite mit Gutenberg, Astra free und Spectra, das gehört quasi zu Astra) und dem Wort oder Wörtern eine span class vergeben in html. Im Customizer habe ich dann per CSS diese Klasse gestylt. Durch die Klasse konnte ich jetzt überall in den Headlines relativ schnell die einzelnen Wörter gestalten in der anderen Schrift. Ist diese Methode auch ok? Zumindest hat es optisch geklappt. Im Grunde genommen ist meine Methode deiner wahrscheinlich ähnlich. Deine Methode lese ich mir durch, die finde ich nämlich auch sehr interessant! Ich hatte mich schon gefragt, was ich mit der „Tastatur-Eingabe“ Funktion machen könnte. Coole Idee von dir, damit kann ich für die Zukunft einiges bearbeiten.

    Moderator Bego Mario Garde

    (@pixolin)

    Moderator (nicht mehr aktiv)

    vor 1 Jahr, 7 Monaten

    Deine Methode ist die sauberere Lösung, vor der ich mich nur gescheut hatte, weil ich es nicht zu kompliziert machen wollte. Wenn da damit aber zurecht kommst, ist das so völlig korrekt.

    Weil damit deine Frage beantwortet ist, ändere ich den Status des Threads auf „gelöst“.

Ansicht von 3 Antworten – 1 bis 3 (von insgesamt 3)
  • Das Thema „einzelne Wörter in anderer Schriftart“ ist für neue Antworten geschlossen.