Obsah webu netvoří pouze texty, ale rovněž další dokumenty (textové soubory, tabulky, prezentace, databáze apod.) a média (zejména rastrové obrázky, vektorová grafika, animace a multimediální soubory), které chceme zobrazit přímo v příspěvku, nebo na ně pouze odkázat – ať již na jejich podobu v nativním formátu, či např. na archiv uložený v komprimovaném souboru.

Uvedené soubory musíme pochopitelně někam uložit, aby k nim měl webový server, resp. následně prohlížeč přístup. Grav CMS nabízí několik možných způsobů, kam média (jak jsou z jeho strany všechny soubory chápany a nazývány) uložit. Které úložiště je pro soubor (médium) nejvhodnější si uvedeme dále.

Umístění ve sdílené složce

Tento způsob zvolíme pro média, která budeme nadále opakovaně sdílet, zobrazovat nebo jinak používat na stránkách našeho webu. Typicky se jedná o loga, kliparty nebo fotografie organizace. V takovém případě je více než vhodné, aby byly uloženy na jednom místě, jak z důvodu přehlednosti, tak z důvodu úspory místa. Grav pro tyto případy počítá explicitně se složkou /images, vytvořenou v kořenové složce stránek, tedy /user/pages/images, nicméně může to být i jakákoliv jiná.

Pokud do této složky umístíme například soubor logo.png, odkážeme na něj odkudkoliv z našeho webu následovně:

![Logo](/images/logo.png)

Nejsme samozřejmě nijak vázáni pouze na tuto složku, můžeme v ní pochopitelně vytvořit neomezený počet podložek v libovolném počtu vnoření. Pak odkazujeme na soubor následovně:

![Logo](/images/corporate/logo.png)

Pochopitelně není příliš logické, aby ve složce /images byly databáze, archivy nebo jiné dokumenty, které nejsou obrázky. Nic nám ale nebrání v tom, abychom vytvořili složku s názvem /files, která by sloužila pro ukládání těchto souborů, přičemž v ní můžeme vytvořit opět neomezený počet vnoření. Pak odkazujeme na soubor následovně:

[Document](/files/document.pdf)

Všimněte si rozdílného zápisu odkazu na obrázek, kterých chceme zobrazit přímo na stránce (se symbolem ! na začátku) a na dokument, na nějž chceme pouze odkázat.

Nic nám pochopitelně nebrání, abychom v případě české verze webu používali názvy složek v češtině, tedy např.:

[Dokument](/soubory/dokument.pdf)

Jak je uvedeno v závěru článku, lze použít různé názvy složek pro použité jazykové mutace webu (např. /images pro anglickou verzi a /obrazky pro českou verzi), např. přepsáním cesty parametrem slug v hlavičce stránky (frontmatter), byť se v tomto případě jedná o složku, která md soubor nemusí de facto vůbec obsahovat.

Umístění ve složce stránky

Tento způsob zvolíme pro média, která jsou určena výhradně pro konkrétní stránku, v níž mají být publikována, a neočekává se tedy, že by byla kdykoliv použita někde jinde (ačkoliv to není vyloučeno, jak si ukážeme dále). Typicky se jedná o ilustrační obrázky mající přímou souvislost k obsahu zveřejněnému na stránce, tutoriály, zdrojové kódy apod.

Způsob zveřejnění se neliší od předchozího, pouze neuvádíme žádnou složku:

![Fotografie ze semináře](seminar_2_beh.jpg)

[Prezentace](prezentace_2_beh.pptx)

Média stránky (Page Media) mají ještě jeden důležitý význam, a tím je zobrazování obrázků v šablonách webu (Themes), resp. jednotlivých stránek (Templates). Například v případě výchozí šablony webu Quark se na domovské stránce (šablona stránky modular) zobrazí první nalezený obrázek (pokud je obrázků více) vložený v modulu (speciální stránka určená pro zobrazování v nadřazené modulární stránce) s přiřazenou šablonou stránky _hero, jestliže není explicitně vybrán obrázek jiný prostřednictvím proměnné hero_image.

Obdobně tomu je v případě blogu (šablona stránky blog) a jeho příspěvků (šablona stránky item), kdy se v záhlaví zobrazí obrázek explicitně vybraný prostřednictvím proměnné hero_image a pokud není žádný vybraný, pak je v případě blogu ponecháno prázdné místo (pozadí) a v případě příspěvku se vybere varianta šablony bez obrázku v záhlaví. V případě seznamu příspěvků zobrazených na stránce /blog se u těchto příspěvků zobrazuje miniatura prvního nalezeného obrázku ve složce stránky.

Uvedené platí pro šablonu webu Quark, ostatní šablony mohou mít – a obvykle mají – odlišné chování podle toho, jak jsou nastaveny pravidla v šablonách stránek.

Umístění ve složce jiné stránky

