Anleitung zum Einbinden eigener Fotos

  • Wenn Du Dich fragst, wie man im Forum am besten Fotos zeigen und in Beiträge einbinden kann, obwohl man keinen eigenen Webspace besitzt, bist Du hier genau richtig. :) (Bitte stelle sicher, dass Du auch wirklich die RECHTE an dem gezeigten Bild/Foto hast, es also im Idealfall selber fotografiert bzw. gemalt hast.)


    Ich möchte den Vorgang anhand eines bekanntes Bilder-Hosters, "Abload.de", zeigen.
    Vom Grundsatz her funktioniert es aber bei anderen Anbietern ganz ähnlich:




    1. Vorbereiten des Hochladens


    Im ersten Schritt wählen wir die Option "Bilddateien" und merken uns den Link "Bilder von der Festplatte hinzufügen" (grüner Pfeil).



    ab1.jpg




    Sofern das Bild nicht bereits am PC schon verkleinert wurde, wählen wir am besten jetzt schon die Option "verkleinern", dort unter dem Bildschirm-Format "4:3" möglichst "Passend in 800 x 600" (blau markiert), das reicht völlig.
    So ist sichergestellt, dass das Foto gar nicht erst zu groß gespeichert oder gar im Forum dargestellt wird und durch unsere Software "zwangsverkleinert" werden muss, was stets die schlechtere Alternative wäre.



    ab2.jpg







    2. Der Upload, das Hochladen des Fotos


    Die Vorbereitung ist abgeschlossen, nun können wir das Bild auf die Reise schicken, also zum Server hochladen. Dazu klicken wir auf den eben gemerkten Link (grüner Pfeil) und es öffnet sich das bekannte Auswahlfenster für Dateien auf dem lokalen Computer, hier anhand von Windows (7) zu sehen.




    ab3.jpg




    Der Rest ist sicher bekannt, also Datei aussuchen und entweder sofort doppelklicken oder über "Öffnen" bestätigen. Ich nehme hier gleich das Erste mit dem netten Haflinger.


    So sollte es nun aussehen, ein letzter Check über die gesetzte Skalierung und den Dateinamen: 800 x 600 und Name passen, also Klick auf "Abload!".




    ab4.jpg







    3. Auswahl des richtigen Codes zum Einbinden


    Bis hierher wars ja völlig easy, aber jetzt folgt der etwas "schwierigere Teil", bei dem auch hier im Forum die meisten Fehler gemacht werden (keine Angst, "wir schaffen das!"). ;)
    Nämlich den korrekten Code zum Einbinden zu finden.


    Ohje, da sind ja eine Menge unterschiedlicher Code-Schnipsel zu sehen, "URL=....", "HTML". "a href=....", "HTTPS.....", was davon nehme ich jetzt nur damit das Bild sofort sichtbar wird?



    ab5.jpg




    Also das vergessen wir bitte gleich ganz schnell wieder! Denn das sind genau DIE Codes, die innerhalb eines Foren-Beitrags üblicherweise eben NICHT funktionieren und bestenfalls zu Fehlern führen.
    Sie verweisen in aller Regel auf eine andere Seite des Anbieters, auf der dann "irgendwo" natürlich auch das Foto zu sehen ist. Genau das wollen wir ja nicht und da müsste Jörg wieder ran und die Einbindung manuell korrigieren.
    Der einzig korrekte Weg führt über den DIREKTEN Verweis zum Bild/Foto, nicht über URLs des Anbieters oder gar HTML-Codes etc.



    Und bitte woher bekommen wir nun diesen direkten Pfad? Nichts einfacher als das!
    Dazu bitte direkt mit dem Maus-Pfeil (auch "Cursor" genannt) auf das hochgeladene (und somit angezeigte) Foto beim Hoster gehen und die RECHTE Maustaste betätigen.
    Jeder Browser verfügt über ein Kontext-Menü, über das uns entweder "Bild/Grafik-Eigenschaften" und somit auch der Pfad angezeigt wird, oder (noch besser) sogar eine Direkt-Verlinkung per "Bildadresse kopieren" möglich ist. Diese Option bitte nach Möglichkeit wählen, das ist nach wie vor der mit Abstand beste Weg.



    ab6.jpg




    Es ist halt extrem wichtig, dass der Link / die URL direkt auf einem Grafikformat (wie .jpg, .png, .gif usw.) endet und keinesfalls auf ".html", ".php" oder ähnlich, wie man leider oft in Foren sehen kann.
    Denn diese URLs verweisen auf andere Seiten, lassen sich also folglich nicht direkt in Beiträge einbinden. Immer schön direkt auf das Foto verweisen, dann klappt es auch.
    Natürlich gilt das ebenfalls, wenn man Fotos über seinen eigenen Webspace hostet.








    4. Foto / Grafik einfügen und freuen


    War schwierig? Nö, oder? Egal, jetzt wirds wieder total einfach, versprochen!
    Nun haben wir ja den richtigen Pfad zur Datei in unserem Zwischenspeicher (auch wenn das nirgendwo zu sehen ist) und wählen hier im Text-Editor das Icon zum Einfügen von Grafiken / Bildern / Fotos.


    Wer es nicht kennt, es sieht so aus: insertimage.gif
    Und auch das habe ich gerade über dieses Symbol hier eingefügt, es klappt also mit jeder beliebigen Grafik-Datei, egal wo auch immer sie im Internet gespeichert sein mag.


    Es wird also nur ein reiner IMG-Code hier erzeugt, den uns so aber die meisten Hoster leider nicht vorgeben.
    Wenn wir alles richtig gemacht haben, sollte unser kleiner niedlicher Hafi nun hier zu sehen sein, ich habe den Code zusätzlich zentriert, damit das Foto schön mittig erscheint:



    hafi1aksq3.jpg




    Sodele, nun viel Spaß beim Ausprobieren und Nachmachen. :)

    Was sagt ein Frosch, wenn man ihm den Hals umdreht? "Jööööörrrg"


    Aus technischen Gründen befindet sich der Rest der Signatur auf der Rückseite dieses Beitrags.

    (und nichts geht schneller, als wenn man es sofort richtig macht)


  • Übrigens findest Du hier auch eine (erweiterbare) Link-Liste mit diversen Bilder-Hostern.


    Der beschriebene Vorgang ist i.d.R. überall sehr ähnlich. Da sollte jeder seinen bevorzugten Anbieter finden.

    Was sagt ein Frosch, wenn man ihm den Hals umdreht? "Jööööörrrg"


    Aus technischen Gründen befindet sich der Rest der Signatur auf der Rückseite dieses Beitrags.

    (und nichts geht schneller, als wenn man es sofort richtig macht)


  • Da die Frage ja doch immer wieder mal aufkommt, mit welchem Icon im Editor man nun die Fotos einbindet, habe ich nun ein kleines Video (im .mp4 Format) erstellt, welches HIER heruntergeladen und im lokalen Video-Player angesehen werden kann, falls der Browser die Wiedergabe nicht unterstützt.


    Dort zeige ich neben dem Einbinden auch kurz 2 andere Funktionen des Beitrags-Editors.


    Update: Hier nun auch direkt im Beitrag zu sehen:


    Was sagt ein Frosch, wenn man ihm den Hals umdreht? "Jööööörrrg"


    Aus technischen Gründen befindet sich der Rest der Signatur auf der Rückseite dieses Beitrags.

    (und nichts geht schneller, als wenn man es sofort richtig macht)


Participate now!

Don’t have an account yet? Register yourself now and be a part of our community!