Záložky

K čemu slouží

Komponenta Záložky slouží k přehlednému roztřídění obsahu na stránce do několika kategorií a zároveň umožňuje horizontální navigaci, podobně jako menu. Uživatelé mohou proklikem na jednotlivé položky v záložkách zobrazit nový obsah. Lze zobrazit všechny typy obsahu – texty, obrázky, videa i jiné prvky, podobně jako na běžné stránce. Návštěvníci mohou mezi záložkami libovolně přepínat a objevovat jednotlivé sekce obsahu podle svých potřeb.

Komponenta také nabízí alternativní zobrazení pomocí select boxu, které může být vhodné v případech, kdy je potřeba úspora místa nebo je počet záložek vyšší.

Jak s komponentou pracovat

Varianty vzhledu a další nastavení

Varianty vzhledu

Komponenta Záložky nabízí pět různých variant vzhledu

Klasické záložky
- Ohraničení: Vyberte si mezi rámečkem, ohraničením ze spodu nebo čistým vzhledem bez ohraničení
- Vizuální styl: Můžete zvolit klasické zobrazení záložek nebo výraznější variantu ve formě tlačítek.
Select box
- Tato varianta je ideální, pokud máte na stránce více záložek nebo chcete ušetřit místo. Lze ji také využít v případě, že chcete zdůraznit nutnost výběru a nepředpokládáte proklikávání mezi více záložkami.

Možnosti úprav

Aby vaše záložky ladily s ostatním obsahem, můžete si je dále přizpůsobit:

Šířka záložek
- Na celou šířku stránky: Tato možnost využije celou šíři stránky a záložky tak budou rozprostřeny po celé ploše.
- Pro pohodlné čtení: Zužením záložek vytvoříte prostor pro příjemnější čtení, což je zvláště vhodné pro delší texty.
Mobilní zobrazení
- Pokud preferujete, aby si uživatelé sami zvolili, kterou sekci chtějí vidět jako první, můžete nastavit, aby se první záložka v mobilním zobrazení nerozbalovala automaticky.

Pokročilé možnosti

Viditelnost: Každou z komponent vytvořených v Umbracu je možné na webu skrýt pomocí záložky Viditelnost v nastavení prvku.
Rozestupy: Vždy máte možnost nastavit rozestupy mezi záložkami a okolními prvky prostřednictvím záložky Rozestupy.
Samostatná URL adresa: Každá záložka může mít svoji vlastní URL adresu, pokud je adresa zadána do příslušné záložky. Tento odkaz umožňuje přímý přístup ke konkrétnímu obsahu v záložce. Centrálním nastavením celé komponenty můžete zobrazení těchto URL adres potlačit, pokud si přejete, aby nebyly viditelné v URL prohlížeče.

Prozkoumejte a vyzkoušejte všechny dostupné možnosti nastavení této komponenty přímo v Umbracu.

Tipy a doporučení

Stručné názvy záložek: Při pojmenovávání záložek vybírejte spíše kratší a výstižné názvy. Dlouhé názvy mohou být nečitelné nebo mohou narušit přehlednost designu.
Pozor na mobilní rozhraní: Berte v potaz, že v mobilním rozhraní se záložky zobrazují jako rozklikávací box, což může ovlivnit jejich dostupnost a přehlednost.
Použití select boxu pro mnoho záložek: Pokud pracujete s větším počtem záložek, je vhodné zvážit použití varianty se select boxem. Tento formát pomáhá udržet stránku přehlednou a snadno ovladatelnou.

Příklad záložky

Desktop

Mobil

Ukázky použití na webu

Zobrazte si živé ukázky – k dispozici je vždy odkaz na ukázkovou stránku nebo přímo na skutečnou stránku webu, ze kterého daný příklad pochází.

Ukázka 1

Zvětšit obrázek
Přejít na stránku Návod ke komponentě Hero Box

Stránky Umbraco komponent na webu Webcentra rovněž obsahují záložky - ukazujeme vám na nich ukázky komponent v desktopové a mobilní variantě.

Ukázka 2

Zvětšit obrázek
Zobrazit živou ukázkovou stránku

Stránka knihovny FF MUNI obsahuje dvě záložky ve formě výrazných tlačítek. Záložka je poprvé využita jako rozcestník jak postupovat v určitých situacích, podruhé pro výběr typu obsahu, které si čtenář může v knihovně vypůjčit.

Ukázka 3

Zvětšit obrázek
Zobrazit živou ukázkovou stránku

Stránka SKM MUNI obsahuje jednu standartní záložku s ohraničením po všech stranách. Záložka ukazuje způsob připojení k WiFi pro různé typy uživatelů.

Upozornění: Výběr služeb (Internet a Tisk a kopírování) není na stránce řešen komponentou záložka, ale výstřižek.

Ukázka 4

Zvětšit obrázek
Přejít na stránku na webu Kalendář MUNI

V kalendáři MUNI naleznete dva typy záložek. Pomocí záložky ve formě select boxu lze vybrat akce relevantní pro danou fakultu, pro výběr měsíců je využita záložka ve formě výrazného tlačítka.