Tento způsob kombinuje předchozí dva uvedené. V praxi může nastat situace, kdy na stránce chceme zveřejnit fotografii, která je součástí jiné stránky. Pochopitelně je zbytečné ji duplikovat, a proto se nabízí možnost zpracovat odkaz tak, aby odkazoval na již nahraný soubor. Například jste v minulosti napsali článek o návštěvě zahraniční delegace ve vaší společnosti, jíž se účastnil nějaký významný host. Jeho fotografie je společně s ostatními uložena jako médium stránky, neboť se týká pouze tohoto příspěvku a nepředpokládáte, že by se budoucnu měla použít k jiným účelům. Nicméně s odstupem času se uvedená osoba stala generálním ředitelem pro střední Evropu, o čemž potřebujete urychleně napsat tiskovou zprávu a jediná dostupná použitelná fotografie je ta z předchozího příspěvku.

Původní příspěvek Návštěva personálních ředitelů z celého světa v sídle naší společnosti v ČR umístěný ve složce /media/tiskove-zpravy/tz-2021-06-15-01:

...
![](img_20210615110823.jpg)
...

Nový příspěvek Nový generální ředitel pro střední Evropu z pozdějšího data:

![Nový generální ředitel pro střední Evropu](/media/tiskove-zpravy/tz-2021-06-15-01/img_20210615110823.jpg)

Pokročilé metody umístění médií

Média nemusí být umístěna pouze ve struktuře stránek, tedy ve složce /user/pages, ale mohou se nacházet i v jiných úložištích používaných Gravem. Média tedy mohou být součástí použitého tématu webu (tedy aktivního), ale i jiného tématu webu, který je nainstalován, ale v současné době není aktivní, popř. i dalších úložišť, např. doplňků, k nimž se přistupuje prostřednictvím metody nazývané stream.

Obrázek (médium) uložený ve složce /user/themes/quark/images zobrazíme prostřednictvím streamu theme:// následovně:

![Theme Image](theme://images/theme-image.jpg)

Uvedené předpokládá, že Quark je nastaven jako aktivní téma webu.

Obrázek (médium) uložený ve složce /user/images zobrazíme prostřednictvím streamu image:// následovně:

![My Image](image://my-image.jpg)

Zde je na zváženou, zda má význam používat složku /user/images. Výhodou je oddělení médií (v tomto případě typicky obrázků) od struktury stránek, nevýhodou pak to, že k uvedeným obrázkům není přístup přes Admin Panel (pokud nemáme nainstalovaný doplněk Editor, který umožňuje správu souborů, lze se k uvedeným souborům dostat pouze přes FTP). V opačném případě je výhodnější používat složku /user/pages/images.

Obrázek (médium) uložený ve složce /user zobrazíme prostřednictvím streamu user:// následovně:

![My Image](user://themes/mytheme/images/my-image.jpg)

Uvedené můžeme tedy použít pro přístup k obrázku dostupném v neaktivním tématu webu, ale pochopitelně třeba i některém z nainstalovaných doplňků, resp. uložených kdekoliv jinde v ve složce /user.

Upozornění

Grav disponuje rovněž složkou /images. Tu však nikdy nepoužívejte pro vlastní obrázky (média), neboť je určena pouze pro vlastní systémové potřeby Gravu.

Ze shora uvedeného je patrné, že Grav neklade v přístupu k médiím téměř žádná omezení, a je pouze na našem uvážení, který ze zmíněných způsobů se rozhodneme použít. Dále můžeme používat různé parametry, které ovlivňují výsledný vzhled médií (plná kvalita, komprimovaná kvalita, náhled apod.), a v neposlední řadě i různé názvy složek pro použité jazykové mutace webu (např. /images pro anglickou verzi a /obrazky pro českou verzi), ale to je již nad rámec tohoto článku.

Nalezli jste v článku chybu, ať již gramatickou nebo faktickou? Článek prošel pouze autorskou korekturou a drobné nedostatky, jako překlepy nebo chybný slovosled, se v něm mohou vyskytovat. Pokud je objevíte, pomozte příspěvek upravit oznámením přes kontaktní formulář nebo na e-mail. Budou vám vděčni nejen autoři, ale zejména ostatní čtenáři.

Pomozte Grav.cz prolinkovat. Projekt Grav.cz se za dva roky provozu rozrostl a ve starších příspěvcích na Blogu mohou být uvedeny pasáže, které by stálo za to prolinkovat na konkrétní související řešení, která jsou uvedena v následujících příspěvcích. Pokud takové objevíte, pošlete informaci přes komunikační kanály uvedené v předchozím nebo následujícím odstavci.

Diskuze k článku není k dispozici. Pokud ale máte k tématu článku podněty, připomínky nebo dotazy, je možné je sdělit ve skupině na Facebooku, kde se k nim vyjádří nejen autor, ale případně i další diskutující.

Předchozí příspěvek Následující příspěvek