13 620
editací
Manual pro editory webovych stranek UP: Porovnání verzí
Skočit na navigaci
Skočit na vyhledávání
→Příklad: stránka s několika prvky Expanding Content
značka: editace z Vizuálního editoru |
|||
| Řádek 28: | Řádek 28: | ||
== Obsahové prvky na stránce == | == Obsahové prvky na stránce == | ||
Obsah stránky (na hlavní ploše) členíme do tzv. obsahových prvků (Content Elements) '''– viz. obr. 4''', kterým přiřazujeme nadpisy. V hlavním seznamu není uveden dodatečně vytvořený Expanding Content (viz. video '''Expanding Content https://www.youtube.com/embed/UqVJicoOjMY'''), který na novém webu UP hojně využíváme. | Obsah stránky (na hlavní ploše) členíme do tzv. obsahových prvků (Content Elements) '''– viz. obr. 4''', kterým přiřazujeme nadpisy. V hlavním seznamu není uveden dodatečně vytvořený Expanding Content (viz. '''video''' '''Expanding Content https://www.youtube.com/embed/UqVJicoOjMY'''), který na novém webu UP hojně využíváme. | ||
== Vytvoření obsahu == | == Vytvoření obsahu == | ||
| Řádek 36: | Řádek 34: | ||
=== Příklad: stránka s několika prvky Expanding Content === | === Příklad: stránka s několika prvky Expanding Content === | ||
Pro delší obsah na stránce používáme prvky Expanding Content, které může čtenář „sbalovat“ a „rozbalovat“ přímo na stránce. | Pro delší obsah na stránce používáme prvky Expanding Content, které může čtenář „sbalovat“ a „rozbalovat“ přímo na stránce. | ||
[[Soubor:Upoladmin 04.png|centre|frameless|800x800px|alt= Obr. 4. Obsahové prvky na stránce|Obr. 4. Obsahové prvky na stránce]]<p style="text-align: center">'''obr. 4 content elements (obsahové prvky)'''</p> | [[Soubor:Upoladmin 04.png|centre|frameless|800x800px|alt= Obr. 4. Obsahové prvky na stránce|Obr. 4. Obsahové prvky na stránce]]<p style="text-align: center">'''obr. 4 - content elements (obsahové prvky)'''</p> | ||
# Než začneme stránku plnit obsahem, promyslíme, jak bude text strukturován a členěn pomocí nadpisů. Pro každý Expanding Content použijeme v jeho horní části nadpis H2. Nadpis se pak automaticky zobrazí v pravém Scrollspy Menu. | # Než začneme stránku plnit obsahem, promyslíme, jak bude text strukturován a členěn pomocí nadpisů. Pro každý Expanding Content použijeme v jeho horní části nadpis H2. Nadpis se pak automaticky zobrazí v pravém Scrollspy Menu. | ||
# Do první části Expanding Contentu umístíme krátký uvozující text. Měl by to být odstavec v délce max. 80 znaků. Po kliknutí na „Více…“ se čtenáři na webu odkryje obsahový prvek celý. | # Do první části Expanding Contentu umístíme krátký uvozující text. Měl by to být odstavec v délce max. 80 znaků. Po kliknutí na „Více…“ se čtenáři na webu odkryje obsahový prvek celý. | ||
# Ve druhé části Expanding Contentu vytvoříme další část obsahu, který můžeme dále členit pomocí nadpisů H3 a H4. Nadpis H3. Z nadpisů H3 u rozbalené části se automaticky vytváří nadpis v pravém Scrollspy Menu. '''(video | # Ve druhé části Expanding Contentu vytvoříme další část obsahu, který můžeme dále členit pomocí nadpisů H3 a H4. Nadpis H3. Z nadpisů H3 u rozbalené části se automaticky vytváří nadpis v pravém Scrollspy Menu. '''(video Expanding Content''' https://youtu.be/UqVJicoOjMY''')''' | ||
Pozn. Pro složitěji členěný obsah použijeme prvek Expanding Content Mixed ('''video | Pozn. Pro složitěji členěný obsah použijeme prvek Expanding Content Mixed ('''viz. video Expanding Content Mixed https://youtu.be/3JtN5w81PwQ''') | ||
=== Obrázky === | === Obrázky === | ||
Pro vložení obrázků můžeme zvolit několik obsahových prvků: | Pro vložení obrázků můžeme zvolit několik obsahových prvků: | ||
* Images: používáme, pokud nepotřebujeme doprovodný text k obrázku. Obrázky zarovnáváme doleva. | * Images: používáme, pokud nepotřebujeme doprovodný text k obrázku. Obrázky zarovnáváme doleva. | ||
* Text & Images: nejsnadnější způsob vkládání obrázku a a textu. Text může být umístěn vedle obrázku nebo obrázek obtékat '''( | * Text & Images: nejsnadnější způsob vkládání obrázku a a textu. Text může být umístěn vedle obrázku nebo obrázek obtékat '''(viz video Text & Images: https://youtu.be/KeEyMcapL6g<nowiki/>)''' | ||
* Text: obrázek můžeme vložit i dovnitř textového prvku (včetně Expanding Contentu). Upozornění: obtékání obrázku nenastavujeme u „Obtékat“, ale nahoře ve volbě „Styl“ | * Text: obrázek můžeme vložit i dovnitř textového prvku (včetně Expanding Contentu). Upozornění: obtékání obrázku nenastavujeme u „Obtékat“, ale nahoře ve volbě „Styl“ | ||
| Řádek 68: | Řádek 66: | ||
=== Příklad: nahrání souboru a vytvoření odkazu na něj v textovém prvku === | === Příklad: nahrání souboru a vytvoření odkazu na něj v textovém prvku === | ||
'''Video soubory a odkazy''' | '''Video soubory a odkazy: https://youtu.be/pvGDZO-jclQ''' | ||
# v levém menu zvolíme SOUBORY / Seznam souborů | # v levém menu zvolíme SOUBORY / Seznam souborů | ||
# rozbalíme složku | # rozbalíme složku | ||