Kódování HTML šablony

Z Developer Wiki

Přejít na: navigace, hledání

Pro nakódávání, respektive vytvoření vlastní šablony úplně od začátku je nutná znalost jazyka HTML, CSS, a případně JavaScriptu. Grafickou podobu šablony je vhodné připravit ve vhodném grafickém editoru a následně rozřezat.

Při kódování šablony je nutné si uvědomit, že šablona musí být poskládána z boxů. Aby mohli uživatelé libovolně přetahovat boxy mezi sloupci, musí mít každý box stejnou základní konstrukci. Na obrázku jsou jednotlivé boxy označeny červenou barvou.

Rozdělení stránky na boxy

Šablona je kódována na základě grafického návrhu. Můžete si stáhnout PSD soubor ukázkové šablony Média:simple-theme-blue.psd. Z grafického návrhu je potřeba vyřezat některé obrázky, zjistit barvy a rozměry šablony.

Soubor Média:theme-html.zip obsahuje nakódovanou ukázkovou šablonu, včetně čtyř variant (index.html – index4.html). Soubor index5.html ukazuje roztahování šablony do okna prohlížeče. Při kódování HTML souborů šablony je vhodné připravit všechny prvky, které je možné v administraci Webnode do stránek vložit. Prvky jsou vkládány v podobě boxů, které mají vždy stejnou základní konstrukci. Stejná konstrukce boxů umožňuje přetahování boxů mezi sloupci, stejně jako v administraci Webnode. Pokud hodláte používat více variant rozložení stránek (např. rozložení se dvěma a třemi sloupci), připravte si i tyto varianty. HTML soubory šablony lze snadno lokálně ladit.