--- site_name: WPlama site_description: "Správa, opravy a vývoj WordPress webů a e-shopů" site_url: https://www.wplama.cz contact_email: info@wplama.cz title: "Divi 5: Flexbox" url: https://www.wplama.cz/divi-5-flexbox/ date: 2026-01-06 modified: 2026-01-06 author: Tomáš Cirkl type: post categories: [Divi šablona a Elegant Themes] tags: [Divi 5] --- Divi šablona a Elegant Themes # Divi 5: Flexbox [![profil 100x100](https://www.wplama.cz/wp-content/uploads/2026/11/profil-100x100.jpg "profil 100x100") **Tomáš Cirkl**](https://www.wplama.cz/author/tomas/) Publikováno 6. 1. 2026 3 min čtení ![Divi 5 - Flexbox](https://www.wplama.cz/wp-content/uploads/2026/01/divi-5-flexbox-scaled.png "Divi 5 - Flexbox") Obsah článku (7 kapitol) 1. [Zcela nový systém rozložení v Divi 5](https://www.wplama.cz/divi-5-flexbox/#zcela-novy-system-rozlozeni-v-divi-5) 2. [Velký výběr nových Flexbox šablon pro řádky](https://www.wplama.cz/divi-5-flexbox/#velky-vyber-novych-flexbox-sablon-pro-radky) 3. [Flexbox nastavení pro každý prvek](https://www.wplama.cz/divi-5-flexbox/#flexbox-nastaveni-pro-kazdy-prvek) 4. [Responzivní struktura řádků](https://www.wplama.cz/divi-5-flexbox/#responzivni-struktura-radku) 5. [Responzivní řazení prvků](https://www.wplama.cz/divi-5-flexbox/#responzivni-razeni-prvku) 6. [Snadné pozicování vnořených prvků](https://www.wplama.cz/divi-5-flexbox/#snadne-pozicovani-vnorenych-prvku) 7. [Konec Speciálních sekcí a Sekcí na celou šířku](https://www.wplama.cz/divi-5-flexbox/#konec-specialnich-sekci-a-sekci-na-celou-sirku) Byl představen zbrusu nový layout systém pro [Divi 5](https://www.wplama.cz/divi-5) postavený na Flexboxu. Nejedná se o žádnou drobnou aktualizaci. Tento krok v podstatě redefinuje celou Divi a umožní vám postavit prakticky jakoukoli strukturu layoutu. Nový systém zahrnuje pokročilé responzivní chování, vlastní změny pořadí modulů (order), snadné vertikální zarovnání nebo pozicování prvků a mnoho dalšího. Jak vypadá nová funkce v akci, se můžete podívat na videu níže. 👇 [Divi 5's Flexbox Layout System Has Arrived](about:blank) ## Zcela nový systém rozložení v Divi 5 Systém layoutu v Divi byl kompletně přepracován a přibylo mnoho nových šablon řádků i možností nastavení. Díky flexboxu, [vnořeným řádkům](https://www.wplama.cz/divi-5-vnorene-radky/) a [skupinám modulů](https://www.wplama.cz/divi-5-skupiny-modulu/) teď vytvoříte prakticky jakoukoli strukturu. Nový systém výrazně usnadňuje kontrolu nad pozicováním prvků, mezerami, zalamováním (wrapping) a pořadím prvků. ## Velký výběr nových Flexbox šablon pro řádky Jako první vás pravděpodobně zaujme nabídka nových šablon řádků, která nově obsahuje i varianty s vnořenými řádky (nested rows). Variabilita je nyní mnohem větší. Nejde přitom o pevné limity – tyto šablony slouží jen jako pohodlné předpřipravené ukázky pro rychlejší start. Jakmile se ponoříte do nastavení, zjistíte, že zmizela dřívější omezení. Můžete přidávat libovolný počet sloupců, definovat jim vlastní velikosti a vnořovat řádky do sloupců tak, abyste docílili přesně takového rozložení, jaké potřebujete. ## Flexbox nastavení pro každý prvek Nové možnosti Flexboxu jsou nyní k dispozici u všech prvků. Můžete plně ovládat zalamování layoutu (wrapping), směr toku, pořadí prvků, mezery i pozicování vnořených (child) prvků. Už žádné „hacky“, žádný zbytečný JavaScript ani nepořádek v kódu. Divi 5 nabízí intuitivní ovládací prvky, které zkrátka fungují. ## Responzivní struktura řádků Tvorba responzivních webů je zase o něco jednodušší. Pro každý breakpoint (bod zlomu) teď můžete v rámci jednoho řádku nastavit odlišnou strukturu. Je to jednoduché řešení, které umožňuje kompletně změnit rozložení layoutu pro jednotlivá zařízení. Kromě toho lze na každém zařízení upravovat velikost sloupců a měnit jakékoli nastavení Flexboxu. ## Responzivní řazení prvků Změna pořadí prvků pro různá zařízení je nyní hračka. Snadno změníte směr toku prvků na jednotlivých zařízeních i pořadí konkrétních elementů. Můžete tak kompletně přizpůsobit strukturu řádku pro konkrétní zařízení a následně v rámci této nové struktury prvky optimálně seřadit. ## Snadné pozicování vnořených prvků Flexbox výrazně zjednodušuje pozicování prvků uvnitř jejich rodičovských kontejnerů. Už není potřeba používat JavaScript ani prvky s absolutní pozicí. Například vertikální vycentrování prvků ve sloupci je nyní otázkou jednoho kliknutí. Stejně jednoduché je i sjednocení výšky prvků. Snadno tak nastavíte, aby měly všechny sloupce v řádku stejnou výšku, nebo aby byly stejně vysoké všechny moduly v rámci jednoho sloupce. ## Konec Speciálních sekcí a Sekcí na celou šířku V rámci zjednodušení struktury Divi se upouští od **Speciálních sekcí** (Specialty Sections) a **Sekcí na celou šířku** (Fullwidth Sections). Nemusíte se ale bát o své starší weby – **existující sekce tohoto typu budou fungovat i nadále**. Pouze byla odstraněna možnost přidávat nové. Důvod je prostý: díky novým Flexbox řádkům už různé typy sekcí nejsou potřeba. Všechno, co uměly ty staré (a ještě víc), teď zvládnete v rámci standardních řádků. Moduly, které byly dříve vázané pouze na plnošířkové sekce, byly přejmenovány a nově je lze vkládat do běžných sekcí. To dává tvůrcům mnohem větší volnost. ### Závěrem: Nutný skok do současnosti Přechod na Flexbox v [Divi 5](https://www.wplama.cz/divi-5) není jen kosmetická úprava, je to technologická nutnost. Divi se tímto krokem zbavuje letitého technologického dluhu (zastaralé `floats`) a konečně se technicky dotahuje na moderní page buildery, pro které je Flexbox standardem už dlouho. **Prohlédněte si i další novinky v Divi 5** - [Divi 5: Kombinovatelné nastavení](https://www.wplama.cz/divi-5-kombinovatelne-nastaveni/) - [Divi 5: Command Center](https://www.wplama.cz/divi-5-command-center/) - [Divi 5: Spekulativní prerendering](https://www.wplama.cz/divi-5-spekulativni-prerendering/) - [Divi 5: Upravitelné oblasti v Theme Builderu (Kompletní editace webu)](https://www.wplama.cz/upravitelne-oblasti-v-theme-builderu/) - [Divi 5: Nový karousel modul – vytvářejte slidery z čehokoliv](https://www.wplama.cz/divi-5-novy-karousel-modul-vytvarejte-slidery-z-cehokoliv/) - [Divi 5: Loop Builder – svoboda při výpisu obsahu](https://www.wplama.cz/divi-5-loop-builder-svoboda-pri-vypisu-obsahu/) - [Divi 5: Hledat a Nahradit](https://www.wplama.cz/divi-5-hledat-a-nahradit/) - [Divi 5: Rozšíření atributů](https://www.wplama.cz/divi-5-rozsireni-atributu/) - [Divi 5: Pokročilé jednotky (včetně CSS funkcí a proměnných)](https://www.wplama.cz/divi-5-pokrocile-jednotky-vcetne-css-funkci-a-promennych/) - [Divi 5: Design založený na presetech](https://www.wplama.cz/divi-5-navrh-zalozeny-na-presetech/) - [Divi 5: Proměnné v designu](https://www.wplama.cz/divi-5-promenne-v-designu/) - [Divi 5: Vyhledávání a filtrování nastavení](https://www.wplama.cz/divi-5-vyhledavani-a-filtrovani-nastaveni/) - [Divi 5: Správu atributů](https://www.wplama.cz/divi-5-spravu-atributu/) - [Divi 5: Skupiny modulů](https://www.wplama.cz/divi-5-skupiny-modulu/) - [Divi 5: Přizpůsobitelné responzivní breakpointy](https://www.wplama.cz/divi-5-prizpusobitelne-responzivni-breakpointy/) - [Divi 5: Vnořené řádky](https://www.wplama.cz/divi-5-vnorene-radky/) - [Divi 5 (Public Alpha) k dispozici ke stažení](https://www.wplama.cz/divi-5-public-alpha/) - [#Divi 5](https://www.wplama.cz/stitek/divi-5/) Sdílet - - [](mailto:?subject=Divi 5: Flexbox&body=Divi 5: Flexbox https://www.wplama.cz/divi-5-flexbox/) - [](https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fwww.wplama.cz%2Fdivi-5-flexbox%2F) - [](https://www.linkedin.com/sharing/share-offsite/?url=https%3A%2F%2Fwww.wplama.cz%2Fdivi-5-flexbox%2F) ![profil 150x150](https://www.wplama.cz/wp-content/uploads/2026/11/profil-150x150.jpg "profil 150x150") Autor Tomáš Cirkl Zakladatel WPlama. Od roku 2014 se starám o weby a e‑shopy na WordPressu a píšu o tom, co při té práci řeším. Třikrát jsem přednášel na Word Campech. 1 035 článků [Všechny články autora →](https://www.wplama.cz/author/tomas/) ## Komentáře Zatím tu nikdo nekomentoval. Napište první komentář. ### Přidat komentář [Zrušit odpověď](https://www.wplama.cz/divi-5-flexbox/#respond) [← Předchozí článek Cloudflare Turnstile – Jeden antispam, který ochrání celý váš WordPress](https://www.wplama.cz/cloudflare-turnstile-antispam/) [Další článek → Divi 5: Loop Builder – svoboda při výpisu obsahu](https://www.wplama.cz/divi-5-loop-builder-svoboda-pri-vypisu-obsahu/) Související ## Mohlo by vás zajímat [Všechny články z rubriky Divi šablona a Elegant Themes →](https://www.wplama.cz/wordpress/divi-elegant-themes/) ![kombinovatelne nastaveni](https://www.wplama.cz/wp-content/uploads/2026/04/kombinovatelne-nastaveni.png "kombinovatelne nastaveni") Divi šablona a Elegant Themes ### [Divi 5: Kombinovatelné nastavení](https://www.wplama.cz/divi-5-kombinovatelne-nastaveni/) 13. 4. 2026 2 min čtení --- ![command center](https://www.wplama.cz/wp-content/uploads/2026/03/command-center.png "command center") Divi šablona a Elegant Themes ### [Divi 5: Command Center](https://www.wplama.cz/divi-5-command-center/) 7. 4. 2026 4 min čtení --- ![spekulativni prerendering](https://www.wplama.cz/wp-content/uploads/2026/03/spekulativni-prerendering.png "spekulativni prerendering") Divi šablona a Elegant Themes ### [Divi 5: Spekulativní prerendering](https://www.wplama.cz/divi-5-spekulativni-prerendering/) 30. 3. 2026 3 min čtení ---