Divi 5 nově přináší podporu plně přizpůsobitelných responzivních breakpointů. K dispozici je sedm předdefinovaných breakpointů, které pokrývají všechny typy zařízení – od mobilů až po velké monitory. Každý z nich si navíc můžete upravit podle vlastních potřeb, a tím získat plnou kontrolu nad vzhledem webu na všech šířkách obrazovky.
Celý systém je rychlý a snadno použitelný. Podívejte se na video níže a zjistěte, jak nová funkce Divi šablony funguje v praxi. 👇
Přizpůsobení breakpointů vašeho webu
Ve Visual Builderu můžete mezi jednotlivými breakpointy přepínat pomocí ikon v horní části rozhraní. Kliknutím na ikonu se třemi tečkami otevřete editor breakpointů, kde lze libovolné výchozí breakpointy Divi povolit nebo zakázat.
Původní tři breakpointy byly rozšířeny o čtyři nové: Phone Wide, Tablet Wide, Widescreen a Ultra Widescreen. Tyto nové možnosti pokrývají všechna moderní zařízení, takže můžete přizpůsobit design opravdu pro každý typ obrazovky.
Nastavení šířek jednotlivých breakpointů
Předdefinované breakpointy by měly pokrýt většinu běžných potřeb, ale pokud chcete cílit na konkrétní zařízení, můžete si jejich šířky přizpůsobit. V editoru breakpointů lze pro každý breakpoint nastavit vlastní šířku přesně podle vašich požadavků.
Intuitivní úpravy pro responzivní zobrazení
V Divi 5 už není potřeba zapínat responzivní úpravy pro jednotlivá nastavení. Jakákoliv změna provedená v konkrétním breakpointu se automaticky aplikuje jen na daný rozsah šířky.
Stačí přepnout pohled, provést úpravy a optimalizovat design pro vybranou velikost obrazovky. Navíc lze tažením okraje pracovní plochy zobrazit náhled webu v libovolné šířce v rámci aktivního breakpointu.
Návrh pro libovolné zařízení díky škálování plátna
Pokud je šířka aktivního breakpointu větší než šířka vašeho plátna, návrh se automaticky proporčně zmenší. Díky tomu je možné navrhovat i pro ultraširoké monitory – třeba i na menším notebooku nebo tabletu.
I při práci na menším zařízení nebo v zúženém okně prohlížeče tak snadno uvidíte, jak bude váš design vypadat na velkých obrazovkách.
Shrnutí
Divi 5 posouvá responzivní design na novou úroveň díky přizpůsobitelným breakpointům a intuitivnímu rozhraní pro jejich správu. Nově je k dispozici sedm předdefinovaných breakpointů, které lze dle potřeby zapínat, vypínat a upravovat jejich šířku, takže je možné cílit na jakékoliv zařízení – od mobilů až po ultraširoké monitory.
Úpravy jsou nyní výrazně jednodušší – není třeba ručně zapínat responzivní režim pro jednotlivé volby. Jakákoli změna provedená v konkrétním breakpointu se automaticky vztahuje pouze na daný rozsah šířky. Navíc lze díky škálování plátna pohodlně navrhovat i pro velké obrazovky, i když pracujete na menším zařízení.
Celý systém je rychlý, přehledný a umožňuje přesně optimalizovat vzhled webu pro každou velikost obrazovky.
Prohlédněte si i další novinky v Divi 5