Vývojáři Divi 5 představili novinky a mezi nimi vyčnívá jedna, po které uživatelé volali roky – modul Group Carousel (Skupinový karusel).
Tento modul vám umožní vytvořit prakticky jakýkoli typ karuselu nebo slideru. Nejde jen o statický obsah; díky propojení s novým Loop Builderem v Divi 5 můžete snadno vytvářet i dynamické karusely, které automaticky načítají například vaše blogové příspěvky.
Nová architektura Divi 5 navíc vývojářům výrazně usnadňuje tvorbu modulů, takže po oficiálním vydání pětky můžeme očekávat záplavu dalších novinek. Aktuální update je v podstatě jen „předkrm“.
Jak vypadá nový karusel v akci, se můžete podívat na videu níže. 👇
Modul Group Carousel: Konečně svoboda
Tou nejzásadnější novinkou v této aktualizaci je bezpochyby modul Group Carousel.
V čem je jiný? Na rozdíl od běžných karuselů, které známe, funguje každý snímek (slide) v tomto modulu jako čisté plátno. Můžete do něj vložit naprosto jakékoli moduly a vytvořit si tak slider přesně podle svých představ – ať už jde o obrázky, texty, tlačítka nebo jejich kombinace.
Plně ovládáte počet snímků, jejich obsah i nastavení animací. A protože i tento modul využívá komplexní designová nastavení Divi, máte volnou ruku při tvorbě unikátních stylů a přechodových efektů.
Karusely z příspěvků, uživatelů a taxonomií
Nový Loop Builder v Divi 5 posouvá možnosti karuselu ještě dál. Umožňuje totiž vytvořit smyčku (loop) uvnitř skupiny prvků. Díky tomu můžete snadno vytvořit karusel, který automaticky generuje slidy na základě příspěvků, taxonomií (kategorií/štítků) nebo uživatelů.
Funguje to na principu dynamického obsahu:
- Na skupině modulů zapnete funkci smyčky.
- Upravíte dotaz (query) – tedy co přesně se má načítat.
- Do prvků v karuselu vložíte dynamická data (např. nadpis příspěvku, náhledový obrázek).
V praxi tak můžete během chvilky postavit třeba slider s referencemi, který si tahá data z vlastního typu příspěvku (Custom Post Type) a polí vytvořených přes ACF.
Příklady využití: Fantazii se meze nekladou
Hlavní kouzlo modulu Group Carousel spočívá v tom, že každý jednotlivý snímek (slide) funguje jako čisté plátno zabalené do kontejneru skupiny (Group).
Dovnitř můžete vložit libovolné moduly, a to i včetně vnořených řádků. Díky podpoře Flexboxu tak vytvoříte i velmi pokročilé a komplexní layouty pro každý jednotlivý slide.
Navíc můžete naplno využít veškerá designová nastavení Divi – transformace, filtry nebo stíny. Právě jejich kombinací a animováním lze dosáhnout zajímavých efektů při přechodu mezi jednotlivými slidy.
Příklad 1: Vlastní slider na celou obrazovku
Group Carousel umožňuje zobrazit libovolný počet snímků na stránku. Pokud to omezíte na jediný snímek, získáte klasický slider. Díky tomu se můžete osvobodit od starých, omezených slider modulů v Divi a vytvořit designově zcela nový prvek přesně podle svých potřeb.
Příklad 2: Týmový karusel (více snímků najednou)
Sami si určíte, kolik snímků bude vidět najednou a o kolik se jich posune při kliknutí na šipku. V této ukázce autoři vytvořili slider týmu pro stránku „O nás“, do kterého snadno zakomponovali i moduly pro sociální sítě.
Příklad 3: Dynamický karusel kategorií
Pomocí Loop Builderu v Divi 5 lze vytvořit karusel založený na taxonomiích (kategoriích). Příklad ukazuje slider, který automaticky prochází kategorie produktů ve WooCommerce. Název kategorie a náhledový obrázek se přitom generují dynamicky pro každý snímek ve smyčce.
Příklad 4: Jídelní lístek s kreativními přechody
V tomto případě jde o menu, které listuje seznamem nejprodávanějších jídel. Zajímavostí je zde využití designových nastavení – úpravou měřítka (scale) a průhlednosti (opacity) u neaktivních snímků vzniká při posouvání velmi působivý vizuální efekt.
Závěr
Modul Group Carousel je přesně tou funkcí, která ukazuje skutečný potenciál Divi 5. Doposud jsme pro jakýkoli složitější slider (třeba pro loga partnerů, reference nebo produkty) museli sahat po placených pluginech třetích stran, protože vestavěný Slider modul byl příliš rigidní.
S příchodem Group Carouselu a jeho propojením s Loop Builderem se tato nutnost vytrácí. Možnost „roztočit“ jakýkoli obsah, včetně dynamických dat z WooCommerce nebo blogu, přímo v jádru šablony, je obrovský krok vpřed. Zdá se, že Divi 5 nebude jen rychlejší, ale konečně nám umožní stavět weby s menším množstvím externích pluginů.
Prohlédněte si i další novinky v Divi 5
- Divi 5: Loop Builder – svoboda při výpisu obsahu
- Divi 5: Flexbox
- Divi 5: Hledat a Nahradit
- Divi 5: Rozšíření atributů
- Divi 5: Pokročilé jednotky (včetně CSS funkcí a proměnných)
- Divi 5: Design založený na presetech
- Divi 5: Proměnné v designu
- Divi 5: Vyhledávání a filtrování nastavení
- Divi 5: Správu atributů
- Divi 5: Skupiny modulů
- Divi 5: Přizpůsobitelné responzivní breakpointy
- Divi 5: Vnořené řádky
- Divi 5 (Public Alpha) k dispozici ke stažení
