basics, Tipps & Tutorials, tutorial

Bildergröße im Post verändern

Ich wundere mich immer wieder, wenn ich mitbekomme, dass es BloggerInnen gibt, die nicht wissen, wie man die Bildergröße in Blogger verändert. Deshalb zeige ich euch in diesem Tutorial, wie das ganz einfach und schnell geht 🙂

Und für die, die wissen, was sie wollen, habe ich ein schwierigeres Minitutorial in Schritt 3 angehängt 🙂

Bildergröße verändern geht am schnellsten und am besten mit dem Aktualisiertem Editor. Falls ihr das noch nicht habt, könnt ihr das unter Einstellungen –> Grundlegend ändern 🙂

Schritt 1

Ladet das gewünschte Bild in eurem Post. Ich lade sie immer extern hoch, d.h. nicht bei Blogger direkt, sondern bei Photobucket. Dadurch bleibt die Qualität eures Bildes gut.

Schritt 2

Wenn ihr das Bild hinzugefügt habt, müsste es bei euch dann so aussehen. Wenn nicht, dann klickt einmal auf das Bild:

Die Bilder sind alle immer automatisch auf “Mittel” eingestellt. Ihr könnt die Bilder auch kleiner machen. Dafür klickt auf “Klein”.

Ich benutze immer “X-Large”, weil die Bilder dann immer am größten angezeigt werden, ohne, dass sie die Sidebar berühren. Passt aber auf. Meistens sind die Bilder kleiner und werden bei “X-Large” nur unnötig und vor allem unschön gestreckt, von daher drückt am Anfang, wenn ihr nicht genau wisst, wie groß das Bild eigentlich ist auf “Originalgröße”, dann wird euch die, wie schon erwähnt, die Originalgröße angezeigt. Das sähe bei diesem Bild dann so aus:

Unten wird eine Scroll-Leiste angezeigt, was darauf hindeutet, dass das Bild größer ist als die optimale X-Large-Größe. Das ist aber nicht immer der Fall, vor allem, wenn ihr mal Inspirationsbilder von WeHeartIt.com postet, so wie ich das immer gerne mache 🙂

Schritt 3, für die, die wissen, was sie wollen:

Auf HTML bearbeiten könnt ihr die Größe auch bearbeiten.

Hier könnt ihr die Größe des Bildes selber bestimmen. Height ist die Höhe und Width die Breite. Und so rechnet man das aus, denn damit das Bild gut aussieht, müssen die Verhältnisse stimmen!! Achtung, Mathematik 🙂

Width/Breite –> momentane Breite = 640px –> gewünschte Breite (etwas kleiner als euer Postingbereich) = 800px

Height/Höhe –> momentane Höhe= 480px –> gewünschte Höhe = ?

So wird gerechnet:

Die gewünschte Breite geteilt durch die momentane Breite. Ergebnis multipliziert mit der momentanen Höhe ergibt die gewünschte Höhe.
Dann als Ergebnis steht dann: <img border=”0″ height=”600″ src=”…” width=”800″>

Viel Spaß damit und viel Erfolg beim Rechnen 🙂

EDIT:
Ihr braucht nicht mehr rechnen, ihr gebt ein Wert ein, also entweder WIDTH oder HEIGHT und Blogger macht den Rest von alleine 😉

