Hilfe:Bilder: Unterschied zwischen den Versionen

keine Bearbeitungszusammenfassung
Keine Bearbeitungszusammenfassung
 
(10 dazwischenliegende Versionen desselben Benutzers werden nicht angezeigt)
Zeile 1: Zeile 1:
{{In Bearbeitung
|Tag= 12
|Monat = 02
|Jahr = 2023
|Zeit = 02:50
}}
Diese Seite erklärt die '''image''' Syntax beim Bearbeiten des Wikis.
Diese Seite erklärt die '''image''' Syntax beim Bearbeiten des Wikis.
Normalerweise musst du oder ein anderer Nutzer [[Special:MyLanguage/Help:Managing files|ein Bild hochladen]] bevor es auf der Seite benutzt werden kann.
Normalerweise musst du oder ein anderer Nutzer [[Special:MyLanguage/Help:Managing files|ein Bild hochladen]] bevor es auf der Seite benutzt werden kann.
Zeile 120: Zeile 113:
|-
|-
! Format !! Verkleinert !! Vergrößert
! Format !! Verkleinert !! Vergrößert
{{ {{TNTN|Help:Images/size}}|frame=}}
{{ Hilfe:Bilder/frame|frame=}}
{{ {{TNTN|Help:Images/size}}|frame=border}}
{{ Hilfe:Bilder/frame|frame=border}}
{{ {{TNTN|Help:Images/size}}|frame=frame}}
{{ Hilfe:Bilder/frame|frame=frame}}
{{ {{TNTN|Help:Images/size}}|frame=thumb}}
{{ Hilfe:Bilder/frame|frame=thumb}}
{{ {{TNTN|Help:Images/size}}|frame=frameless}}
{{ Hilfe:Bilder/frame|frame=frameless}}
|}
|}


<span id="Horizontal_alignment"></span>
<span id="Horizontal_alignment"></span>
=== Horizontale Ausrichtung ===
=== Horizontale Ausrichtung ===


Zeile 137: Zeile 131:
!Eingabe
!Eingabe
!Ergebnis
!Ergebnis
{{ {{TNTN|Help:Images/frame}}|2=100px|frame=|ex='''Keine horizontale Ausrichtung angegeben''' oder Standardausrichtung|inline=yes|float=no}}
{{ Hilfe:Bilder/frame|2=100px|frame=|ex='''Keine horizontale Ausrichtung angegeben''' oder Standardausrichtung|inline=yes|float=no}}
{{ {{TNTN|Help:Images/frame}}|2=100px|frame=none|ex=horizontale Ausrichtung angeben als: '''none'''|inline=no|float=no}}
{{ Hilfe:Bilder/frame|2=100px|frame=none|ex=horizontale Ausrichtung angeben als: '''none'''|inline=no|float=no}}
{{ {{TNTN|Help:Images/frame}}|2=100px|frame=center|ex=horizontale Ausrichtung angeben als: '''center'''|inline=no|float=no}}
{{ Hilfe:Bilder/frame|2=100px|frame=center|ex=horizontale Ausrichtung angeben als: '''center'''|inline=no|float=no}}
{{ {{TNTN|Help:Images/frame}}|2=100px|frame=left|ex=horizontale Ausrichtung angeben als: '''left'''|inline=no|float=yes}}
{{ Hilfe:Bilder/frame|2=100px|frame=left|ex=horizontale Ausrichtung angeben als: '''left'''|inline=no|float=yes}}
{{ {{TNTN|Help:Images/frame}}|2=100px|frame=right|ex=horizontale Ausrichtung angeben als: '''right'''|inline=no|float=yes}}
{{ Hilfe:Bilder/frame|2=100px|frame=right|ex=horizontale Ausrichtung angeben als: '''right'''|inline=no|float=yes}}
|}
|}


<span id="Vertical_alignment"></span>
<span id="Vertical_alignment"></span>
=== Vertikale Ausrichtung ===
=== Vertikale Ausrichtung ===
Die vertikalen Ausrichtungsoptionen wirken sich nur aus, wenn das Bild als Inline-Element '''gerendert''' wird und '''nicht''' floatet.
Die vertikalen Ausrichtungsoptionen wirken sich nur aus, wenn das Bild als Inline-Element '''gerendert''' wird und '''nicht''' floatet.
Zeile 205: Zeile 200:
<p style="border:1px solid #AAA;padding:0;font-size:150%;line-height:2">
<p style="border:1px solid #AAA;padding:0;font-size:150%;line-height:2">
<span style="background:#FFF;color:#000;text-decoration:overline"><u><del>text</del>
<span style="background:#FFF;color:#000;text-decoration:overline"><u><del>text</del>
'''top:''' [[File:Example.jpg|20px|top]] [[File:Example.jpg|40px|top]] [[File:Example.jpg|100px|top]]
'''top:''' [[File:MWExample.jpg|20px|top]] [[File:MWExample.jpg|40px|top]] [[File:MWExample.jpg|100px|top]]
<del>text</del></u></span></p>
<del>text</del></u></span></p>


