Čtyři nenápadná nastavení rozhodují, zda bude sekce působit vzdušně, kompaktně nebo se roztáhne přes celý prohlížeč. Naučíte se je používat bez znalosti CSS.
Co se naučíte
- Rozlišit omezený řádek boxed od řádku fluid přes celou šířku.
- Nastavit mezeru gutter mezi sloupci.
- Zvětšit podporovaný řádek tažením za ovládací prvek výšky.
- Poznat, u kterých řádků tyto volby nejsou dostupné.
Co jednotlivé volby znamenají
Boxed drží obsah v omezeném kontejneru. Na širokém monitoru proto zůstanou po stranách volná místa a text se příjemněji čte. Fluid dovolí řádku využít celou dostupnou šířku. Hodí se pro barevný pás, velký úvodní obraz nebo sekci, která má sahat od levého k pravému okraji.
Gutter je mezera mezi sloupci neboli Joomla pozicemi v jednom řádku. Editor nabízí hodnoty 0 až 5. Nula sloupce přitiskne k sobě, vyšší číslo přidá více prostoru. Nejde o vnější okraj celé sekce ani o odsazení obsahu uvnitř modulu.
Výška řádku určuje minimální svislý prostor vybrané sekce. U podporovaných řádků ji můžete změnit tažením za resize handle. Nastavení se uloží jako vzhled řádku a stane se součástí historie návrhu.
Postup krok za krokem
- Otevřete režim Grid a vyberte horní nebo spodní řádek nejvyšší úrovně.
- Zvolte boxed, chcete-li klidnější čitelnou šířku, nebo fluid pro celoplošný pás.
- Nastavte gutter v nastavení řádku. Začněte střední hodnotou a menší či větší mezeru volte podle obsahu.
- Je-li u řádku dostupné madlo výšky, táhněte pomalu a výsledek sledujte v náhledu pro více šířek.
- Počkejte na stav uložení. Při okamžitém zavření karty nemusí poslední zlomek změny stihnout autosave.
Ne každá oblast má vlastní boxed nebo fluid
Volba patří vrchním řádkům. Vnitřní řádky mainboxu a řádky postranních panelů ji nemají samostatně, protože jejich šířku určuje nadřazené rozvržení. Mainbox je navíc nosná oblast a nelze jej odstranit ani duplikovat.
Co ukazuje editor
Editor z těchto hodnot sestaví bezpečnou vizuální ukázku. Ta pomáhá posoudit proporce, ale není to živá stránka Joomly a nespouští skutečné moduly. Po instalaci šablony se výška může přirozeně zvětšit podle reálného textu, obrázků a modulového obsahu.
Užitečný test je přepnout stejný řádek postupně na desktop, tablet a mobil. Fluid sekce neznamená, že také každý text musí být od kraje ke kraji; její pozice a moduly mohou mít vlastní odsazení. Stejně tak velká minimální výška nevystředí obsah automaticky. Sledujte proto nejen hranici řádku, ale i skutečné umístění nadpisu, obrázku a tlačítek. Pokud na mobilu vzniká prázdná plocha, vraťte výšku na střídmější hodnotu a nechte ji růst podle obsahu.