Šablona:Image

From thewoodcraft.org
Jump to navigation Jump to search

[edit]

Template-info.svg Dokumentace

Šablona pro vkládání obrázků s procentuálně nastavenou velikostí obrázku vůči wiki stránce.

Použití

Při použití standarní wiki syntaxe se obrázek do stránky vloží tak jak je:

[[Image:obrázek.jpg]]

Při rozmístění ilustračních obrázku vůči textu se bez dalších parametrů většinou obejít nedá. Typicky pak vypadá wiki syntaxe zhruba takto:

[[Image:obrázek.jpg|200px|right|Text v bublině k obrázku]]

Při použití šablony {{Image}} vypadá wiki syntaxe takto:

{{Image|obrázek.jpg|10|right|Text v bublině k obrázku}}
U standardní wiki syntaxe Při použití šablony
Skutečné rozměry vloženého obrázku Při nastavené velikosti se místo vloženého originálního obrázku použije vyrenderovaný náhledový obrázek, jehož rozměr je daný nastavenou šířkou náhledu v pixelech Není-li uveden atribut orig=no, použije se vždy soubor vložený do wiki v originálním rozlišení – žádný náhled se nerenderuje. Pokud je uveden, použije se místo něj náhled, jehož velikost vychází z procentuální změny šířky výchozího obrázku. Prakticky to znamená, že při nastavení zobrazení 80 se z výchozího obrázku vyrenderuje náhled, jehož šířka v pixelech odpovídá 80% šířky výchozího obrázku.
Rozměry vloženého obrázku na stránce Při změně velikosti okna prohlížeče zůstane rozměr obrázku na stránce beze změn. Při změně velikosti okna prohlížeče se dynamicky přeškálují, procentuální rozměr obrázku vůči šířce okna zůstane zachován.
Pozice vloženého obrázku na stránce Se mění v závislosti na aktuální pozici obrázku vůči obtékajícímu textu. A protože rozměry zůstávájí konstantní, může dojít k rozbití rozvržení ostatních ilustrací na stránce a případně i k přetečení obrázku ven z okna – je-li jeho rozměr větší než aktuální šířka okna prohlížeče. Díky dynamickému přeškálování se nezmění.
Natočení obrázku na stránce Nelze Lze provést o libovolný úhel nastavením parametru rotate=

Rozdíly

Jak je zřejmé z této tabulky, tkví rozdíl především v tom, jak bude vložený obrázek velký, jaké bude mít rozměry a jak pak s ním bude zacházet prohlížeč na straně klienta.

  • U jména souboru se neudává jmenný prostor – Image. Je daný šablonou, takže to vypadá jako by místo dvojtečky bylo uvedeno svislítko (ve skutečnosti oddělovač atributů)
  • Pokud obrázek ještě nebyl do wiki vložen, zobrazí se místo odkazu pro upload u šablony chybové hlášení.
  • Procentuální velikost obrázku vůči stránce se udává pouze číslem bez udání jednotek – tedy žádné %, px, atp. Pokud není hodnota platná, zobrazí se chybové hlášení včetně neplatné hodnoty atributu.
  • U šablony lze použít atribut orig=no. V takovém případě se místo vloženého obrázku použije vyrenderovaný náhled. Vyplatí se především u vložených fotografií. U černobílé kresby může vyrenderovaný a přeškálovaný obrázek působit rozmazaně.
  • Paramer pro zarovnání (center, left, right) musí být vždy uveden.
  • Šablona podporuje také atribut border=, který umožňuje změnit výchozí velikost odsazení obtékaného textu od obrázku (15px) – udává se opět pouze číslem!
  • Popis obrázku není povinný. A vkládá se jak do parametru alt, tak do parametru title. V bublině i při alternativním zobrazení se zobrazuje stejný text.

Vytvoření klikacího obrázku

Na rozdíl od standardní wiki syntaxe, tato šablona nepodporuje atribut link=. Tento problém však lze poměrně jednoduše obejít. Viz následující ukázka kódu vloženého obrázku na stránce Ladies’_Home_Journal_1902_(série_článků)[1]

[[:Image:1902-12 p003 00.png|{{Image|1902-12 p003 00.png|30|right|PHOTOGRAPH BY R. C. PENFIELD}}]]

Příklad

Upozornění U následujících screenshotů není šablona {{Image}} použita, protože by to bylo na úkor zachování informační hodnoty obrázku.

Jde o screenshoty okna webového prohlížeče Opera (v12.16 Sestavení 1860 pro Linux).

PoznámkaObrázky jsou vložené s využitím rozšíření MediaWiki EImage, které dovoluje kombinovat obrázky s komentářem, odkazy a šipkami.


image_template_01.png
Standardní wiki syntaxe
Výsledek zpracování je na
image_template_02.png


image_template_02.png
Výsledek interpretace kódu z image_template_01.png
Velikost obrázku nastavená v pixelech vede k vylití
mimo okno prohlížeče při změně jeho velikosti.


image_template_03.png
Použití šablony Image
Výsledek zpracování je na image_template_04.png


image_template_04.png
Výsledek interpretace kódu z image_template_03.png
Povšimněte si, že je umístění obrázků symetrické a
žádný nepřetéká mimo okno prohlížeče.


image_template_05.png
Při změně velikosti okna
prohlížeče, jsou obrázky
vložené přes šablonu Image
automaticky přeškálovány,
takže layout stránky zůstane
zachován i na menším
displeji.



  1. Link odkazuje na stránku s uploadovanou fotkou E.T.Setona, kterou pořídil jistý R.C.Penfield – na této stránce jsou totiž o něm další informace.