//Alice fing an sich zu langweilen; sie saß schon lange bei ihrer Schwester am Ufer und hatte nichts zu tun. Das Buch, das ihre Schwester las, gefiel ihr nicht; denn es waren weder Bilder noch Gespräche darin. „Und was nützen Bücher,“ dachte Alice, „ohne [[Bilder]] und [[Gespräche]]?“
// [[http://de.wikisource.org/wiki/Alice_im_Wunderland/Erstes_Kapitel._Hinunter_in_den_Kaninchenbau|aus Alice im Wunderland]]!

Die hier beschriebenen Beispiele verwenden den [[WikiZeichensetzung]] [[WikiCreole]], er muss in JSPWiki als nachinstalliert werden, ist jedoch Standard in der [[cciServer]] Distribution.

Evtl müssen Bilder vorher in ein Entsprechendes Format (jpg, png) umgewandelt werden, mehr dazu unter [[Bildbearbeitung]] und [[Bildformat]].

== Bild einbinden

Mit diesem Wiki-Text wird das Bild in eine Seite eingebunden
{{{
{{garten.jpg}}
}}}
Mit diesem Wiki-Text wird das Bild in eine Seite eingebunden. Das Bild wurde unter Home hochgeladen, kann aber auch mit der gleichen Bezeichnung auf einer anderen Seite eingebunden werden, ohne dass die Datei nochmal hochgeladen werden muss.
{{{
{{Home/garten.jpg}}
}}}

Mit diesem Wiki-Text wird das Bild in eine Seite eingebunden und mit Prof.Jamal bezeichnet.

{{{
{{garten.jpg|Unser Garten}}
}}}

Will man das Bild nur verlinken, kann man folgendes Verwenden

{{{
[[garten.jpg]]
}}}

[[garten.jpg]]

== Externe Bilder

Manchmal hat man keine Berechtigung, Bilder hochzuladen. Oder man möchte ein Bild nicht extra hochladen, weil es schon irgendwo im Netz existiert. Dann kann man auch auf dieses "externe" Bild verweisen, indem man die komplette URL verwendet. 

{{{
{{http://upload.wikimedia.org/wikipedia/commons/d/db/Ernst_Werner_von_Siemens.jpg}}
}}}

Man sollte dies aber nur dann tun, wen die Seite nicht so sehr stark frequentiert wird. Ansonsten "stiehlt" man Bandbreite von der Webseite des Anbieters, der diesen zusätzlichen "Traffic" bezahlen muss (Das Bild wird ja dann von seinem Server aus geladen. Für Gästebücher und Forumseinträge, bei denen man Dateien nicht selbst anhängen kann, ist das aber normalerweise ok.

== Bildgröße

Die verschiedenen Varianten von Bildgrößen werden durch S, M, L und XL festgelegt, so dass das Bild sofort in der gewünschten Form angezeigt wird, ohne dass man vorher das Bild manuell z.B. verkleinern müsste. 

* S - Small (z.B. 150 px)
* M - Medium (z.B. 450 px)
* L - Large (z.B. 1024 px)
* XL - Extra Large

Durch diesen Wiki-Text heißt das Bild "Prof.Jamal" und wird in der Bildgröße M angezeigt
{{{
{{garten.jpg|Unser Garten|M}}
}}}

{{garten.jpg|Unser Garten M|M}} {{garten.jpg|Unser Garten L|L}}

Dieses Bild wird in der Bildgröße M angezeigt. Auch wenn kein Bildname eingefügt wird, müssen zweit || zwischen dem .jpg und M gesetzt werden. 
{{{
{{garten.jpg||M}}
}}}

== Positionierung

Ein Bild rechts zu 

{{{
{{landschaft.jpg|Verstecktes Dorf (+X)|M, +X}}
}}}

{{landschaft.jpg|Verstecktes Dorf|M, +X}}

+X bestimmt die Bildausrichtung, X steht für das Bild, +/- und deren position links oder rechts vom Bild für die Positionierung des Textes. + steht dabei für Umfluss, während Minus für "kein Umfluss" steht. Man kann sich merken: + zieht an, - stößt ab...

Um ein Bild also in die Mitte ohne Umfluss zu bringen benutzen sie

{{{
{{passbild.jpg|Sopie Müller|M, -X-}}
}}}

Hier die Varianten:

{{{
+X -> Umfluss link
X+ -> Textumfluss rechts
+X+ -> Textumfluss, bild ist zentriert

-X -> Linksbündig ohne umfluss
-X- -> Zentriert ohne umfluss
}}}

== Zusammenfassung:

{{{
----------
Eine Übersicht verschiedener varianten:
-----------------
{{{
{{garten.jpg|Testbild S|S}}
{{garten.jpg|Testbild M|M}}
{{garten.jpg|Testbild L|L}}

{{garten.jpg|Testbild mittig|M, -X-}}
{{garten.jpg|Testbild rechts|M, -X}}
{{garten.jpg|Testbild links|M, X-}}
}}}
---------
So siehts aus:
------
{{garten.jpg|Testbild S|S}}
{{garten.jpg|Testbild M|M}}
{{garten.jpg|Testbild L|L}}

{{garten.jpg|Testbild mittig|M, -X-}}
{{garten.jpg|Testbild rechts|M, -X}}
{{garten.jpg|Testbild links|M, X-}}

-------
Stichworte: [[Bilder Anordnen]], [[Bilder Positionieren]], [[Bildimport]], [[Image]]