#############
Content grid
#############
Pro strukturovaný obsah je možné definovat schéma, podle kterého se zobrazí ovládací prvky v administrace. Lze tak vytvořit rozhraní pro zadávání obsahu, který by administrace standardně nepodporovala.
Funkce je určená na vzhledové prvky - například vypsání textů na landing page na specifických pozicích spolu s obrázky. Obsah není dostupný mimo šablonu, takže funkce není vhodná na obsha, který bude potřeba například ve feedech, při tisku štítků a podobně.
=================
Definice schématu
=================
Schéma je XML soubor ve složce **content-grid** v šabloně. Podle názvu souboru se následně obsah v šabloně vypisuje (např na obsah definovaný souborem **content-grid/product-cta.xml** se v šabloně použije **{{ product.contentGrid('product-cta') }}**)
V editoru lze importovat schéma https://tpldoc.simplia.cz/xsd/content-grid.xsd, aby mohl napovídat možné hodnoty a kontrolovat validní syntax.
Definovaná struktura nemá přímo vliv na funkčnost a je hlavně pro lepší orientaci v administraci. Rozložení by mělo ideálně přibližně odpovídat výslednému zobrazení v eshopu.
.. code-block:: xml
Obsahová mřížka
1
false
full_page
|
===============
Režim zobrazení
===============
Nastavení tagu *mode* lze přepnout mezi dvěma způsoby zobrazení:
- *full_page*: V administraci se zobrazí roletka "Rozložení" na výběr typové stránky. Po výběru roletka mizí a nezobrazují se ani žádná tlačítka pro přidání další contentGrid. Ideální na typové stránky jako třeba stránka *O nás* apod.
- *part*: Předpokládá se použití i více různých contentGrid na jedné stránce. Typicky contentGrid tvoří nějaký jeden prvek obsahu, ale nepřebírá zbytek stránky.
=================
Použití v šabloně
=================
U podporovaných objektů se obsah načítá vždy metodou *contentGrid* a názvem souboru s definicí. Pokud pro daný objekt nebyl definován, vrací se *null*. Struktura vrácených odpovídá struktuře z XML definice. Všechny hodnoty nemusí být vyplněné.
.. code-block:: html+twig
{% if product.contentGrid('product-cta') }
{{ product.contentGrid('product-cta').header.headline }}
{% for content in product.contentGrid('product-cta').content2 %}
{{ content.text }}
{% endfor %}
{% endif %}
.. code-block:: html+twig
{% if this.contentGrid('banner-cta') }
{{ this.contentGrid('banner-cta').header.headline }}
{% for content in this.contentGrid('banner-cta').content2 %}
{{ content.text }}
{% endfor %}
{% endif %}