Loop Grid v Elementoru je mocný nástroj, díky kterému si můžete vytvořit vlastní šablonu pro výpis příspěvků, produktů nebo vlastních typů obsahu (CPT). Už žádné omezené blogové bloky – s Loop Gridem si navrhnete přesně takový vzhled, jaký potřebujete.
V tomto návodu Vám krok za krokem ukáži, jak Loop Grid funguje a jak ho efektivně používat.
Co je Loop Grid a co umí?
Loop Grid je widget dostupný v Elementor Pro, který Vám umožní:
- Navrhnout šablonu jedné položky (např. příspěvku).
- Použít ji pro automatický výpis více položek (např. blog nebo e-shop).
- Zobrazit obsah podle kategorií, značek, autora atd.
- Použít dynamický obsah (obrázky, název, datum, výňatek).
- Stylovat responzivní grid layout.
Jak vytvořit Loop Grid – krok za krokem
Vytvořte si Loop Item Template
Nejdříve si vytvoříte šablonu a jak má vypadat jedna položka v gridu:
- Jděte do Šablony → Loop Item (v administraci WordPressu).
- Klikněte na „Vytvořit novou šablonu“.
- Vložte do layoutu prvky jako:
- Obrázek příspěvku.
- Nadpis (dynamický název).
- Meta informace (datum, autor).
- Výňatek / excerpt.
- Tlačítko „číst více“ nebo odkaz.
4. Uložte šablonu.
Tip: Používejte dynamické tagy – tím zajistíte, že se data budou načítat z každého příspěvku automaticky.
Použijte widget Loop Grid
- Otevřete si stránku nebo šablonu, kde chcete grid zobrazit.
- Přidejte widget „Loop Grid“ (v Elementoru).
- V nastavení vyberte šablonu, kterou jste vytvořili jako Loop Item.
- Nastavte počet sloupců, počet příspěvků, stránkování apod.
- Pomocí Query (dotazu) vyfiltrujte, co se má zobrazit – například:
- Kategorie: Blog.
- Post Type: Produkty.
- Autor: Ty sám(a).
- Tagy, štítky apod.
Design a doladění
- Přizpůsobte vzhled gridu (rozestupy, ohraničení, stíny…).
- Zkontrolujte mobilní zobrazení.
- Přidejte hover efekty, animace nebo vlastní CSS.
Kdy použít Loop Grid?
- Blog s vlastním vzhledem článků.
- Výpis produktů v e-shopu.
- Portfolia a katalogy.
- Dynamické seznamy (např. reference, události, recepty…).
Co potřebujete?
Elementor Pro (Loop Grid není ve free verzi).
WordPress s aktivním obsahem (např. příspěvky nebo WooCommerce produkty).
Trochu času na nastavení šablony.
Shrnutí
Loop Grid v Elementoru Vám dává obrovskou kontrolu nad tím, jak vypadají Vaše výpisy obsahu. Ať už chcete zobrazit články, produkty nebo vlastní typy obsahu, s tímto nástrojem je to možné rychle, vizuálně a bez kódování.
