Jak vytvořit stránku se sekcemi

Pro tvorbu a editaci stránek máte k dispozici nástroj, který vám umožní vytvořit si stránku složenou ze sekcí s přednastavenou strukturou a obsahem. Tento nástroj nabízí spoustu možností, které vám výrazně pomohou při tvorbě struktury a obsahu vašich stránek. V tomto článku si jej podrobně představíme a ukážeme, jak s ním pracovat, jaké konkrétní možnosti nabízí a v čem vám může výrazně usnadnit tvorbu webových stránek.

Možnosti editace stránek

Při vytváření nových stránek máte nyní na výběr ze dvou možností

• přidat prázdnou stránku - vytvoříte klasickou prázdnou stránku (do stránky nelze vkládat sekce)
• přidat stránku se sekcemi - vytvoříte stránku složenou ze sekcí, které disponují vlastní strukturou a obsahem (do stránky lze vkládat libovolné další sekce)

Přehled všech dostupných sekcí najdete na konci článku

Vytvoření stránky složené ze sekcí

Stránku složenou ze sekcí vytvoříte jednoduše. Stačí se přihlásit do administrace, přejít do sekce Stránky a kliknout na odkaz Přidat stránku. Rozbalí se vám nabídka, kde si zvolíte možnost se sekcemi a vyberete si konkrétní sekci.

Poté se vám zobrazí již editace vlastní stránky s přednastaveným obsahem. Vytvořenou stránku přejmenujte, obsah upravte a uložte. Stránka je tak vytvořena a můžete ji zobrazit přímo na webu.

Jak pracovat s vlastním editorem stránky je podrobně popsáno v článku Práce se stránkami.

Úpravy a práce se sekcemi

Stránka s již přednastaveným obsahem se skládá z jednotlivých samostatných sekcí, které jsou vymezeny nahoře i dole čárou - oddělovačem. Po kliknutí na tento oddělovač se objeví ikona razítka, která slouží pro vložení další sekce.

Po kliknutí na odkaz s razítkem se zobrazí okno, kde si můžete vybrat konkrétní sekci. Před vložením v okně vidíte i náhled vybrané sekce. Pro vložení nové sekce nezapomeňte kliknout na tlačítko uložit.

Se sekcemi lze dále pracovat v rámci celého bloku, nebo s jejími jednotlivými součástmi. Klikněte pravým tlačítkem myši na konkrétní sekci a zobrazí se vám kontextové menu, pomocí kterého můžete provést jednotlivé úpravy, jako je přesunutí sekce (nahoru/ dolů), zkopírování sekce, odstranění sekce. Další možnosti úprav sekce se vám zobrazí po rozkliknutí položky Nastavení sekce.

Sekce s názvem Tři sloupce s obrázkem a sekce s názvem Služby umožňuje pracovat i s jednotlivými částmi (buňkami) vlastní sekce. Aktivní buňku, kterou právě upravujete, poznáte tak, že při jejím označení myší se přebarví do šeda. Takto označenou buňku můžete v rámci sekce přesunout, zkopírovat či odstranit.

Nastavení pozadí sekce

Sekci můžete přidat i vlastní pozadí. Buďto jednobarevné, anebo obrázek. Pozadí přidáte velice jednoduše.

Klikněte pravým tlačítkem myši na blok šablony a vyberete možnost Nastavení sekce

V zobrazeném okně vyberete buďto přidání obrázku na pozadí, kde v průzkumníku vyberete váš obrázek. Anebo vyberete barvu pozadí v z předpřipravených barev anebo po kliknutí na ikonu s paletkou si můžete barvu definovat ručně pomocí kódu barev z RGB spektra či kódem HEX. S definováním jednotlivých barev spektra vám může pomoci např. nástroj od Google Color Picker.

Dialog poté uložte a následně bude blok sekce podbarven.

Rozdělení sekce na dva bloky

Vybrané sekce lze rozdělit na dva samostatné bloky a do každého z nich umístit libovolný obsah. Tipickým příkladem je např. použití bloku Dynamická sekce, do které můžete odkazovat kontaktní formulář a do druhého bloku přidat vaše kontaktní údaje.

Varianty sekcí

• Výchozí - obsahuje pouze text.
• Nadpis s textem
• Nadpis s tlačítkem
• Obrázek s textem vlevo nebo vpravo - sekce rozdělená na dva sloupce (v jednom s obrázkem a v druhém s textem).
• Tři sloupce s obrázkem nahoře nebo dole - Více k této šabloně najdete v článku Sekce - Tři sloupce s obrázkem
• Služby - nadpis s odrážkami a textem.
• Ceník - nadpis s ceníkem tvořeným tabulkami.
• Kontakty - nadpis s blokem tří sloupců s kontaktními údaji, otevírací dobou a odkazy na soc. sítě.
• Mapa - Více k této šabloně najdete v článku Sekce - Mapa
• Fotogalerie (carousel) - Více k této šabloně najdete v článku Sekce - Fotogalerie (carousel)
• Záložky - Více k této šabloně najdete v článku Sekce - Záložky
• Harmonika - Více k této šabloně v článku Sekce - Harmonika
• Dynamická sekce - s jejíž pomocí můžete do stránek vložit např. kontaktní formulář, fotogalere, anebo výpis produktů e-shopu - Dynamická sekce
• Vlastní HTML kód - přidejte si do stránky vlastní HTML kód či libovolný script - Jak vložit do stránky HTML kód