Bronies.de
Bilder einbetten einfach erklärt - Druckversion

+- Bronies.de (https://www.bronies.de)
+-- Forum: Off-Topic (https://www.bronies.de/forumdisplay.php?fid=11)
+--- Forum: Internet & Technik (https://www.bronies.de/forumdisplay.php?fid=54)
+--- Thema: Bilder einbetten einfach erklärt (/showthread.php?tid=14046)



Bilder einbetten einfach erklärt - DerAtrox - 08.08.2013, 01:40

Mir fällt häufig auf, dass häufig Bilder nicht richtig eingebettet sind, oder auch, dass sich User die mühe machen, Informationen wie Autor usw. per Hand in die Spoiler eintragen.

Wie man Bilder richtig einbettet und das am besten noch möglichst schnell, zeige ich euch heute einmal.



1. Der img-Tag
Diesen Tag nutzen wir, um Bilder hier im Forum einbetten zukönnen.
Tags im bbCode werden immer geöffnet und dann später wieder geschlossen.

Um Bilder einzubetten nutzen wir den img-Tag. Zwischen die Öffnung und Schließung kommt dann die URL (also der Link) von dem Bild.

Das sieht dann zum Beispiel so aus:
Code:
[img]https://smilies.bronies.de/smiley/104Rainbow%20Dash/cl-rd-awyeah.png[/img]

Und ausgegeben sieht es folgendermaßen aus:
Zitat:[Bild: cl-rd-awyeah.png]



2. (a) Der spoiler-Tag
Mit dem spoiler-Tag können wir zum Beispiel Bilder verstecken, damit Beiträge sortierter sind und man einen besseren Überblick hat. Man schreibt bei einem Spoiler zwischen die Öffnung und die Schließung den Inhalt. Eigentlich genau wie bei einem Bild. So schreiben wir auch jetzt als Inhalt in den Spoiler das Bild.

Mit diesem Code zum Beispiel:
Code:
[spoiler][img]http://i.imgur.com/m9T3wST.png[/img][/spoiler]

Erhalten wir einen Spoiler, indem sich das recht große Bild von Dashie und Scootaloo befindet:
Zitat:
Spoiler (Öffnen)



2. (b1) Spoiler benennen (Teil 1)
Um einem Spoiler einen Namen zugeben, schreiben wir im Öffnungsteil nach "spoiler" einfach "=" und danach einen beliebigen Text. Man kann dort dann auch wiederum einige Tags nutzen, wie zum Beispiel den url-Tag (für Links) oder den b-Tag (für einen fetten Text). Aber dazu später.

Um unseren letzten Beispiel einen Namen zugegen machen wir also folgendes:
Code:
[spoiler=Rainbow Dash und Scootaloo][img]http://i.imgur.com/m9T3wST.png[/img][/spoiler]

Damit erhalten wir folgendes:
Zitat:
Rainbow Dash und Scootaloo (Öffnen)



2. (b2) Spoiler benennen (Teil 2)
Wie eben schon erwähnt, kann man im Namen eines Spoilers auch wiederum andere Tags nutzen.

Dies sieht dann zum Beispiel so aus:
Code:
[spoiler=[url=http://bronies.de/]Rainbow Dash und Scootaloo[/url]][img]http://i.imgur.com/m9T3wST.png[/img][/spoiler]

Damit erhalten wir dann einen Spoiler mit der Beschreibung "Rainbow Dash und Scootaloo, welche auf Bronies.de verlinkt:
Zitat:



3. Automatisierung bei deviantArt
Sehr häufig werden hier ja Bilder von deviantArt gepostet. Dabei lässt sich dass ganze Tag-Schreiben dann auch automatisieren. Genau dafür haben Anuk und ich ein Tool geschrieben. Man fügt einfach den Link des Bildes in der Textbox ein, drückt auf Enter und bizzam: Die Tags für das Bild können generiert werden.

Dieses Tool sieht derzeit (in Version 4.4) dann so aus:
Spoiler (Öffnen)


Zum Download des Tools: *klick*

Eine ausführliche Anleitung zu dem Tool findet ihr im Thread des deviantArt bbCode Creators von mir: Zum Thread

So ein bbCode erstellt der bbCode Creator dann in wenigen Teilen einer Sekunde:
Code:
[spoiler=1. [url=http://www.deviantart.com/art/Rainbow-Dash-282726939]Rainbow Dash[/url] by [url=http://UP1TER.deviantart.com]UP1TER[/url] (900 x 455 px)]
[img]http://fc02.deviantart.net/fs70/i/2012/032/d/8/rainbow_dash_by_up1ter-d4obti3.png[/img]
[/spoiler]

Ausgegeben sieht dass dann so aus:
Zitat:
1. Rainbow Dash by UP1TER (900 x 455 px) (Öffnen)

Und das ganze funktioniert dann natürlich auch bei mehreren Bildern. (Wir haben es mal mit über 1000 getestet: Hat ohne Probleme geklappt!)



Ich hoffe, es ist alles soweit gut und verständlich erklärt.
Verbesserungsvorschläge könnt ihr hier gerne posten.

Rechtschreibfehler dürft ihr wie immer gerne für euch behalten. [Bild: 01-bonemote.png]

Und nun viel Spaß beim einfachen und schnellen posten und einbetten von Bildern!



RE: Bilder einbetten einfach erklärt - DasCrazyChaos - 06.10.2013, 20:05

Eine sehr gute Erklärung,besonders geeignet für Anfänger.
Top!


RE: Bilder einbetten einfach erklärt - TheDuriel - 06.10.2013, 20:15

das größte problem ist nicht das einbetten
sondern das benutzen von schlechten hostern
zbsp jedesmal wenn jemand eine thumbnail einbettet anstelle des richtigen bildes liegts am hoster und nicht am user


RE: Bilder einbetten einfach erklärt - Shadow Pony - 09.01.2016, 18:20

Sehr nett


RE: Bilder einbetten einfach erklärt - Crash Override - 09.01.2016, 20:38

(06.10.2013)TheDuriel schrieb:  das größte problem ist nicht das einbetten
sondern das benutzen von schlechten hostern
zbsp jedesmal wenn jemand eine thumbnail einbettet anstelle des richtigen bildes liegts am hoster und nicht am user

Nicht ganz; wenn der User den falschen link wählt (nämlich den tumbnail), liegt das am User.

Das problem dabei ist doch, dass viele sich nicht richtig informieren, was wo zu finden ist - oder es beim hoster nicht immer dabei steht.

Grade bei direct-upload ist das so ein Fall; statt dass man da den Link Links oben nimmt, nehmen da die meisten den in der Mitte oben - und schon hat man den Thumbnail. sowas kann einem aber auch bei anderen hostern, z.b. abload oder tinypic passieren. Da liegt es definitiv am User. RD wink

allerdings bin ich noch am suchen nach nem gescheiten hoster, da bei mir Direct Upload ständig fehler produziert (Bild wird zwar hochgeladen, bricht aber bei denen - und der Upload war umsonst).

@ TE: is' ja nett gemacht, allerdings bevorzuge ich immernoch die Version, Bilder, spoiler, videos usw. per Hand zu Tippen (ausgenommen Bildlinks oder die URL von DA) - geht für mich gesehen schneller. außerdem weiche ich sehr ungern von der art ab, wie ich es bisher gehandhabt habe - weil es funktioniert.
Genauso die foreneigenen smilies - alle per hand während dem tippen des Posts getippt FS grins weil's schneller geht und auch in der schnellantwort so machbar ist RD wink