<p style="border:1px solid #AAA;padding:0;font-size:150%;line-height:2">
<p style="border:1px solid #AAA;padding:0;font-size:150%;line-height:2">
<span style="background:#FFF;color:#000;text-decoration:overline"><u><del>text</del>
<span style="background:#FFF;color:#000;text-decoration:overline"><u><del>text</del>
'''text-top:''' [[File:Example.jpg|20px|text-top]] [[File:Example.jpg|40px|text-top]] [[File:Example.jpg|100px|text-top]]
'''text-top:''' [[File:MWExample.jpg|20px|text-top]] [[File:MWExample.jpg|40px|text-top]] [[File:MWExample.jpg|100px|text-top]]
<del>text</del></u></span></p>
<del>text</del></u></span></p>


<p style="border:1px solid #AAA;padding:0;font-size:150%;line-height:2">
<p style="border:1px solid #AAA;padding:0;font-size:150%;line-height:2">
<span style="background:#FFF;color:#000;text-decoration:overline"><u><del>text</del>
<span style="background:#FFF;color:#000;text-decoration:overline"><u><del>text</del>
<sup>'''super:'''</sup> [[File:Example.jpg|20px|super]] [[File:Example.jpg|40px|super]] [[File:Example.jpg|100px|super]]
<sup>'''super:'''</sup> [[File:MWExample.jpg|20px|super]] [[File:MWExample.jpg|40px|super]] [[File:MWExample.jpg|100px|super]]
<del>text</del></u></span></p>
<del>text</del></u></span></p>


<p style="border:1px solid #AAA;padding:0;font-size:150%;line-height:2">
<p style="border:1px solid #AAA;padding:0;font-size:150%;line-height:2">
<span style="background:#FFF;color:#000;text-decoration:overline"><u><del>text</del>
<span style="background:#FFF;color:#000;text-decoration:overline"><u><del>text</del>
'''baseline:''' [[File:Example.jpg|20px|baseline]] [[File:Example.jpg|40px|baseline]] [[File:Example.jpg|100px|baseline]]
'''baseline:''' [[File:MWExample.jpg|20px|baseline]] [[File:MWExample.jpg|40px|baseline]] [[File:MWExample.jpg|100px|baseline]]
<del>text</del></u></span></p>
<del>text</del></u></span></p>


<p style="border:1px solid #AAA;padding:0;font-size:150%;line-height:2">
<p style="border:1px solid #AAA;padding:0;font-size:150%;line-height:2">
<span style="background:#FFF;color:#000;text-decoration:overline"><u><del>text</del>
<span style="background:#FFF;color:#000;text-decoration:overline"><u><del>text</del>
<sub>'''sub:'''</sub> [[File:Example.jpg|20px|sub]] [[File:Example.jpg|40px|sub]] [[File:Example.jpg|100px|sub]]
<sub>'''sub:'''</sub> [[File:MWExample.jpg|20px|sub]] [[File:MWExample.jpg|40px|sub]] [[File:MWExample.jpg|100px|sub]]
<del>text</del></u></span></p>
<del>text</del></u></span></p>


<p style="border:1px solid #AAA;padding:0;font-size:150%;line-height:2">
<p style="border:1px solid #AAA;padding:0;font-size:150%;line-height:2">
<span style="background:#FFF;color:#000;text-decoration:overline"><u><del>text</del>
<span style="background:#FFF;color:#000;text-decoration:overline"><u><del>text</del>
'''default:''' [[File:Example.jpg|20px]] [[File:Example.jpg|40px]] [[File:Example.jpg|100px]]
'''default:''' [[File:MWExample.jpg|20px]] [[File:MWExample.jpg|40px]] [[File:MWExample.jpg|100px]]
<del>text</del></u></span></p>
<del>text</del></u></span></p>


<p style="border:1px solid #AAA;padding:0;font-size:150%;line-height:2">
<p style="border:1px solid #AAA;padding:0;font-size:150%;line-height:2">
<span style="background:#FFF;color:#000;text-decoration:overline"><u><del>text</del>
<span style="background:#FFF;color:#000;text-decoration:overline"><u><del>text</del>
'''middle:''' [[File:Example.jpg|20px|middle]] [[File:Example.jpg|40px|middle]] [[File:Example.jpg|100px|middle]]
'''middle:''' [[File:MWExample.jpg|20px|middle]] [[File:MWExample.jpg|40px|middle]] [[File:MWExample.jpg|100px|middle]]
<del>text</del></u></span></p>
<del>text</del></u></span></p>


