Minima Tutorials, Tipps & Tutorials, tutorial

Schriftart für Posttitel ändern

Hallo Ihr Lieben,

Wir zeigen euch heute, wie Blogspot-Blogger und Bloggerinnen eine andere Schriftart beim Posttitel einbinden können, die man unter Vorlagendesigner nicht findet.

Schritt 1 – Schrift suchen

Öffnet diese Seite: fonts.google.com.

Die Seite sieht so aus:

Rechts oben findet ihr das Suchfeld, falls ihr eine bestimmte Schrift sucht. Ansonsten könnt ihr eure Auswahl unter “Categories” noch weiter einschränken. Ansonsten scrollt einfach durch, bis ihr eine schöne Schrift gefunden habt.
 
Klickt auf das + Zeichen rechts oben an eurer ausgewählten Schrift. Unten erscheint dann ein schwarzer Balken, den ihr anklicken könnt:
 
 
 
 
 

Kopiert den markierten Bereich.

Schritt 2 – Schrift einbinden

 
 
  • Geht zu Design.
  • Öffnet “HTML anpassen”.
  • Sucht mit STRG+F nach </head>
  • Fügt den Code aus Schritt 1 genau eine Zeile über </head> ein. Er sollte unter </b:skin> stehen.
  • Fügt vor dem letzten > Klammer noch ein / Schrägstrich hinzu:
    <link href=”https://fonts.googleapis.com/css?family=Neucha” rel=”stylesheet” />
 
 

 

 
 
 

Schritt 4 – Schrift anwenden



Ab hier trennen sich die Wege für die Vorlagendesigner-Nutzer und dem Blogger mit dem Minima-Design!




a) Vorlagendesigner



So, jetzt sucht ihr wieder mit STRG+F “Post Title“. Es müsste dann so aussehen wie unten.
 
 
 
 

Der gelb-markierte Text ist dann eure aktuelle Schrift (Muss nicht wie bei uns Arial sein, kann genauso gut Trebuchet oder Verdana sein). Schaut zu, dass ihr das richtige erwischt, denn wenn ihr das bei default=”…” ändert, passiert nichts 🙂 Also, schreibt da dann den Namen eurer Schrift hinein, und zwar bei Arial, das heisst, die erste Schriftart in der liste nach dem 22px. Das ist die Schrift, die ihr später auch angezeigt bekommt.

b) Minima Blogger-Design


Ihr sucht nach h3.post-title und fügt direkt darunter den Code aus Schritt 2 zwischen h3.post-title { und } ein, in diesem Beispiel ist es:

font-family: 'Neucha', cursive;

Dann müsste es dann so aussehen:

 

 

 

Dort steht im Beispiel natürlich dann ‘Neucha‘ und nicht ‘Quicksand‘. 😉


Viel Glück und viel Spaß mit eurer neuen Schrift. 🙂

 

12.04.2017 /// Letztes Update von Mira