27 Comments

  1. Irmi

    4. January 2011 at 12:31

    Du wunderst Dich bezüglich der eingesstlltn Bilder. Dies alles waren für mich böhmische Dörfer. Ich habe mir alles mehr oder weniger selbst angeeignet. Ich lade grundsätzlich von Picasa hoch und kann daher nur 4 Bilder auf einmal zeigen.
    Ich bin so froh, daß ich hier gelandet bin und werde zukünftig viel bei Dir lesen müssen, vor allen Dingn die älteren Post`s
    Liebe Grüße
    Irmi

  2. fashionvic(tim)

    4. January 2011 at 12:44

    Hi 🙂
    Ich hab nochmal eine Frage bezüglich des Hochladens der Bilder über Picasa. Wo sieht man denn den HTML-Code? Ich find den nicht… 😀

  3. mira

    4. January 2011 at 12:46

    @fashionvic(tim): Entweder rechtsklick und dann "Bild-URL kopieren" drücken, oder rechts in der Sidebar unter "Link zu diesem Foto" klicken 🙂

  4. Katie

    27. August 2011 at 21:36

    mhm bei mir berechnet blogger die höhe nicht automatisch,wenn ich eine breite eingebe..dann sind die bilder verzerrt und sehen doof aus 🙁 woran liegt das? 🙁

  5. mira

    27. August 2011 at 21:38

    Katie: wenn du einen Wert angibst, muss du das andere komplett löschen. Du darfst dann nicht Width und Height gleichzeitig drin haben.

    1. Mrs.Sunshine

      8. November 2012 at 23:49

      Aaaah, genau das beantwortet auch meine Frage 🙂 Perfekt, danke.
      Die Rechnerei und das Eintragen teils sehr krummer Werte war mir schon immer lästig 😉 Super Tipp 😀
      LG 🙂

  6. Zimtstern

    21. January 2012 at 17:41

    das problem ist, dass das Bild dann bei mir pixelig wird, obwohl es eientlich groß genug sein müsste…:( hilfe!

  7. Patrik

    24. January 2012 at 22:47

    Ist es möglich in den HTML-Codes es umzustellen, dass wenn ich meine Fotos auf "X-large" stelle, sie direkt 800Px breit sind, ohne dass ich das bei jedem Bild extra einstellen brauche jedes mal aufs Neue, wenn ich einen Blogpost verfassen möchte?
    Ich kenne mich da kaum aus, aber eigentlich mussdas doch irgendwo in den Vorlagencodes festgelegt sein, wie groß das Bild im Post dargestellt wird und somit auch möglich verstellbar zu sein?

    Lieben Gruß

  8. Magda

    22. February 2012 at 8:18

    Hey, danke (:

    Allerdings stellt sich die Höhe bei mir (ich nutze BloggerDraft) nicht selbst ein.. :S Tipps?

  9. berit

    5. March 2012 at 20:01

    wie macht man das dann hochkant? 😮

  10. Feli in the sky with diamonds ♥

    31. October 2012 at 9:05

    Mal wieder ein herzliches dankeschön! Hab's mit HTML probiert und es hat sogar geklappt – super! 🙂

  11. Anonym

    12. December 2012 at 12:49

    mathe ist also doch brauchbar 😀 danke!

  12. Blue Silver

    19. December 2012 at 21:00

    GsD, ENDLICH schnall ich das mal, die Breite des Fotos im Blog manuell im code zu overriden, wenn der Import von Picasa (mal wieder) zickt – DANKE!!

  13. Elske

    4. January 2013 at 20:03

    Gibt es eine Möglichkeit, die größe des Bildes allgemein festzuhalten?

  14. Julia

    6. January 2013 at 12:55

    Hoffentlich kann mir hier jemand weiterhelfen!
    Ich würde gerne die Bildgröße so einstellen, dass alles
    gleich breit ist aber die bildgröße nicht verzogen ist.
    wie bei dem blog von kristina bazan: http://www.kayture.com
    bitte helft mir! :0

    1. Keziaa

      6. February 2013 at 20:35

      Ich hab es einfach mal ausprobiert, wenn du nach
      a img { suchst und dann
      width: beliebige größe;
      und height: auto;
      klappt, zumindest, wenn ich es richtig verstanden habe, wie du es haben wolltest 🙂

  15. Pina

    20. March 2013 at 13:38

    bei mir stellt Blogger das irgendwie nicht selber ein, aber ich hab ja schöön in mathe aufgepasst und es jetzt auch hingekriegt 😉
    Dankeschön!
    silber-blatt-schwur.blogpsot.de

  16. Lilo Reiter

    31. October 2013 at 19:13

    Ich habe das sonst auch immer so gemacht das ich
    einfach auf das Bild geklickt habe und dann konnte ich die Größe auch immer anpassen aber jetzt geht das leider nicht mehr 🙁 was soll ich jetzt machen? Würde mich freuen wenn ich antworten bekomme

  17. ZimtundZucker

    15. December 2013 at 17:59

    Hey 🙂 Ich bin ganz neu hier und so froh, diese Erklärung hier von dir gefunden zu haben!!
    Aber…
    wie funktioniert das ganze mit hochkanten Fotos? (Die Höhe soll trz. der Breite angepasst werden!! 🙂 )
    Bloggen ist gar nicht so einfach 😀
    Lieben Gruß

  18. sonador

    27. May 2014 at 11:26

    Okay es wäre wirklich lieb wenn mir hier jemand helfen könnte! Ich schaffe es einfach nicht, die Bilder ohne Textfloat einzustellen -.- ich will NICHT, dass der Text neben meinen Bildern steht 🙁

    x-lage = Bilder gehen ÜBER den Postcontent hinaus.
    mittel: blödes text-gefloate.

    Wie kann ich das ändern? Bitte bitte helft mir 🙁

  19. KristinaGifeld

    23. June 2014 at 19:42

    Bei mir ist komischerweise wenn ich den html code der bilder bearbeiten will und eigene werte bei "height" und "width" eingeben will der code height="120" width="800" bei manchen html codes der einpaar bilder gar nicht vorhanden.

    Bei manchen Bildern ist es da bei anderen nicht.
    Ich habs versucht einzufuegen, hat nicht geklappt.

    Hilfe :)))

  20. Franziska Helbing

    21. January 2015 at 12:44

    Dein Blog ist so toll, hier finde ich einfach immer eine Lösung, wenn ich ein Problem oder eine Frage mit meinem Blog habe. ♥
    LG Franzi von franzigrafie http://www.franzigrafie.blogspot.de/

  21. Krea caro

    5. September 2015 at 19:29

    das mit large und x-large einstellen klappt, aber auf dem fertigen blog rutscht bei mir die schrift dann neben das bild und isst plötzlich nicht mehr unter dem bild wie auf der bearbeitungsseite, was is da los??

    1. lovemira

      5. September 2015 at 20:18

      Dann hast du bei den Bildern links oder rechts eingestellt. Stell Zentriert ein, dann rutscht der Text nach unten 🙂 Lg

    2. lovemira

      5. September 2015 at 20:18

      Dann hast du bei den Bildern links oder rechts eingestellt. Stell Zentriert ein, dann rutscht der Text nach unten 🙂 Lg

Leave a Reply to Mrs.Sunshine Cancel