Šablona:Image
[editovat]
Dokumentace
Šablona pro vkládání obrázků s procentuálně nastavenou velikostí obrázku vůči wiki stránce.
Použití
{{I-size}}
, která usnadňuje editaci atributů při jejich dělení a škálování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}}
Atributy
Základní parametry této šablony jsou fixně dané:
- jméno použitého souboru
- procentuální nastavení velikosti – 100 >= 1 (jednotka se neudává)
- zarovnání obrázku musí být uvedeno!
- popis obrázku (nemusí být uveden, ale oddělovač chybět nesmí!)
Velice pěkný příklad obrázku, u kterého jsou využity všechny parametry šablony, můžete najít na stránce 15, knihy Bronisława Boufałła Boy scouts: Indyanizm w wychowaniu, 1912 (księga). Viz ukázka vloženého kódu:
{{Image|boufall.djvu
|page=15
|width=800
|crop=-85 -200 470 260
|rotate=0.5
|80|center|Rozpalenie ogniska obozowego}}
A jeho interpretace na stránce:
- page
- Číslo stránky generované z DjVu či PDF souboru.
- width
- Výchozí šířka náhledu, vůči níž se počítají parametry pro výřez (v pixelech).
- border
- Odsazení obrázku (v pixelech).
- crop
- Parametry výřezu (v pixelech), oddělené mezerou X Y W H. Hodnotou X a Y musí být buď nula, nebo záporné číslo.
- rotate
- Natočení obrázku (v radiánech), kterým lze zkorigovat nežádoucí pootočení stránky v originálu.
- resize
- Přeškálování výřezu před odesláním webovému prohlížeči. Přeškálováním lze výřez přizpůsobit tak, aby jeho procentuálním roztažením na straně prohlížeče nedocházelo k další degradaci kvality škálovaného výřezu.
Rozdíly
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 width , použije se originál obrázku, ve stejném rozlišení, jak byl vložen do wiki – v takovém případě však nelze udělat z obrázku výřez! Pokud se má z náhledu stránky generovaného z DjVu a PDF dokumentů udělat výřez, musí být atribut width uveden, protože jeho šířka, uvedená v pixelech je výchozí pro nastavení výřezu (atribut crop ).
|
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 vždy 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= |
Jak je z výše uvedené tabulky zřejmé, parametrem width
u šablony {{Image}}
lze ovlivnit, jak bude vložený obrázek velký. Nejenom to, v jaké velikosti se bude zobrazovat v prohlížeči na straně klienta. Je zbytečné přenášet po síti soubor o velikosti několika MB, když ho můžeme přeškálovat a poslat pouze několik kB. Pochopitelně to má své limity. Je-li obrázek příliš velký, může nastat problém s renderováním náhledu. U stránek generovaných z DjVu či PDF ale tento problém nenastává.
- Použít originál místo náhledu se vyplatí u černobílých obrázků s průhledným pozadím (PNG). U kterých by vyrenderovaný a přeškálovaný obrázek vypadal rozmazaně a také by se během přeškálování ztratila průhlednost.
- 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.
- 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 parametrutitle
. 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 The Ladies’ Home Journal, 1902 (series)[1]
[[:Image:1902-12 p003 00.png|{{Image|1902-12 p003 00.png|30|right|PHOTOGRAPH BY R. C. PENFIELD}}]]
Příklad
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). |
- ↑ 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.