<p style="border:1px solid #AAA;padding:0;font-size:150%;line-height:2">
<p style="border:1px solid #AAA;padding:0;font-size:150%;line-height:2">
<span style="background:#FFF;color:#000;text-decoration:overline"><u><del>text</del>
<span style="background:#FFF;color:#000;text-decoration:overline"><u><del>text</del>
'''text-bottom:''' [[File:Example.jpg|20px|text-bottom]] [[File:Example.jpg|40px|text-bottom]] [[File:Example.jpg|100px|text-bottom]]
'''text-bottom:''' [[File:MWExample.jpg|20px|text-bottom]] [[File:MWExample.jpg|40px|text-bottom]] [[File:MWExample.jpg|100px|text-bottom]]
<del>text</del></u></span></p>
<del>text</del></u></span></p>


<p style="border:1px solid #AAA;padding:0;font-size:150%;line-height:2">
<p style="border:1px solid #AAA;padding:0;font-size:150%;line-height:2">
<span style="background:#FFF;color:#000;text-decoration:overline"><u><del>text</del>
<span style="background:#FFF;color:#000;text-decoration:overline"><u><del>text</del>
'''bottom:''' [[File:Example.jpg|20px|bottom]] [[File:Example.jpg|40px|bottom]] [[File:Example.jpg|100px|bottom]]
'''bottom:''' [[File:MWExample.jpg|20px|bottom]] [[File:MWExample.jpg|40px|bottom]] [[File:MWExample.jpg|100px|bottom]]
<del>text</del></u></span></p>
<del>text</del></u></span></p>


Zeile 259: Zeile 254:


