Es existieren auf dem Server bereits eine ganze Reihe an Bildern. Eine Bildergallerie kann man hier einsehen: httphttps://spielgalerie.antamar.org/galerieeu/ Wenn man dort ein passendes Bild gefunden hat, dann schaut man in der folgenden Liste nach dem passenden Dateinamen. (Da es insgesamt sehr viele Bilder sind, lässt es sich hier im Wiki leider nicht als Bildergallerie darstellen.)

|./bilder/quests/raetselpd/kreis_down200421fgsdl.jpg|[http://eisentrutz.antamar.eu/bilder/quests/raetselpd/kreis_down200421fgsdl.jpg]

|./bilder/quests/raetselpd/kreis_left201684fgsdl.jpg|[http://eisentrutz.antamar.eu/bilder/quests/raetselpd/kreis_left201684fgsdl.jpg]

|./bilder/quests/raetselpd/kreis_right205164fgsdl.jpg|[http://eisentrutz.antamar.eu/bilder/quests/raetselpd/kreis_right205164fgsdl.jpg]

|./bilder/quests/raetselpd/kreis_up214350fgsdl.jpg|[http://eisentrutz.antamar.eu/bilder/quests/raetselpd/kreis_up214350fgsdl.jpg]

|./bilder/quests/raetselpd/pergament220026fgsdl.jpg|[http://eisentrutz.antamar.eu/bilder/quests/raetselpd/pergament220026fgsdl.jpg]

|./bilder/quests/raetselpd/pfeil_down301834rg.jpg|[http://eisentrutz.antamar.eu/bilder/quests/raetselpd/pfeil_down301834rg.jpg]

|./bilder/quests/raetselpd/pfeil_left303517rgsdl.jpg|[http://eisentrutz.antamar.eu/bilder/quests/raetselpd/pfeil_left303517rgsdl.jpg]

|./bilder/quests/raetselpd/pfeil_right500034ldsdl.jpg|[http://eisentrutz.antamar.eu/bilder/quests/raetselpd/pfeil_right500034ldsdl.jpg]

|./bilder/quests/raetselpd/pfeil_up500357ldsdl.jpg|[http://eisentrutz.antamar.eu/bilder/quests/raetselpd/pfeil_up500357ldsdl.jpg]

|./bilder/quests/raetselpd/platten500421ldsdl.jpg|[http://eisentrutz.antamar.eu/bilder/quests/raetselpd/platten500421ldsdl.jpg]

|./bilder/quests/raetselpd/tropfen_down500668ldsdl.jpg|[http://eisentrutz.antamar.eu/bilder/quests/raetselpd/tropfen_down500668ldsdl.jpg]

|./bilder/quests/raetselpd/tropfen_left500958ldsdl.jpg|[http://eisentrutz.antamar.eu/bilder/quests/raetselpd/tropfen_left500958ldsdl.jpg]

|./bilder/quests/raetselpd/tropfen_right501006ldsdl.jpg|[http://eisentrutz.antamar.eu/bilder/quests/raetselpd/tropfen_right501006ldsdl.jpg]

|./bilder/quests/raetselpd/tropfen_up501039ldsdl.jpg|[http://eisentrutz.antamar.eu/bilder/quests/raetselpd/tropfen_up501039ldsdl.jpg]

|./bilder/quests/raetselpd/t_down501042ldsdl.jpg|[http://eisentrutz.antamar.eu/bilder/quests/raetselpd/t_down501042ldsdl.jpg]

|./bilder/quests/raetselpd/t_left501119ldsdl.jpg|[http://eisentrutz.antamar.eu/bilder/quests/raetselpd/t_left501119ldsdl.jpg]

|./bilder/quests/raetselpd/t_right501166ldsdl.jpg|[http://eisentrutz.antamar.eu/bilder/quests/raetselpd/t_right501166ldsdl.jpg]

|./bilder/quests/raetselpd/t_up501238ldsdl.jpg|[http://eisentrutz.antamar.eu/bilder/quests/raetselpd/t_up501238ldsdl.jpg]

|./bilder/quests/stadtplaenepd/Berenhavn%20Draft%204f501392ldsdl.JPGjpg|[http://eisentrutz.antamar.eu/bilder/quests/stadtplaenepd/Berenhavn%20Draft%204f501392ldsdl.JPGjpg]

|./bilder/quests/stadtplaenepd/Berenhavn%20Draft%204j501565ldsdl.jpg|[http://eisentrutz.antamar.eu/bilder/quests/stadtplaenepd/Berenhavn%20Draft%204j501565ldsdl.jpg]

|./bilder/quests/stadtplaenepd/Eisentrutz%20final501732ldsdl.jpg|[http://eisentrutz.antamar.eu/bilder/quests/stadtplaenepd/Eisentrutz%20final501732ldsdl.jpg]

|./bilder/quests/stadtplaenepd/Eisentrutz%20schwarz%20wei__501821ldsdl.jpg|[http://eisentrutz.antamar.eu/bilder/quests/stadtplaenepd/Eisentrutz%20schwarz%20wei__501821ldsdl.jpg]

|./bilder/quests/stadtplaenepd/Isenrhode%20village%202502335ld.jpg|[http://eisentrutz.antamar.eu/bilder/quests/stadtplaenepd/Isenrhode%20village%202502335ld.jpg]

|}-|./bilder/quests/pd/502481ldsdl.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/502481ldsdl.jpg]

Wenn der passende Pfad zum Bild herausgesucht wurde, weiß man somit die URL zum Bild, die für das Einbinden in der AOQML|-Datei wichtig ist|./bilder/quests/pd/502694ldsdl.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/502694ldsdl.jpg]

== Bild einbinden ==|-Prinzipiell werden Bilder über das <img>-HTML-Tag eingebunden|./bilder/quests/pd/502792ldsdl. Das img-Tag benötigt immer die beiden Attribute ''src'' (die URL zum Bild) und ''alt'' (ein Alternativtext, falls Bild nicht geladen werden kann) - diese Angaben sind Pflichtangaben! Darüberhinaus können weitere Attribute wie zjpg|[http://eisentrutz.Bantamar. ''title'' (Bildtitel, wenn man mit der Maus über das Bild fährt) und ''style'' (CSS-Angaben) angegeben werden (siehe folgende Beispiele)eu/bilder/quests/pd/502792ldsdl.jpg]

Man sollte bei jedem Bildeinbau bedenken, dass andere Spieler mit hoher Wahrscheinlichkeit eine andere '''Bildschirmauflösung''' haben, als man selbst, somit die Positionierung von Bild und Text "verschoben" sein können|-|./bilder/quests/pd/503392ldsdl.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/503392ldsdl.jpg]

Die einfachste Möglichkeit ein Bild einzubinden:<code xml n>|-<img src="|./bilder/quests/2_wegelagererpd/503635ldsdl.gif" alt="2 Wegelagerer" />jpg<p>Zwei garstige Gesellen stapfen vor dir auf den Weg und halten dich an|[http: <q>Geld oder Leben! Egal wie du dich entscheidest, an deine Penunzen kommen wir sowieso!</q></p><eisentrutz.antamar.eu/bilder/quests/pd/code>503635ldsdl.jpg]

|-|./bilder/quests/pd/504081ldsdl.jpg|[[Filehttp:Bild_normal//eisentrutz.antamar.eu/bilder/quests/pd/504081ldsdl.jpg|none|400px]]

Mittels ein bisschen |-|./bilder/quests/pd/505775ldsdl.jpg|[http://deeisentrutz.wikipediaantamar.orgeu/wiki/Cascading_Style_Sheets CSS] und einem Hilfscontainer (DIV-Element) kann man ein Bild zentrieren:<code xml n><div style="margin:0 auto; text-align:center;"> <img src="bilder/quests/rathaus_holzpd/505775ldsdl.jpg" title="Die Auftragsbörse" alt="Die Auftragsbörse"/></div>]

<p><q>Willkommen bei der Gruheymer Auftragsbörse!<|-|./bilder/quests/q>, steht an einem Schild an der Wand geschrieben.<pd/p><p>Die Tür ist verschlossen, doch am Schwarzen Brett hängen einige Zettel mit Aufträgen506282ldsdl.</p>jpg<p>Du überlegst, ob du dir einen Auftrag aussuchen möchtest, und kommst schließlich zu folgendem Schluss|[http:</p><p><choice target="A">Du willst dir die Aufträge ansehen/eisentrutz.antamar.<eu/choice><bilder/p><p><choice target="abbrechen">Du willst heute keinen Auftrag annehmen.<quests/choice><pd/p></code>506282ldsdl.jpg]

|-|./bilder/quests/pd/506406ldsdl.jpg|[[Filehttp:Bild_zentriert//eisentrutz.antamar.eu/bilder/quests/pd/506406ldsdl.jpg|none|400px]]

Manchmal möchte man ein Bild etwas kleiner anzeigen lassen, als es eigentlich ist|-|./bilder/quests/pd/506777ldsdl.jpg|[http://eisentrutz. Dies ist insbesondere dann der Fall, wenn man ein Bild von Text umfließen lassen möchteantamar. Mittels der CSS-Angabe ''width'' kann die Breite des anzuzeigenden Bildes festgelegt werdeneu/bilder/quests/pd/506777ldsdl. jpg]

<code xml n>|-<img src="|./bilder/quests/rathaus_holzpd/507054ldsdl.jpg" title="Die Auftragsbörse" alt="Die Auftragsbörse" style="width|[http:400px;"/>/eisentrutz.antamar.eu/bilder/quests/pd/507054ldsdl.jpg]

<p><q>Willkommen bei der Gruheymer Auftragsbörse!<|-|./bilder/quests/q>, steht an einem Schild an der Wand geschrieben.<pd/p><p>Die Tür ist verschlossen, doch am Schwarzen Brett hängen einige Zettel mit Aufträgen507056ldsdl.</p>jpg<p>Du überlegst, ob du dir einen Auftrag aussuchen möchtest, und kommst schließlich zu folgendem Schluss|[http:</p><p><choice target="A">Du willst dir die Aufträge ansehen/eisentrutz.antamar.<eu/choice><bilder/p><p><choice target="abbrechen">Du willst heute keinen Auftrag annehmen.<quests/choice><pd/p></code>507056ldsdl.jpg]

|-|./bilder/quests/pd/507057ldsdl.jpg|[[Filehttp:Bild_Breite_geaendert//eisentrutz.antamar.eu/bilder/quests/pd/507057ldsdl.jpg|none|400px]]

Alternativ kann mittels der Angabe ''height'' auch die Höhe des Bildes festgelegt werden|-|./bilder/quests/pd/507087ldsdl.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/507087ldsdl.jpg]

=== Text um Bild umfließen ===|-Mittels des sogenannten Floatings kann man Text um das Bild umfließen lassen|. Es gibt zwei Möglichkeiten/bilder/quests/pd/507179ldsdl.jpg|[http: a) Bild wird links angezeigt (Text dementsprechend rechts) oder b) Bild wird rechts angezeigt (Text entsprechend links)//eisentrutz.antamar.eu/bilder/quests/pd/507179ldsdl.jpg]

Möglichkeit a) Bild links anzeigen, Text rechts:|-<code xml n><img src="|./bilder/quests/rathaus_holzpd/507195ldsdl.jpg" title="Die Auftragsbörse" alt="Die Auftragsbörse" style="float|[http:left; width:400px; margin:0 10px 10px 0;"/>/eisentrutz.antamar.eu/bilder/quests/pd/507195ldsdl.jpg]

<p><q>Willkommen bei der Gruheymer Auftragsbörse!<|-|./bilder/quests/q>, steht an einem Schild an der Wand geschrieben.<pd/p><p>Die Tür ist verschlossen, doch am Schwarzen Brett hängen einige Zettel mit Aufträgen507361ldsdl.</p>jpg<p>Du überlegst, ob du dir einen Auftrag aussuchen möchtest, und kommst schließlich zu folgendem Schluss|[http:</p><p><choice target="A">Du willst dir die Aufträge ansehen/eisentrutz.antamar.<eu/choice><bilder/p><p><choice target="abbrechen">Du willst heute keinen Auftrag annehmen.<quests/choice><pd/p></code>507361ldsdl.jpg]

|-|./bilder/quests/pd/507362ldsdl.jpg|[[Filehttp:Bild_links//eisentrutz.antamar.eu/bilder/quests/pd/507362ldsdl.jpg|none|400px]]

Möglichkeit b) Bild rechts anzeigen, Text links:|-<code xml n><img src="|./bilder/quests/rathaus_holzpd/507557ldsdl.jpg" title="Die Auftragsbörse" alt="Die Auftragsbörse" style="float|[http:right; width:400px; margin:0 0 10px 10px;"/>/eisentrutz.antamar.eu/bilder/quests/pd/507557ldsdl.jpg]

<p><q>Willkommen bei der Gruheymer Auftragsbörse!<|-|./bilder/quests/q>, steht an einem Schild an der Wand geschrieben.<pd/p><p>Die Tür ist verschlossen, doch am Schwarzen Brett hängen einige Zettel mit Aufträgen507561ldsdl.</p>jpg<p>Du überlegst, ob du dir einen Auftrag aussuchen möchtest, und kommst schließlich zu folgendem Schluss|[http:</p><p><choice target="A">Du willst dir die Aufträge ansehen/eisentrutz.antamar.<eu/choice><bilder/p><p><choice target="abbrechen">Du willst heute keinen Auftrag annehmen.<quests/choice><pd/p></code>507561ldsdl.jpg]

|-|./bilder/quests/pd/507566ldsdl.jpg|[[Filehttp:Bild_rechts//eisentrutz.antamar.eu/bilder/quests/pd/507566ldsdl.jpg|none|400px]]

=== Abstand vom Bild ===|-|./bilder/quests/pd/507989ldsdl.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/507989ldsdl.jpg] Mittels des CSS|-Attributes ''margin'' kann der Abstand zwischen Bild und umgebenden Elementen (z|./bilder/quests/pd/508004ldsdl.jpg|[http://eisentrutz.Bantamar. Text) geregelt werdeneu/bilder/quests/pd/508004ldsdl. Für gewöhnlich muss dieses Attribut nicht separat angegeben werden, aber manchmal kann es hilfreich sein um den Text nicht so dicht an das Bild "heranrücken" zu lassenjpg] |-|. In den obigen Beispielen wurde ''margin'' teilweise verwendet, mit höheren Zahlenwerten steigt entsprechend der Abstand/bilder/quests/pd/508029ldsdl.<br>jpgDabei gilt folgende Reihenfolge|[http: oben, rechts, unten, links//eisentrutz. Also marginantamar.eu/bilder/quests/pd/508029ldsdl.jpg] |-|./bilder/quests/pd/508032ldsdl.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/508032ldsdl.jpg] |-|./bilder/quests/pd/508033ldsdl.jpg|[http:10px 20px 30px 40px; bedeutet 10 Bildpunkte Abstand nach oben, 20 nach rechts, 30 nach unten und 40 nach links und zwar vom Bild aus gesehen//eisentrutz. Das heißt, ist das Bild linksbündig angeordnet, müsste man den zweiten Wert modifizieren, um Abstand zum Text zu bekommenantamar. Ist das Bild rechtsbündig angeordnet, den vierteneu/bilder/quests/pd/508033ldsdl.jpg]

== Dungeon|-Bilder ==Für alle, die ihre eigenen Dungeons gestalten wollen: Pinsel für Gimp gibt es hier zum Download: |./bilder/quests/pd/508064ldsdl.jpg|[http://spieleisentrutz.antamar.orgeu/bilder/Gimp-Dungeon-brushes_2014quests/pd/508064ldsdl.rarjpg]

|-|./bilder/quests/pd/508124ldsdl.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/508124ldsdl.jpg] |-|./bilder/quests/pd/508125ldsdl.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/508125ldsdl.jpg] |-|./bilder/quests/pd/508169ldsdl.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/508169ldsdl.jpg] |-|./bilder/quests/pd/508170ldsdl.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/508170ldsdl.jpg] |-|./bilder/quests/pd/508170ldsdl-panorama.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/508170ldsdl-panorama.jpg] |-|./bilder/quests/pd/508182ldsdl.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/508182ldsdl.jpg] |-|./bilder/quests/pd/508185ldsdl.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/508185ldsdl.jpg] |-|./bilder/quests/pd/508243ldsdl.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/508243ldsdl.jpg] |-|./bilder/quests/pd/508310ldsdl.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/508310ldsdl.jpg] |-|./bilder/quests/pd/508337ldsdl.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/508337ldsdl.jpg] |-|./bilder/quests/pd/508350ldsdl.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/508350ldsdl.jpg] |-|./bilder/quests/pd/508351ldsdl.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/508351ldsdl.jpg] |-|./bilder/quests/pd/508373ldsdl.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/508373ldsdl.jpg] |-|./bilder/quests/pd/508397ldsdl.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/508397ldsdl.jpg] |-|./bilder/quests/pd/508411ldsdl.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/508411ldsdl.jpg] |-|./bilder/quests/pd/508480ldsdl.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/508480ldsdl.jpg] |-|./bilder/quests/pd/508574ldsdl.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/508574ldsdl.jpg] |-|./bilder/quests/pd/508476ldsdl.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/508476ldsdl.jpg] |-|./bilder/quests/pd/508589ldsdl.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/508589ldsdl.jpg] |-|./bilder/quests/pd/508598ldsdl.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/508598ldsdl.jpg] |-|./bilder/quests/pd/508609ldsdl.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/508609ldsdl.jpg] |-|./bilder/quests/pd/508621ldsdl.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/508621ldsdl.jpg] |-|./bilder/quests/pd/508633ldsdl.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/508633ldsdl.jpg] |-|./bilder/quests/pd/508634ldsdl.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/508634ldsdl.jpg] |-|./bilder/quests/pd/508640ldsdl.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/508640ldsdl.jpg] |-|./bilder/quests/pd/508641ldsdl.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/508641ldsdl.jpg] |-|./bilder/quests/pd/508707ldsdl.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/508707ldsdl.jpg] |-|./bilder/quests/pd/508722ldsdl.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/508722ldsdl.jpg] |-|./bilder/quests/pd/508727ldsdl.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/508727ldsdl.jpg] |-|./bilder/quests/pd/508823ldsdl.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/508823ldsdl.jpg] |-|./bilder/quests/pd/508843ldsdl.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/508843ldsdl.jpg] |-|./bilder/quests/pd/508891ldsdl.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/508891ldsdl.jpg] |-|./bilder/quests/pd/508892ldsdl.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/508892ldsdl.jpg] |-|./bilder/quests/pd/509033ldsdl.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/509033ldsdl.jpg] |-|./bilder/quests/pd/509054ldsdl.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/509054ldsdl.jpg] |-|./bilder/quests/pd/509069ldsdl.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/509069ldsdl.jpg] |-|./bilder/quests/pd/509072ldsdl.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/509072ldsdl.jpg] |-|./bilder/quests/pd/509079ldsdl.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/509079ldsdl.jpg] |-|./bilder/quests/pd/509127ldsdl.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/509127ldsdl.jpg] |-|./bilder/quests/pd/509146ldsdl.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/509146ldsdl.jpg] |-|./bilder/quests/pd/509186ldsdl.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/509186ldsdl.jpg] |-|./bilder/quests/pd/509212ldsdl.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/509212ldsdl.jpg] |-|./bilder/quests/pd/509226ldsdl.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/509226ldsdl.jpg] |-|./bilder/quests/pd/509234ldsdl.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/509234ldsdl.jpg] |-|./bilder/quests/pd/509292ldsdl.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/509292ldsdl.jpg] |-|./bilder/quests/pd/509304ldsdl.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/509304ldsdl.jpg] |-|./bilder/quests/pd/509421ldsdl.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/509421ldsdl.jpg] |-|./bilder/quests/pd/509457ldsdl.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/509457ldsdl.jpg] |-|./bilder/quests/pd/509473ldsdl.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/509473ldsdl.jpg] |-|./bilder/quests/pd/509616ldsdl.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/509616ldsdl.jpg] |-|./bilder/quests/pd/509762ldsdl.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/509762ldsdl.jpg] |-|./bilder/quests/pd/509913ldsdl.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/509913ldsdl.jpg] |-|./bilder/quests/pd/510020ldsdl.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/510020ldsdl.jpg] |-|./bilder/quests/pd/510146ldsdl.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/510146ldsdl.jpg] |-|./bilder/quests/pd/510371ldsdl.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/510371ldsdl.jpg] |-|./bilder/quests/pd/510398ldsdl.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/510398ldsdl.jpg] |-|./bilder/quests/pd/510519ldsdl.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/510519ldsdl.jpg] |-|./bilder/quests/pd/510650ldsdl.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/510650ldsdl.jpg] |-|./bilder/quests/pd/511242ldsdl.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/511242ldsdl.jpg] |-|./bilder/quests/pd/511267ldsdl.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/511267ldsdl.jpg] |-|./bilder/quests/pd/511402ldsdl.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/511402ldsdl.jpg] |-|./bilder/quests/pd/511433ldsdl.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/511433ldsdl.jpg] |-|./bilder/quests/pd/511444ldsdl.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/511444ldsdl.jpg] |-|./bilder/quests/pd/511690ldsdl.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/511690ldsdl.jpg] |-|./bilder/quests/pd/511794ldsdl.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/511794ldsdl.jpg] |-|./bilder/quests/pd/511802ldsdl.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/511802ldsdl.jpg] |-|./bilder/quests/pd/511821ldsdl.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/511821ldsdl.jpg] |-|./bilder/quests/pd/511854ldsdl.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/511854ldsdl.jpg] |-|./bilder/quests/pd/511871ldsdl.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/511871ldsdl.jpg] |-|./bilder/quests/pd/511922ldsdl.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/511922ldsdl.jpg] |-|./bilder/quests/pd/512041ldsdl.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/512041ldsdl.jpg] |-|./bilder/quests/pd/512138ldsdl.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/512138ldsdl.jpg] |-|./bilder/quests/pd/512617ldsdl.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/512617ldsdl.jpg] |-|./bilder/quests/pd/701630ansdl.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/701630ansdl.jpg] |-|./bilder/quests/pd/auftragsboerseCoral.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/auftragsboerseCoral.jpg] |-|./bilder/quests/pd/berge1.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/berge1.jpg] |-|./bilder/quests/pd/Berge-Fels.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/Berge-Fels.jpg] |-|./bilder/quests/pd/Berge-Fluss1.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/Berge-Fluss1.jpg] |-|./bilder/quests/pd/Bergpfad.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/Bergpfad.jpg] |-|./bilder/quests/pd/Canyon.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/Canyon.jpg] |-|./bilder/quests/pd/Fluss.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/Fluss.jpg] |-|./bilder/quests/pd/Flusstal.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/Flusstal.jpg] |-|./bilder/quests/pd/fuji1.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/fuji1.jpg] |-|./bilder/quests/pd/fuji2.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/fuji2.jpg] |-|./bilder/quests/pd/fuji3.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/fuji3.jpg] |-|./bilder/quests/pd/Gebirge.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/Gebirge.jpg] |-|./bilder/quests/pd/Gebirge2.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/Gebirge2.jpg] |-|./bilder/quests/pd/Gebirgsfluss.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/Gebirgsfluss.jpg] |-|./bilder/quests/pd/Kueste.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/Kueste.jpg] |-|./bilder/quests/pd/Moran_Feudal_Castle_z.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/Moran_Feudal_Castle_z.jpg] |-|./bilder/quests/pd/moran-thomas-the-wilds-of-lake-superior-1864.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/moran-thomas-the-wilds-of-lake-superior-1864.jpg] |-|./bilder/quests/pd/Prärie.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/Prärie.jpg] |-|./bilder/quests/pd/Salzsee.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/Salzsee.jpg] |-|./bilder/quests/pd/See.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/See.jpg] |-|./bilder/quests/pd/sumpf-see.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/sumpf-see.jpg] |-|./bilder/quests/pd/Thomas Moran - Tal-Huetten.jpeg|[http://eisentrutz.antamar.eu/bilder/quests/pd/Thomas Moran - Tal-Huetten.jpeg] |-|./bilder/quests/pd/Thomas Moran Meer.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/Thomas Moran Meer.jpg] |-|./bilder/quests/pd/Thomas Moran Slave Hunt.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/Thomas Moran Slave Hunt.jpg] |-|./bilder/quests/pd/Thomas_Moran_-_Hot_Springs_of_the_Yellowstone_-_Google_Art_Project.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/Thomas_Moran_-_Hot_Springs_of_the_Yellowstone_-_Google_Art_Project.jpg] |-|./bilder/quests/pd/Thomas_Moran_-_The_Much_Resounding_Sea.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/Thomas_Moran_-_The_Much_Resounding_Sea.jpg] |-|./bilder/quests/pd/thomas-moran-hillside.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/thomas-moran-hillside.jpg] |-|./bilder/quests/pd/Wasserfall2.jpg|[http://eisentrutz.antamar.eu/bilder/quests/pd/Wasserfall2.jpg] |-|./bilder/quests/raetsel/kreis_down.jpg|[http://eisentrutz.antamar.eu/bilder/quests/raetsel/kreis_down.jpg] |-|./bilder/quests/raetsel/kreis_left.jpg|[http://eisentrutz.antamar.eu/bilder/quests/raetsel/kreis_left.jpg] |-|./bilder/quests/raetsel/kreis_right.jpg|[http://eisentrutz.antamar.eu/bilder/quests/raetsel/kreis_right.jpg] |-|./bilder/quests/raetsel/kreis_up.jpg|[http://eisentrutz.antamar.eu/bilder/quests/raetsel/kreis_up.jpg] |-|./bilder/quests/raetsel/pergament.jpg|[http://eisentrutz.antamar.eu/bilder/quests/raetsel/pergament.jpg] |-|./bilder/quests/raetsel/pfeil_down.jpg|[http://eisentrutz.antamar.eu/bilder/quests/raetsel/pfeil_down.jpg] |-|./bilder/quests/raetsel/pfeil_left.jpg|[http://eisentrutz.antamar.eu/bilder/quests/raetsel/pfeil_left.jpg] |-|./bilder/quests/raetsel/pfeil_right.jpg|[http://eisentrutz.antamar.eu/bilder/quests/raetsel/pfeil_right.jpg] |-|./bilder/quests/raetsel/pfeil_up.jpg|[http://eisentrutz.antamar.eu/bilder/quests/raetsel/pfeil_up.jpg] |-|./bilder/quests/raetsel/platten.jpg|[http://eisentrutz.antamar.eu/bilder/quests/raetsel/platten.jpg] |-|./bilder/quests/raetsel/tropfen_down.jpg|[http://eisentrutz.antamar.eu/bilder/quests/raetsel/tropfen_down.jpg] |-|./bilder/quests/raetsel/tropfen_left.jpg|[http://eisentrutz.antamar.eu/bilder/quests/raetsel/tropfen_left.jpg] |-|./bilder/quests/raetsel/tropfen_right.jpg|[http://eisentrutz.antamar.eu/bilder/quests/raetsel/tropfen_right.jpg] |-|./bilder/quests/raetsel/tropfen_up.jpg|[http://eisentrutz.antamar.eu/bilder/quests/raetsel/tropfen_up.jpg] |-|./bilder/quests/raetsel/t_down.jpg|[http://eisentrutz.antamar.eu/bilder/quests/raetsel/t_down.jpg] |-|./bilder/quests/raetsel/t_left.jpg|[http://eisentrutz.antamar.eu/bilder/quests/raetsel/t_left.jpg] |-|./bilder/quests/raetsel/t_right.jpg|[http://eisentrutz.antamar.eu/bilder/quests/raetsel/t_right.jpg] |-|./bilder/quests/raetsel/t_up.jpg|[http://eisentrutz.antamar.eu/bilder/quests/raetsel/t_up.jpg] |-|./bilder/quests/stadtplaene/Berenhavn%20Draft%204f.JPG|[http://eisentrutz.antamar.eu/bilder/quests/stadtplaene/Berenhavn%20Draft%204f.JPG] |-|./bilder/quests/stadtplaene/Berenhavn%20Draft%204j.jpg|[http://eisentrutz.antamar.eu/bilder/quests/stadtplaene/Berenhavn%20Draft%204j.jpg] |-|./bilder/quests/stadtplaene/Eisentrutz%20final.jpg|[http://eisentrutz.antamar.eu/bilder/quests/stadtplaene/Eisentrutz%20final.jpg] |-|./bilder/quests/stadtplaene/Eisentrutz%20schwarz%20wei__.jpg|[http://eisentrutz.antamar.eu/bilder/quests/stadtplaene/Eisentrutz%20schwarz%20wei__.jpg] |-|./bilder/quests/stadtplaene/Isenrhode%20village%202.jpg|[http://eisentrutz.antamar.eu/bilder/quests/stadtplaene/Isenrhode%20village%202.jpg] |} Wenn der passende Pfad zum Bild herausgesucht wurde, weiß man somit die URL zum Bild, die für das Einbinden in der AOQML-Datei wichtig ist. == Bild einbinden ==Prinzipiell werden Bilder über das &lt;img&gt;-HTML-Tag eingebunden. Das img-Tag benötigt immer die beiden Attribute ''src'' (die URL zum Bild) und ''alt'' (ein Alternativtext, falls Bild nicht geladen werden kann) - diese Angaben sind Pflichtangaben! Darüberhinaus können weitere Attribute wie z.B. ''title'' (Bildtitel, wenn man mit der Maus über das Bild fährt) und ''style'' (CSS-Angaben) angegeben werden (siehe folgende Beispiele). Man sollte bei jedem Bildeinbau bedenken, dass andere Spieler mit hoher Wahrscheinlichkeit eine andere '''Bildschirmauflösung''' haben, als man selbst, somit die Positionierung von Bild und Text "verschoben" sein können. === Bild oberhalb vom Text positionieren === Die einfachste Möglichkeit ein Bild einzubinden:<code xml n><img src="./bilder/quests/2_wegelagerer.gif" alt="2 Wegelagerer" /><p>Zwei garstige Gesellen stapfen vor dir auf den Weg und halten dich an: <q>Geld oder Leben! Egal wie du dich entscheidest, an deine Penunzen kommen wir sowieso!</q></p></code> [[File:Bild_normal.jpg|none|400px]]  === Bild oberhalb vom Text zentrieren === Mittels ein bisschen [http://de.wikipedia.org/wiki/Cascading_Style_Sheets CSS] und einem Hilfscontainer (DIV-Element) kann man ein Bild zentrieren:<code xml n><div style="margin:0 auto; text-align:center;"> <img src="bilder/quests/rathaus_holz.jpg" title="Die Auftragsbörse" alt="Die Auftragsbörse"/></div> <p><q>Willkommen bei der Gruheymer Auftragsbörse!</q>, steht an einem Schild an der Wand geschrieben.</p><p>Die Tür ist verschlossen, doch am Schwarzen Brett hängen einige Zettel mit Aufträgen.</p><p>Du überlegst, ob du dir einen Auftrag aussuchen möchtest, und kommst schließlich zu folgendem Schluss:</p><p><choice target="A">Du willst dir die Aufträge ansehen.</choice></p><p><choice target="abbrechen">Du willst heute keinen Auftrag annehmen.</choice></p></code> [[File:Bild_zentriert.jpg|none|400px]]  === Bildgröße ändern === Manchmal möchte man ein Bild etwas kleiner anzeigen lassen, als es eigentlich ist. Dies ist insbesondere dann der Fall, wenn man ein Bild von Text umfließen lassen möchte. Mittels der CSS-Angabe ''width'' kann die Breite des anzuzeigenden Bildes festgelegt werden.  <code xml n><img src="bilder/quests/rathaus_holz.jpg" title="Die Auftragsbörse" alt="Die Auftragsbörse" style="width:400px;"/> <p><q>Willkommen bei der Gruheymer Auftragsbörse!</q>, steht an einem Schild an der Wand geschrieben.</p><p>Die Tür ist verschlossen, doch am Schwarzen Brett hängen einige Zettel mit Aufträgen.</p><p>Du überlegst, ob du dir einen Auftrag aussuchen möchtest, und kommst schließlich zu folgendem Schluss:</p><p><choice target="A">Du willst dir die Aufträge ansehen.</choice></p><p><choice target="abbrechen">Du willst heute keinen Auftrag annehmen.</choice></p></code> [[File:Bild_Breite_geaendert.jpg|none|400px]] Alternativ kann mittels der Angabe ''height'' auch die Höhe des Bildes festgelegt werden.  === Text um Bild umfließen ===Mittels des sogenannten Floatings kann man Text um das Bild umfließen lassen. Es gibt zwei Möglichkeiten: a) Bild wird links angezeigt (Text dementsprechend rechts) oder b) Bild wird rechts angezeigt (Text entsprechend links). Möglichkeit a) Bild links anzeigen, Text rechts:<code xml n><img src="bilder/quests/rathaus_holz.jpg" title="Die Auftragsbörse" alt="Die Auftragsbörse" style="float:left; width:400px; margin:0 10px 10px 0;"/> <p><q>Willkommen bei der Gruheymer Auftragsbörse!</q>, steht an einem Schild an der Wand geschrieben.</p><p>Die Tür ist verschlossen, doch am Schwarzen Brett hängen einige Zettel mit Aufträgen.</p><p>Du überlegst, ob du dir einen Auftrag aussuchen möchtest, und kommst schließlich zu folgendem Schluss:</p><p><choice target="A">Du willst dir die Aufträge ansehen.</choice></p><p><choice target="abbrechen">Du willst heute keinen Auftrag annehmen.</choice></p></code> [[File:Bild_links.jpg|none|400px]]   Möglichkeit b) Bild rechts anzeigen, Text links:<code xml n><img src="bilder/quests/rathaus_holz.jpg" title="Die Auftragsbörse" alt="Die Auftragsbörse" style="float:right; width:400px; margin:0 0 10px 10px;"/> <p><q>Willkommen bei der Gruheymer Auftragsbörse!</q>, steht an einem Schild an der Wand geschrieben.</p><p>Die Tür ist verschlossen, doch am Schwarzen Brett hängen einige Zettel mit Aufträgen.</p><p>Du überlegst, ob du dir einen Auftrag aussuchen möchtest, und kommst schließlich zu folgendem Schluss:</p><p><choice target="A">Du willst dir die Aufträge ansehen.</choice></p><p><choice target="abbrechen">Du willst heute keinen Auftrag annehmen.</choice></p></code> [[File:Bild_rechts.jpg|none|400px]]  === Abstand vom Bild ===Mittels des CSS-Attributes ''margin'' kann der Abstand zwischen Bild und umgebenden Elementen (z.B. Text) geregelt werden. Für gewöhnlich muss dieses Attribut nicht separat angegeben werden, aber manchmal kann es hilfreich sein um den Text nicht so dicht an das Bild "heranrücken" zu lassen. In den obigen Beispielen wurde ''margin'' teilweise verwendet, mit höheren Zahlenwerten steigt entsprechend der Abstand.<br>Dabei gilt folgende Reihenfolge: oben, rechts, unten, links. Also margin:10px 20px 30px 40px; bedeutet 10 Bildpunkte Abstand nach oben, 20 nach rechts, 30 nach unten und 40 nach links und zwar vom Bild aus gesehen. Das heißt, ist das Bild linksbündig angeordnet, müsste man den zweiten Wert modifizieren, um Abstand zum Text zu bekommen. Ist das Bild rechtsbündig angeordnet, den vierten. == Dungeon-Bilder ==Für alle, die ihre eigenen Dungeons gestalten wollen: Pinsel für Gimp gibt es hier zum Download: http://spiel.antamar.org/Gimp-Dungeon-brushes_2014.rar Ansonsten gilt, dass "fertige" Bilder in der Galerie zu finden sind: https://galerie.antamar.eu/ == Bilder und Testserver ==Um eine Queste mit Bildern ordentlich auf dem Testserver testen zu können, gibt es zwei Möglichkeiten: # Man legt die Bilder in das ZIP-Archiv und verwendet den Dateinamen, um auf sie zu referieren. # Man legt die Bilder bei einem externen Bilderhoster oder im Wiki ab und benutzt die vollständige URL, um auf sie zu verweisen. <code xml n><img src="rathaus_holz.jpg" title="Die Auftragsbörse" alt="Die Auftragsbörse"/><!-- Funktioniert wenn sich die rathaus_holz.jpg direkt im ZIP-Archiv auf Ebene der start.xml befindet --><img src="http://spielwiki.antamar.orgeu/images/thumb/9/99/Bild_rechts.jpg/799px-Bild_rechts.jpg"/> <!-- Funktioniert, siehe URL der Grafik oben zur Grafik rechts --><img src="Bilder/rathaus_holz.jpg"/galerie> <!-- Funktioniert nicht, selbst wenn sich die rathaus_holz.jpg im Unterordner "Bilder" im ZIP-Archiv befindet. Sobald ein Slash im Grafikverweis angegeben ist, sucht die Engine auf dem Antamarserver und nicht mehr im ZIP! --></code> [[Kategorie:AOQML]][[Kategorie:AOQML-Tags]]