88 Comments

  1. Rumi

    3. November 2011 at 11:58

    Sehr gu gemacht! Habe gerade Schritt für Schritt mitgemacht und es hat geklappt!

  2. Nur-Aylin

    3. November 2011 at 18:16

    ich find weder "post title" noch ".post h3" :/ was mach ich jetzt?^^

    1. Wolf Niklas

      5. May 2013 at 11:43

      Geht im Dashboard auf "Vorlage", dort auf "Anpassen", dann "erweitert" und ganz unten auf "CSS hinzufügen".
      Dort fügt ihr folgendes ein:

      h3.post-title a{
      //hier eure Anpassungen
      }

      So könnt ihr u.A. auch die font ändern, die ihr zuvor eingebunden habt!
      Da der Posttitel als Link fungiert, muss das Attribut "a" (für "anker") dazu.

      Gruß
      Nik

  3. Anonym

    3. November 2011 at 20:58

    Hat super geklappt, danke für das Tutorial! 🙂

  4. Tatjana

    3. November 2011 at 21:26

    Liebe Blog-Leserinnen und -Leser!!!
    Ich heiße Tatjana und bin Studentin an der Universität des Saarlandes. Im Rahmen meiner Masterarbeit muss ich eine Umfrage durchführen, die sich mit Mode-Blogs beschäftigt. Ich wäre euch allen sehr dankbar, wenn ihr ca. 10 Minuten eurer wertvollen Zeit opfern könntet und einige Fragen beantworten würdet. Die Umfrage ist absolut anonym. Als kleines "Schmankerl" könnt ihr jedoch wenn ihr wollt an einer Verlosung eines 30 €-Amazon.de-Gutscheins teilnehmen.
    Nach alter Pfadfinder-Manier: Jeden Tag eine gute Tat 🙂
    DANKE schon mal!!!
    Tatjana

    http://survey.2ask.de/f67500f357565a09/survey.html

  5. Tamara

    4. November 2011 at 8:47

    Hey. 🙂
    Ich hätte dringend eine Frage; ich habe die Navbar bei mir gelöscht und würde gern einen eigenen "Text" (im prinzip so wie bei dir mit startseite, team, usw.) erstellen. Würde mich freuen wenn du mir helfen würdest. 🙂

    Liebste Grüße.

  6. SARAH

    4. November 2011 at 11:32

    jaa es hat auch bei mir geklappt. habe zwar dieses "value" erst nicht gefunden weil es bei mir irgendwie anders war, aber es ging. vielen dank <3

  7. melissa

    4. November 2011 at 13:58

    bei mir klappt das nicht,wenn ich dass gemacht hab sagt blogger ich solle genau beschreiben was ich gemacht hab und so ;o

  8. marquicee

    4. November 2011 at 21:25

    Bei mir stand auch erstmal gaaaaaaanz viel zwischen skin und head.
    Aber dann habe ich es gefunden und es hat geklappt 🙂

    Wenns jemandem hilft: das richtige ,,head" war bei mir Nummer 23 von 36(steht in dem strg+f kästchen ;))
    Dann direkt dadrüber eingefügt, bei post title schrift verändern und schon ists geschafft!

    DANKE!! 🙂

    herzallerliebstegrüße
    http://marquicee.blogspot.com/

  9. Lisa Marie

    5. November 2011 at 18:44

    ich hab mich shcon lange gefragt wie man das ändern kann. (:

    vielen dank. <3

  10. Ann-Catrin

    11. November 2011 at 19:30

    Bei mir gibt es ".post h3" nicht. Kann mir jemand weiterhelfen? Wäre superlieb! 🙂

  11. fuddled

    14. November 2011 at 19:21

    es hat geklappt, super, danke !!!!

    Dein Blog ist einfach absolut super, denn deine tutorials sind einfach und verständlich und so kann ich mir meinen Blog langsam aber sicher so gestalten wie ich möchte. Danke!

  12. Mrs.Hummel Design

    28. November 2011 at 12:29

    Huhu, bei mir hat es auch geklappt…musste aber meinen Freund fragen ob er mir mal helfen könnte^-^

    Deinen Blog find ich super klasse, hier findet man doch immer hilfe^^

    http://mrshummeldesign.blogspot.com/

    Liebste Grüsse Eure Mrs.Hummel

  13. Herz-und-Leben

    1. December 2011 at 8:46

    Das wollte ich jetzt mal ausprobieren. Leider funktioniert das bei mir nicht. Wo genau kommt denn der Code ganz oben rein, von dem Du schreibst: ??

    und packt einen / am Ende des Codes (sehr sehr wichtig, sonst klappt das am Ende nicht!!).

    Kurz vor und nach /head?

    Viele Grüße nochmal
    Sara

  14. mira

    1. December 2011 at 12:50

    @Herz-und-Leben: Vor dem /head

  15. céleste

    28. December 2011 at 20:16

    Nach etlichen versuchen hat es auch entlich bei mir gklappt (:
    Aber wie kann man den Posttitel Zentrieren?

  16. Vanessa

    7. January 2012 at 18:08

    puuh also ich hab das jetzt schon mehrmals probiert, alles befolgt, aber anscheinend mache ich trzd was falsch..

  17. Mia

    18. January 2012 at 22:44

    Hat super geklappt! Danke!

  18. Anonym

    20. January 2012 at 13:07

    irgendwie steht die schrift da bei mir schon, was mach ich dann?! 😀

  19. Linho

    3. February 2012 at 10:58

    Ohne eure Bildanleitungen wäre ich am Ende….:D Danke!!

  20. PUMMELFEE

    1. March 2012 at 18:57

    Ich hätte da mal eine Frage, und zwar wie kann ich den Post-title und das datum oben zusammen in ein kästchen setzten. undgefähr so: http://www.victoria-originals.com/
    danke :*

  21. Anonym

    6. March 2012 at 20:03

    hab dieses tut gerade entdeckt und total begeistert!
    ich muss einfach mal sagen, wie super ich euren tutorialblog finde!
    super hilfrecih, super erklärt, und macht spaß!!

    vielen lieben dank 🙂

  22. FrauGlamour

    8. March 2012 at 17:08

    hm ich weiß nicht wo ran es liegt aber ich find das .post h3 bei mir nicht 🙁

  23. me.she

    25. March 2012 at 0:36

    ich könnte heulen 🙁
    hab mich sooo gefreut diese seite hier gefunden zu haben und bei mir klappt NiX !
    ich weiß echt nicht wieso .. bei mir sieht der html code total anders aus .. kann es daran liegen das ich ne vorlage gespeichert hab oder keine ahnung ich bin ratlos 🙁

  24. Anonym

    9. April 2012 at 16:58

    Geht das auch für den kompletten Post Text?
    Kathi ☺

  25. Anonym

    18. April 2012 at 14:56

    10000 DAnk, Stunden ohne Euch vorher zu finden, am Pc gegluckt ;)))
    LG
    missi

  26. Ronja

    21. April 2012 at 17:17

    geht nicht.. bei mir geht gar keins eurer tutorials bei denen man irgendwas mit HTML macht!!!

  27. Laura Grant

    28. April 2012 at 17:17

    bei mir funktionierts auch nicht ://

  28. Ronja

    4. May 2012 at 18:46

    funktionert nicht 🙁 nur dass jetzt mein post. titel ganz anders aussieht als vorher und zwar nicht so wie ich wollte, sondern fast nicht lesbar!
    na toll.

  29. Lipstick

    10. July 2012 at 13:26

    DANKE!!!!!!bestes Tutorial! perfekt erklärt!

  30. Darling. ♥

    20. September 2012 at 13:22

    Danke. 🙂
    Hat alles geklappt. 😀

    Aber kann man auch die Schriftfarbe manuell, also im HTML, ändern?
    Wenn ja, könntest du kurz erklären, wie das funktioniert?

  31. Sarah Morgan

    24. October 2012 at 15:23

    Leider klappt das bei mir gar nicht! ;((Mache alles so wie es da steht ;((

  32. Lena♥

    25. November 2012 at 17:50

    Bei der neuen Vorlage muss man nach 'Title Font' suchen, 'Post Title' gibt es da nicht!
    Lena♥

  33. Paula

    9. December 2012 at 17:56

    bei mir funktioniert das irgendwie nicht,bei mir steht dann 'Invalid variable declaration in page skin: The skin variables could not be parsed as they are not well-formed. Input:'
    kann mir vielleicht jemand helfen?:(

  34. shanenoreen

    19. December 2012 at 16:11

    tolles tutorial, aber was ist wenn man keine schrift von google web fonts möchte? gehen die nicht?

  35. Michèle N.

    26. December 2012 at 14:05

    Bei mir funktioniert es leider auch überhaupt nicht. Wenn ich es abspeichern will kommt immer folgende Meldung: Fehler beim Parsen der XML, Zeile 1012, Spalte 5: The element type "link" must be terminated by the matching end-tag "".
    Dabei habe ich alles nach Anleitung gemacht und den Code genau von Google übernommen und das / rangehängt. Ich weiß wirklich nicht was ich falsch mache. Hat jemand einen Tipp?

  36. Tessa Froo

    7. January 2013 at 11:31

    VIELEN DANK!!!!! Hat mir sehr geholfen!:-)))

  37. Brina

    17. January 2013 at 8:44

    Super Tutorial, vielen Dank!

  38. Julia

    3. February 2013 at 4:37

    Bei mir klappt es ebenfalls nicht, da ich kein "Post Title" habe -.-grrrrr und ich finde sonst nichts anderes, wo ich es einfügen kann.

    1. Julia

      4. February 2013 at 1:33

      Ok, habs nun irgendwie hinbekommen. Hätte aber noch eine andere Frage: Kann ich im Post-Titel den ersten Buchstaben in einer anderen Farbe setzen? Bzw wie funktioniert dies?

    2. Wolf Niklas

      5. May 2013 at 11:58

      Dashboard – Vorlage – Anpassen – Erweitert – CSS hinzufügen

      h3.post-title:first-letter {
      color: red;
      }

  39. Jenny

    9. February 2013 at 19:12

    bei mir ändert sich dann nichts 🙁 könnt ihr helfen ?

  40. Nicole von Herzideen

    12. February 2013 at 13:52

    ich hab das problem bei mir steht nirgends value sondern nur default….!?

  41. Valery Klein

    20. February 2013 at 10:33

    super, dass Ihr so viele Tipps auf Eurem Blog gebt!

    Ich habe versucht, eine Schrift hinzuzufügen, bin aber leider nicht sehr weit gekommen. Und ich konnte die von Euch beschriebene Stelle im "HTLM bearbeiten" nicht finden.

    Habe ich eine andere blogger.com-Version und wie könnte sie bei mir lauten?
    Danke für eine Antwort!
    lg Valery

  42. Tamara Carina

    19. March 2013 at 0:00

    AN ALLE DIE PROBLEME HIERBE HABEN:

    nachdem ihr die schritte wie oben beschrieben abgearbeitet habt, müsst ihr noch etwas separat in css einfügen!
    hatte gerade selbst probleme, aber jetzt gehts! (:

    also, wenn ihr euch das bild mit dem web-link vom tutorial oben anschaut, ist nicht nur der link orange unterstrichen sondern auch noch die zeile bei 4., wo steht '4. Integrate the fonts into your CSS'. und genau DAS müsst ihr noch tun.

    bei dem alten blogger design weiß ich leider nicht, wo eure post-überschriften deklariert werden. bei der jetzigen version sind meine post-überschriften unter 'h3.post-title' auffindbar (ich weiß aber nicht, ob das eine allgemeine bezeichnung ist)

    auf jeden fall müsst ihr da eure unter 4. angegebene Zeile (zb. font-family: 'Josefin Sans', sans-serif;) zwischen den geschweiften klammern einfügen.

    so hat es bei mir geklappt, ich hoffe ich konnte ein bisschen helfen!

    x

    http://www.testingmyfate.blogspot.de

  43. Kunstknäul

    22. April 2013 at 19:34

    Hey Danke für das Tolle Tut!
    Das erste mal, dass es geklappt hat! Freu mich total :)))

  44. Wolf Niklas

    5. May 2013 at 11:38

    Hallo und guten Tag,

    an alle Leute, die Probleme haben die Posttitel zu ändern:
    Geht im Dashboard auf "Vorlage", dort auf "Anpassen", dann "erweitert" und ganz unten auf "CSS hinzufügen".
    Dort fügt ihr folgendes ein:

    h3.post-title a{
    //hier eure Anpassungen
    }

    So könnt ihr u.A. auch die font ändern, die ihr zuvor eingebunden habt!
    Da der Posttitel als Link fungiert, muss das Attribut "a" (für "anker") dazu.

    Gruß
    Nik

  45. Michelle

    16. May 2013 at 14:43

    gaaanz wichtig und bitte schnell um Antwort:) kann man das tutorial auch bei dem Design MINIMA anwenden?

    alles liebe:)

    1. Mira Ho

      17. May 2013 at 17:12

      Klar geht das, du musst halt die Anleitung nach den alten Designs machen 😉

  46. Schminkschätzchen

    7. August 2013 at 9:55

    Bei mir steht das head über dem b:skin… auch ohne /. Ein anderes head oder skin kann ich leider nicht finden, habt ihr einen Rat? Es funktioniert so nämlich leider bei mir nicht :/

  47. Patricia

    18. October 2013 at 19:56

    Hey, vor ein paar Monaten hat bei mir alles super geklappt, doch jetzt wollte ich die Schriftart meiner Posttitel noch mal ändern und jetzt bewegt sich gar nichts mehr. Egal, was ich in der HTML-Vorlage oder in den CSS Einstellungen eingebe, nichts passiert. Ich weiß echt nicht mehr weiter! Selbst die Standardschriften nimmt er nicht…
    Wäre toll, wenn ihr mir helfen könntet!!
    Liebe Grüße, Patricia

    1. lovemira

      19. October 2013 at 15:04

      Hast du die Schriften auch richtig eingebunden? Hab mal auf deinen Blog geschaut, im Quelltext ist es nicht.

  48. rememberme

    27. October 2013 at 9:12

    Ich kriege das einfach nicht hin! Habe schon alles ausprobiert :((( MAN! Ich habs bei HTML anpassen eingetragen und dann bei CSShinzufügen auch, weil es das andere bei mir auch alles nicht gibt … Ich verzweifele :(( Was soll ich machen?

  49. Napoleana

    19. November 2013 at 19:28

    Funktioniert bei mir auch nicht. Ich kann noch nicht einmal nach head suchen. Kommt immer Fehlermeldung.

  50. Poppy Moore

    29. November 2013 at 21:19

    Und wie mache ich das mit Schriftarten die ich nur downloaden kann?
    Die die ich möchte gibt es nicht bei googlefonts :/
    Und da wo es sie gibt kann man sie nur runterladen

  51. Anonym

    7. January 2014 at 16:34

    Wooow, cool danke 🙂

  52. Fräulein Wunder

    18. January 2014 at 19:43

    Hab alles gefunden, alles genau so eingefügt, aber im blog hat sich nix geändert. schade… :-((

  53. laughingx

    19. January 2014 at 18:02

    kann mir jemand sagen welches layout sie benutzt? http://colourful-inspiration.blogspot.de/

  54. Wortwanderin

    13. February 2014 at 14:03

    Hätte das Tutorial gerne ausprobiert, nur leider sind alle Fotos nicht mehr zu sehen. So ist es für Anfänger leider nur schwer nachzuvollziehen :/

  55. FashionSuffer

    8. March 2014 at 17:54

    schade kann ich deine Bilder nicht sehen! =( sonst hätte mir dieser Beitrag bestimmt geholfen…
    Ich würde gerne zwei Schriften bei meinem Titel verwenden,.. geht sowas?
    liebe grüsse S

  56. loviedovie

    22. March 2014 at 13:48

    Super ! Schritt für Schritt gemacht und es hat alles geklappt !

  57. Sara

    28. March 2014 at 14:57

    Hmm, ich hätte gern gewusst, an welcher Stelle im Sourcecode man die Schriftart und -farbe für den in den Feeds in meiner Blogliste (die mit den kleinen Vorschaubildchen) ändern kann.

    http://herz-und-leben-blogliste.blogspot.de/

    Im Vorlagendesigner geht das nicht, aber ich nehme sowieso lieber Veränderungen selbst im html-Code vor. Das kann man dann später auch noch nachvollziehen. Nur kenne ich mich nicht so top mehr aus …

    Liebe Grüße
    Sara

  58. Hermine on walk

    12. April 2014 at 19:38

    Hey Leute 🙂 weiß jemand wie man die Schriftart im Post selbst, also nicht nur die Überschrift ändert ??;))) Freue mich sehr über Hilfe 😉

  59. Lea Becker

    16. May 2014 at 14:09

    ich hab da ein problem… ich hätte gerne die helvetica neue als Schrift auf meinem blog, die lässt sich aber schon bei google Fonts nicht hinzufügen. dieser button existiert dort einfach nicht.. was kann ich tun?

  60. Hannah Little Ocean

    29. August 2014 at 18:42

    Kann man auch Fonts verwenden, die nicht von Google Fonts kommen?
    Ich würde nämlich gerne eine von Dafont verwenden!
    http://fakeplasticfriends.blogspot.co.at/

  61. Andrea Pircher

    3. September 2014 at 10:30

    hallo,
    ich habe alles so gemacht, hat leider nicht funktioniert.
    eine freundin hat gemeint ich müsste die schrift vorher auf meinem pc speichern.
    kann es daran liegen. wie speichere ich die schrift?
    lg und danke
    andrea

  62. SophieMadylin Pilgrim

    2. November 2014 at 19:01

    es geht nicht.. 🙁
    habe alles versucht und so gemacht aber blogger scheint mich nicht zu mögen. -.-

  63. Madame Minusch

    17. November 2014 at 14:29

    Liebe Mira,
    gibt es eigentlich eine Möglichkeit, innerhalb des Blogposts eine andere Schriftart für eine Überschrift zu wählen?
    Wäre richtig toll, wenn es einen Tip gibt, wie man das am esten funktionieren könnte.
    Ganz liebe Grüße und vielen Dank für deine stets super klasse Tutorials. 🙂
    Minusch

  64. Susannegold

    8. January 2015 at 20:15

    Ich liebe deine ganzen Tutorials, vielen Dank für die Tipps!!:-)

  65. Katja Junge

    15. February 2015 at 17:45

    Hilfe, ich finde den Reiter "HTML Bearbeiten" bei Vorlage unter Dashboard nicht … bin ich blind ?? Danke & LG, Katja

  66. Glückskind

    29. July 2015 at 11:12

    Hallo liebe Mira, ich habe eine Bitte an dich! Ich habe alles so gemacht wie es oben steht doch leider ändert sich bei der Schrift überhaupt nichts… Egal wie ich es machen. Ein Freund von mir ist Webmaster und selbst mit seinen Anweisungen hat es nicht geklappt. Ich hätte gerne Poiret One als Schriftart, aber es ist immer noch die alte Schrift. Könntest du mir bitte helfen???

    http://www.glueckskind-rebecca.blogspot.de

    DANKE <3

  67. Tatjana Sprenger

    26. September 2015 at 9:22

    Juhu! Hat geklappt! Endlich eine neue Schriftart!!!
    Viele Grüße
    Tatjana

  68. dipali sharma

    28. September 2015 at 7:55

    Facebook USA Likes Help In Winning Web Competitive Events: An Assessment. How Targeted Facebook Followers Can Work As Business Promotional Tools: An Assessment. buying usa facebook likes.

  69. Kleiner Polli Klecks

    10. January 2016 at 17:51

    Liebe Mira, wie kann ich dir eine Nachricht zusenden? Ich bräuchte dringend Hilfe bei meinem Blogspot… du scheinst mir irgendwie allwissend und würde mich super freuen, wenn du eine Minute für mich hättetst. Liebste Grüße Yvonne

  70. Lisa Lucy

    25. January 2016 at 17:11

    Bei mir finde ich nicht < /head>

  71. FräuleinHuddel

    2. March 2016 at 13:23

    Hallo!
    Bei mir funktioniert das ganze auch irgendwie nicht, egal was ich mache. Aber ich kenne mich auch nicht wirklich mit HTML oder CSS aus. Jedenfalls wollte ich den Post-Titel in 'ner anderen Farbe und 'ner anderen Schrift als Post und Datum. Was ja auch im Vorlagendesigner normal möglich ist. Habs dort auch geändert und dort zeigt er mir auch ales si an wie ich will. Gehe ich dann auf meinen Blog ist wieder alles hinfällig. Habs jetzt auch versucht, im HTML-Code das zu ändern so wie dus beschrieben hast, aber da steht bereits die Schrift drin. Nur anzeigen tut ers einfach nicht. Hat jemand 'ne Idee?

    Schrift die rein soll ist Calligraffti in 36x & mit dem Farbcode #b87209"

    🙁
    Liebe Grüße

  72. Romana Friedl

    13. April 2016 at 18:14

    Dein Tutorial hat super funktioniert :). Ich habe wohl schon seit Juni 2015 meinen BLOG (http://romisromane.blogspot.co.at), aber habe mich noch nie in der HTML-Vorlage versucht, dank dir hat es aber wie am Schnürchen geklappt – danke dafür. LG

  73. Kücük Fırın

    4. June 2016 at 10:16

    Super!!!!
    Bei mir hat es geklappt! Vielen, vielen dank für al eure tollen tutorials!!

  74. Kücük Fırın

    4. June 2016 at 10:17

    Super!!!!
    Bei mir hat es geklappt! Vielen, vielen dank für al eure tollen tutorials!!

Leave a Reply to Jenny Cancel