<span id="Stopping_the_text_flow"></span>
<span id="Stopping_the_text_flow"></span>
=== Textfluss stoppen ===
=== Textfluss stoppen ===
Gelegentlich ist es wünschenswert, zu verhindern, dass Text (oder andere nicht floatende Inline-Bilder) um ein floatendes Bild herumfließen.
Gelegentlich ist es wünschenswert, zu verhindern, dass Text (oder andere nicht floatende Inline-Bilder) um ein floatendes Bild herumfließen.
Zeile 278: Zeile 274:
!Du schreibst
!Du schreibst
!Du erhältst
!Du erhältst
{{ {{TNTN|Help:Images/frame}}|2=link=Main Page|ex=Interner Verweis (link)}}
{{ Hilfe:Bilder/frame|2=link=Main Page|ex=Interner Verweis (link)}}
{{ {{TNTN|Help:Images/frame}}|2=link=http://wikipedia.org/wiki/Test|ex=Externer Link}}
{{ Hilfe:Bilder/frame|2=link=https://skandinavien-wiki.net/wiki/Test|ex=Externer Link}}
{{ {{TNTN|Help:Images/frame}}|2=link=|ex=kein Link (externe oder Dateiseite)}}
{{ Hilfe:Bilder/frame|2=link=|ex=kein Link (externe oder Dateiseite)}}
|}
|}
<span id="Rendering_a_gallery_of_images"></span>


'''Warnung::'''
: Aufgrund der Lizenzanforderungen in Deinem Wiki kannst Du möglicherweise nicht alle Links zu der Beschreibungsseite entfernen, auf der die erforderlichen Autorenangaben, die Urheberrechtserklärungen, die geltenden Lizenzbestimmungen oder eine vollständigere Beschreibung des gerenderten Bildes (einschließlich des Änderungsverlaufs) angezeigt werden.
: Wenn Du den Ziellink eines Bildes änderst oder entfernst, musst Du an einer anderen Stelle auf Deiner Seite einen expliziten Link zu dieser Beschreibungsseite bereitstellen oder die Urheberrechts- und Autorenangabe sowie gegebenenfalls einen Link zur entsprechenden Lizenz anzeigen, falls sie sich von den Elementen unterscheiden, die für die Einbettungsseite selbst gelten.
: Möglicherweise schränkt Deine Wiki-Richtlinie die Verwendung des alternativen Link-Parameters ein oder erzwingt sogar ein Verbot alternativer Link-Parameter für eingebettete Mediendateien (in diesem Fall wird der Link-Parameter ignoriert) oder akzeptiert sie erst nach Überprüfung durch autorisierte Benutzer oder Administratoren.
<span id="Rendering_a_gallery_of_images"></span>
== Anzeigen einer Bildergalerie ==
== Anzeigen einer Bildergalerie ==


Zeile 306: Zeile 297:


Bildunterschriften sind optional und können Wiki-Links oder andere Formatierungen enthalten.
Bildunterschriften sind optional und können Wiki-Links oder andere Formatierungen enthalten.
{{note|1=<span class="mw-translate-fuzzy">Die Wörter "center", "left" und "right", die als Beschriftungen verwendet werden, verursachen falsch-positive Linter-Fehler. Siehe {{phab|T266406}} für Details.</span> <span lang="en" dir="ltr" class="mw-content-ltr">See {{phab|T275074}} for details.</span>}}
{{note|1=Die Wörter "center", "left" und "right", die als Beschriftungen verwendet werden, verursachen falsch-positive Linter-Fehler. Siehe {{phab|T266406}} für Details.See {{phab|T275074}} for details.}}
Einige der Parameter, die die Ausgabe der Vorschaubilder steuern, können auch hier verwendet werden, insbesondere diejenigen, die die Datei ändern (im Gegensatz zu denen, die steuern, wo auf der Seite das Bild abgelegt wird).
Einige der Parameter, die die Ausgabe der Vorschaubilder steuern, können auch hier verwendet werden, insbesondere diejenigen, die die Datei ändern (im Gegensatz zu denen, die steuern, wo auf der Seite das Bild abgelegt wird).
Bei mehrseitigen Medien wie pdfs kannst Du beispielsweise Code wie <code>page=4</code> verwenden.
Bei mehrseitigen Medien wie pdfs kannst Du beispielsweise Code wie <code>page=4</code> verwenden.
Zeile 317: Zeile 308:
<syntaxhighlight lang="moin">
<syntaxhighlight lang="moin">
<gallery>
<gallery>
File:Example.jpg|Item 1
File:MWExample.jpg|Item 1
File:Example.jpg|a link to [[Help:Contents]]
File:MWExample.jpg|a link to [[Help:Contents]]
File:Example.jpg
File:MWExample.jpg
File:Example.jpg|alt=An example image. It has flowers
File:MWExample.jpg|alt=An example image. It has flowers
File:Example.jpg|''italic caption''
File:MWExample.jpg|''italic caption''
File:Example.jpg|Links to external website|link=https://example.com
File:MWExample.jpg|Links to external website|link=https://example.com
File:Example.jpg|link=w:Main_Page|Internal link
File:MWExample.jpg|link=w:Main_Page|Internal link
Example.jpg|on page "{{PAGENAME}}"
MWExample.jpg|on page "{{PAGENAME}}"
File:Using Firefox.pdf|page=72
File:Using Firefox.pdf|page=72
</gallery>
</gallery>
Zeile 332: Zeile 323:


<gallery>
<gallery>
File:Example.jpg|Item 1
File:MWExample.jpg|Item 1
File:Example.jpg|a link to [[Help:Contents]]
File:MWExample.jpg|a link to [[Help:Contents]]
File:Example.jpg
File:MWExample.jpg
File:Example.jpg|alt=An example image. It has flowers
File:MWExample.jpg|alt=An example image. It has flowers
File:Example.jpg|''italic caption''
File:MWExample.jpg|''italic caption''
File:Example.jpg|Links to external website|link=https://example.com
File:MWExample.jpg|Links to external website|link=https://example.com
File:Example.jpg|link=w:Main_Page|Internal link
File:MWExample.jpg|link=w:Main_Page|Internal link
Example.jpg|on page "{{PAGENAME}}"
MWExample.jpg|on page "{{PAGENAME}}"
File:Using Firefox.pdf|page=72
File:Using Firefox.pdf|page=72
</gallery>
</gallery>
Zeile 345: Zeile 336:
<span id="mode_parameter"></span>
<span id="mode_parameter"></span>
==== mode-Parameter ====
==== mode-Parameter ====
{{MW 1.22|and after}}
Ab Version 1.22 ist ein <code>mode</code>-Parameter verfügbar, der über folgende Optionen verfügt:
* <code>traditional</code> ist der Orginal-Galerietyp, der von MediaWiki verwendet wird.
* <code>traditional</code> ist der Orginal-Galerietyp, der von MediaWiki verwendet wird.
* <code>nolines</code> ähnelt <code>traditional</code>, hat jedoch keine Begrenzungslinien.
* <code>nolines</code> ähnelt <code>traditional</code>, hat jedoch keine Begrenzungslinien.
* <code>packed</code> bewirkt, dass Bilder dieselbe Höhe, aber unterschiedliche Breiten haben, wobei zwischen den Bildern nur wenig Platz gelassen wird. Die Zeilen in diesem [[w: Responsive Web Design|responsive]] Modus ordnen sich nach der Breite des Bildschirms.
* <code>packed</code> bewirkt, dass Bilder dieselbe Höhe, aber unterschiedliche Breiten haben, wobei zwischen den Bildern nur wenig Platz gelassen wird. Die Zeilen in diesem responsive Modus ordnen sich nach der Breite des Bildschirms.
* <code>packed-overlay</code> zeigt die dem Bild überlagerte Beschriftung in einem halbtransparenten weißen Feld.
* <code>packed-overlay</code> zeigt die dem Bild überlagerte Beschriftung in einem halbtransparenten weißen Feld.
* <code>packed-hover</code> ähnelt <code>packed-overlay</code>, nur dass die Beschriftung und das Kästchen nur beim Mouse-over angezeigt werden.
* <code>packed-hover</code> ähnelt <code>packed-overlay</code>, nur dass die Beschriftung und das Kästchen nur beim Mouse-over angezeigt werden.
Zeile 432: Zeile 420:
</gallery>
</gallery>


{{MW 1.28|and after}}
<code id="slideshow-demo">mode="slideshow"</code>
<code id="slideshow-demo">mode="slideshow"</code>
<gallery mode="slideshow">
<gallery mode="slideshow">
Zeile 463: Zeile 450:


* <code>caption="{caption}"</code>: (Beschriftungstext zwischen Anführungszeichen für mehr als ein Wort) legt eine Beschriftung fest, die über der Galerie zentriert wird. In der Beschriftung darf nur einfacher Text verwendet werden. Formatierungen, Vorlagen und ähnliches funktionieren nicht.
* <code>caption="{caption}"</code>: (Beschriftungstext zwischen Anführungszeichen für mehr als ein Wort) legt eine Beschriftung fest, die über der Galerie zentriert wird. In der Beschriftung darf nur einfacher Text verwendet werden. Formatierungen, Vorlagen und ähnliches funktionieren nicht.
* <code>widths={width}px</code>: Legt die (maximale) Breite der Bilder fest. Der [[Special:MyLanguage/Manual:$wgGalleryOptions|Standardwert]] ist 120px. ''Beachte den Plural: width'''s'''''.
* <code>widths={width}px</code>: Legt die (maximale) Breite der Bilder fest. Der Standardwert ist 120px. ''Beachte den Plural: width'''s'''''.
* <code>heights={heights}px</code>: Legt die (maximale) Höhe der Bilder fest. Der Standardwert ist 120px.
* <code>heights={heights}px</code>: Legt die (maximale) Höhe der Bilder fest. Der Standardwert ist 120px.
* <code>perrow={integer}</code>: bestimmt die Anzahl der Bilder pro Reihe. 0 bedeutet, dass die Einstellung automatisch an die Bildschirmbreite angepasst wird.
* <code>perrow={integer}</code>: bestimmt die Anzahl der Bilder pro Reihe. 0 bedeutet, dass die Einstellung automatisch an die Bildschirmbreite angepasst wird.
* <code>showfilename={anything}</code>: Zeigt die Dateinamen der Bilder in den einzelnen Bildunterschriften für jedes Bild an (1.17+).
* <code>showfilename={anything}</code>: Zeigt die Dateinamen der Bilder in den einzelnen Bildunterschriften für jedes Bild an (1.17+).
* <code>mode={traditional|nolines|packed|packed-hover|packed-overlay|slideshow}</code>: Siehe oben (1.22+; 1.28+ für "slideshow").
* <code>mode={traditional|nolines|packed|packed-hover|packed-overlay|slideshow}</code>: Siehe oben ("slideshow").
* <code>showthumbnails</code>: Zeigt im "Diashow" -Modus standardmäßig den Streifen mit den Miniaturbildern unter der Diashow an (1.29+).
* <code>showthumbnails</code>: Zeigt im "Diashow" -Modus standardmäßig den Streifen mit den Miniaturbildern unter der Diashow  


{{note|1=Die Parameter widths und heights dienen eher als Vorschläge denn als strikte Werte für "packed" (und verwandte) Modi. Die "packed modes" passen die Breite der Bilder an, damit jede Zeile dieselbe Länge hat.}}
{{note|1=Die Parameter widths und heights dienen eher als Vorschläge denn als strikte Werte für "packed" (und verwandte) Modi. Die "packed modes" passen die Breite der Bilder an, damit jede Zeile dieselbe Länge hat.}}
Zeile 478: Zeile 465:
<syntaxhighlight lang=html>
<syntaxhighlight lang=html>
<gallery widths=300px heights=200px>
<gallery widths=300px heights=200px>
File:Example.jpg|Lorem ipsum
File:MWExample.jpg|Lorem ipsum
File:Example.jpg|Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut
File:MWExample.jpg|Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut
</gallery>
</gallery>
</syntaxhighlight>
</syntaxhighlight>
Zeile 486: Zeile 473:


<gallery widths="300px" heights="200px">
<gallery widths="300px" heights="200px">
File:Example.jpg|Lorem ipsum
File:MWExample.jpg|Lorem ipsum
File:Example.jpg|Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut
File:MWExample.jpg|Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut
</gallery>
</gallery>


Zeile 496: Zeile 483:
<syntaxhighlight lang=html>
<syntaxhighlight lang=html>
<gallery widths=60px heights=60px perrow=7 caption="sunflowers are groovy">
<gallery widths=60px heights=60px perrow=7 caption="sunflowers are groovy">
File:Example.jpg
File:MWExample.jpg
File:Example.jpg
File:MWExample.jpg
File:Example.jpg
File:MWExample.jpg
File:Example.jpg
File:MWExample.jpg
File:Example.jpg
File:MWExample.jpg
File:Example.jpg
File:MWExample.jpg
File:Example.jpg
File:MWExample.jpg
File:Example.jpg
File:MWExample.jpg
File:Example.jpg
File:MWExample.jpg
File:Example.jpg
File:MWExample.jpg
</gallery>
</gallery>
</syntaxhighlight>
</syntaxhighlight>
Zeile 512: Zeile 499:


<gallery widths="60px" heights="60px" perrow="7" caption="sunflowers are groovy">
<gallery widths="60px" heights="60px" perrow="7" caption="sunflowers are groovy">
File:Example.jpg
File:MWExample.jpg
File:Example.jpg
File:MWExample.jpg
File:Example.jpg
File:MWExample.jpg
File:Example.jpg
File:MWExample.jpg
File:Example.jpg
File:MWExample.jpg
File:Example.jpg
File:MWExample.jpg
File:Example.jpg
File:MWExample.jpg
File:Example.jpg
File:MWExample.jpg
File:Example.jpg
File:MWExample.jpg
File:Example.jpg
File:MWExample.jpg
</gallery>
</gallery>


<span id="Row_of_images_that_will_wrap_to_browser_width"></span>
<span id="Row_of_images_that_will_wrap_to_browser_width"></span>
== Reihe von Bildern, die auf die Browserbreite angepasst wird ==
== Reihe von Bildern, die auf die Browserbreite angepasst wird ==
Eine Möglichkeit, die für eine Reihe von Bildern mit unterschiedlichen Breiten funktioniert, besteht darin, nicht "Vorschaubilder" oder "Seitenangabe links" oder "keine" zu verwenden.
Eine Möglichkeit, die für eine Reihe von Bildern mit unterschiedlichen Breiten funktioniert, besteht darin, nicht "Vorschaubilder" oder "Seitenangabe links" oder "keine" zu verwenden.
Zeile 541: Zeile 529:
</pre>
</pre>


[[File:Example.jpg|220px]]
[[File:MWExample.jpg|220px]]
[[File:Example.jpg|100px]]
[[File:MWExample.jpg|100px]]
[[File:Example.jpg|150px]]
[[File:MWExample.jpg|150px]]
[[File:Example.jpg|250px]]
[[File:MWExample.jpg|250px]]
[[File:Example.jpg|200px]]
[[File:MWExample.jpg|200px]]
[[File:Example.jpg|50px]]
[[File:MWExample.jpg|50px]]
[[File:Example.jpg|220px]]
[[File:MWExample.jpg|220px]]
[[File:Example.jpg|175px]]
[[File:MWExample.jpg|175px]]


'''Um Bilder unterschiedlicher Breite mit Beschriftungen zu versehen,''' ist es erforderlich, div HTML für eine ungeordnete Liste zu verwenden. Zusammen mit <code>style="display: inline-block;"</code>. Weitere Informationen und Anregungen findest Du unter: [http://www.sitepoint.com/give-floats-the-flick-in-css-layouts Geben Sie Floats den Flick in CSS-Layouts].
'''Um Bilder unterschiedlicher Breite mit Beschriftungen zu versehen,''' ist es erforderlich, div HTML für eine ungeordnete Liste zu verwenden. Zusammen mit <code>style="display: inline-block;"</code>. Weitere Informationen und Anregungen findest Du unter: [http://www.sitepoint.com/give-floats-the-flick-in-css-layouts Geben Sie Floats den Flick in CSS-Layouts].
Zeile 566: Zeile 554:


<div><ul>  
<div><ul>  
<li style="display: inline-block;"> [[File:Example.jpg|thumb|none|220px|Caption 1]] </li>
<li style="display: inline-block;"> [[File:MWExample.jpg|thumb|none|220px|Caption 1]] </li>
<li style="display: inline-block;"> [[File:Example.jpg|thumb|none|100px|Caption 2]] </li>
<li style="display: inline-block;"> [[File:MWExample.jpg|thumb|none|100px|Caption 2]] </li>
<li style="display: inline-block;"> [[File:Example.jpg|thumb|none|150px|Caption 3]] </li>
<li style="display: inline-block;"> [[File:MWExample.jpg|thumb|none|150px|Caption 3]] </li>
<li style="display: inline-block;"> [[File:Example.jpg|thumb|none|250px|Caption 4]] </li>
<li style="display: inline-block;"> [[File:MWExample.jpg|thumb|none|250px|Caption 4]] </li>
<li style="display: inline-block;"> [[File:Example.jpg|thumb|none|200px|Caption 5]] </li>
<li style="display: inline-block;"> [[File:MWExample.jpg|thumb|none|200px|Caption 5]] </li>
<li style="display: inline-block;"> [[File:Example.jpg|thumb|none|50px|Caption 6]] </li>
<li style="display: inline-block;"> [[File:MWExample.jpg|thumb|none|50px|Caption 6]] </li>
<li style="display: inline-block;"> [[File:Example.jpg|thumb|none|220px|Caption 7]] </li>
<li style="display: inline-block;"> [[File:MWExample.jpg|thumb|none|220px|Caption 7]] </li>
<li style="display: inline-block;"> [[File:Example.jpg|thumb|none|175px|Caption 8]] </li>
<li style="display: inline-block;"> [[File:MWExample.jpg|thumb|none|175px|Caption 8]] </li>
</ul></div>
</ul></div>


Zeile 592: Zeile 580:


<div><ul>  
<div><ul>  
<li style="display: inline-block; vertical-align: top;"> [[File:Example.jpg|thumb|none|220px|Caption 1]] </li>
<li style="display: inline-block; vertical-align: top;"> [[File:MWExample.jpg|thumb|none|220px|Caption 1]] </li>
<li style="display: inline-block; vertical-align: top;"> [[File:Example.jpg|thumb|none|100px|Caption 2]] </li>
<li style="display: inline-block; vertical-align: top;"> [[File:MWExample.jpg|thumb|none|100px|Caption 2]] </li>
<li style="display: inline-block; vertical-align: top;"> [[File:Example.jpg|thumb|none|150px|Caption 3]] </li>
<li style="display: inline-block; vertical-align: top;"> [[File:MWExample.jpg|thumb|none|150px|Caption 3]] </li>
<li style="display: inline-block; vertical-align: top;"> [[File:Example.jpg|thumb|none|250px|Caption 4]] </li>
<li style="display: inline-block; vertical-align: top;"> [[File:MWExample.jpg|thumb|none|250px|Caption 4]] </li>
<li style="display: inline-block; vertical-align: top;"> [[File:Example.jpg|thumb|none|200px|Caption 5]] </li>
<li style="display: inline-block; vertical-align: top;"> [[File:MWExample.jpg|thumb|none|200px|Caption 5]] </li>
<li style="display: inline-block; vertical-align: top;"> [[File:Example.jpg|thumb|none|50px|Caption 6]] </li>
<li style="display: inline-block; vertical-align: top;"> [[File:MWExample.jpg|thumb|none|50px|Caption 6]] </li>
<li style="display: inline-block; vertical-align: top;"> [[File:Example.jpg|thumb|none|220px|Caption 7]] </li>
<li style="display: inline-block; vertical-align: top;"> [[File:MWExample.jpg|thumb|none|220px|Caption 7]] </li>
<li style="display: inline-block; vertical-align: top;"> [[File:Example.jpg|thumb|none|175px|Caption 8]] </li>
<li style="display: inline-block; vertical-align: top;"> [[File:MWExample.jpg|thumb|none|175px|Caption 8]] </li>
</ul></div>
</ul></div>


Zeile 612: Zeile 600:


<span id="Link_behavior"></span>
<span id="Link_behavior"></span>
== Verhalten von Links ==
== Verhalten von Links ==
Standardmäßig verlinkt ein Bild auf seine Dateibeschreibungsseite.
Standardmäßig verlinkt ein Bild auf seine Dateibeschreibungsseite.
Die Option "link=" ändert dieses Verhalten, um eine Verknüpfung zu einer anderen Seite oder Website herzustellen oder das Verknüpfungsverhalten des Bildes zu deaktivieren.
Die Option "link=" ändert dieses Verhalten, um eine Verknüpfung zu einer anderen Seite oder Website herzustellen oder das Verknüpfungsverhalten des Bildes zu deaktivieren. Alternativ kannst Du einen Textlink zu einer Dateibeschreibungsseite oder zur Datei selbst erstellen.


Alternativ kannst Du einen Textlink zu einer Dateibeschreibungsseite oder zur Datei selbst erstellen.
Siehe {{ll|Help:Linking to files}}.


<span id="Display_image,_link_it_to_another_page_or_website"></span>
<span id="Display_image,_link_it_to_another_page_or_website"></span>
Zeile 691: Zeile 678:
====Abrufen der vollständigen URL eines Bildes====
====Abrufen der vollständigen URL eines Bildes====


Um den vollständigen Pfad eines Bildes zu erhalten (ohne Weiterleitungen zu durchlaufen, wie oben gezeigt), können einige {{ll|Help:magic words|nsp=0}} verwendet werden.
Um den vollständigen Pfad eines Bildes zu erhalten (ohne Weiterleitungen zu durchlaufen, wie oben gezeigt), können einige [[Help:Magische Wörter|nsp=0}} verwendet werden.


  <nowiki>{{filepath:MediaWiki-2020-logo.svg}}</nowiki>
  <nowiki>{{filepath:MediaWiki-2020-logo.svg}}</nowiki>
Zeile 708: Zeile 695:


<span id="Requisites"></span>
<span id="Requisites"></span>
== Voraussetzungen ==
Bevor Bilder im Wiki benutzt werden können, muss ein Wiki-Admin das [[Special:MyLanguage/Manual:Configuring file uploads|Hochladen von Dateien]] freigeschaltet haben. Außerdem muss der Benutzer [[Special:MyLanguage/Help:Managing files|Dateien hochgeladen haben]].
Die Systemadministratoren können auch Dateien [[Special:MyLanguage/Manual:Image Administration#Foreign Repositories|anderer Quellen]] wie [Special:MyLanguage/Manual:Image Administration#Foreign Repositories Wikimedia Commons] zulassen.
Es ist notwendig, einen Bildskalierer (z.B. GD2, ImageMagick) für das Wiki zu installieren, falls die Bilder in verschiedenen Größen angezeigt werden sollen.


<span id="Files_at_other_websites"></span>
== Dateien anderer Webseiten ==  
== Dateien anderer Webseiten ==  
Du kannst mit derselben Syntax, die für das Verknüpfen mit einer externen Webseite verwendet wird, auf eine online verfügbare externe Datei verweisen.
Du kannst mit derselben Syntax, die für das Verknüpfen mit einer externen Webseite verwendet wird, auf eine online verfügbare externe Datei verweisen.
Zeile 724: Zeile 706:
<pre>[http://url.for/some/image.png verlinke den Text hier]</pre>
<pre>[http://url.for/some/image.png verlinke den Text hier]</pre>


Zusätzliches MediaWiki-Markup oder HTML / CSS-Formatierung (für Inline-Elemente) ist in diesem angezeigten Text zulässig (mit Ausnahme eingebetteter Links, die den umgebenden Link beschädigen würden):
<span id="See_also"></span>


<pre>[http://www.example.com/some/image.png Beispiel '''<del>rich</del>''' ''<ins>link-text</ins>'' hier.]</pre>
was wiedergegeben wird als: [http://www.example.com/some/image.png Beispiel '''<del>rich</del>''' ''<ins>link-text</ins>'' hier.]
Wenn es in Deinem Wiki aktiviert ist (siehe {{ll|Manual:$wgAllowExternalImages}}), kannst Du auch externe Bilder einbetten. Füge dazu einfach die URL des Bildes ein:
<pre>http://url.for/some/image.png</pre>
Derzeit können eingebettete Bilder nicht in der Größe verändert werden, sie können jedoch durch umgebendes MediaWiki-Markup oder HTML/CSS-Code formatiert werden.
Wenn diese Wiki-Option nicht aktiviert ist, wird das Bild nicht eingebettet, sondern wie oben als Textlink zur externen Site angezeigt.
<span id="See_also"></span>
== Siehe auch ==
== Siehe auch ==


*[[w:Wikipedia:Extended image syntax|Wikipedia:Erweiterter Bild-Syntax]]
*[[wikipedia:Wikipedia:Erweiterter Bild-Syntax|Wikipedia:Erweiterter Bild-Syntax]]
*[[w:Category:Wikipedia image help|Kategorie:Wikipedia Bilder Hilfe]]
*[[wikipedia:Kategorie:Wikipedia Bilder Hilfe|Kategorie:Wikipedia Bilder Hilfe]]
*[[w:de:Hilfe:Bilder|Hilfe:Bilder]]
*[[wikipedia:Hilfe:Bilder|Hilfe:Bilder]]
*[[w:de:Hilfe:Galerie|Hilfe:Galerie]]
*[[wikipedia:Hilfe:Galerie|Hilfe:Galerie]]
*{{ll|Manual:Adding support for new filetypes}}
*[[Phabricator:T113101]] - responsive Eigenschaften
*[[phab:T113101]] - responsive Eigenschaften
* <span lang="en" dir="ltr" class="mw-content-ltr">[[Special:MyLanguage/Extension:PageImages#Can I exclude certain page images?|Extension:PageImages#Can I exclude certain page images?]]</span>


[[Kategorie:Hilfe|{{PAGENAME}}]]
[[Kategorie:Hilfe|{{PAGENAME}}]]{{IstIn|Übersicht}}