Obrázkový odkaz na kategorii

Uživatelský manuál

Zde se dozvíte, jak pracovat s nainstalovaným rozšířením Obrázkový odkaz na kategorii pro Magento 2 od GetReady.

Účel modulu

Modul 'Obrázkový odkaz na kategorii' vám umožní snadno vytvořit obrázkový odkaz na kategorii. Pro obrázkový odkaz je použit obrázek, který je u kategorie nastaven pomocí standardní Magento funkcionality.

Modul 'Obrázkový odkaz na kategorii' umožňuje připravit odkazy dvou typů:

  • šablona 'figure' - obrázek a pod ním text ('pod ním' rozuměno umístění v kódu dokumentu)
  • šablona 'background' - obrázek a na něm text (obrázek ve vrstvě, která je pod textem)

Předpoklad použití

Máme Magento 2 obchod a v něm kategorie.
U kategorií, na které chceme odkazovat, musí být nastaven obrázek.
Obrázek kategorie je standardní Magento funkcionalita. Obrázek ke kategorii nastavíme takto:

Jak přiřadit obrázek ke kategorii?

1) Přihlásíme se do backendu 2) Klikneme na "Katalog", poté na "Kategorie" 3) Zvolíme kategorii, které chceme přiřadit obrázek. Vidíme něco takového:
kategorie-hrusky.png
4) Klikneme na panel 'Obsah' a nahrajeme obrázek kategorie.
kategorie2.png

5) Vidíme něco takového: kategorie3.png
6) Klikneme na 'Uložit'
kategorie4.png

Vytvoření Obrázkového odkazu na kategorii

A) Pomocí widgetu v CMS (bloku nebo stránce)
'OBSAH > Stránky' nebo 'OBSAH > Bloky'

do vybrané stránky (nebo bloku) vložíme widget 'Obrázkový odkaz na kategorii' cms1.png

nastavení widgetu: cms2.png

  • Typ widgetu: Obrázkový odkaz na kategorii
  • Šablona: zvolit 'figure' nebo 'background'
  • Kategorie: zvolit

Uložit, cache flush, a na frontendu je vidět výsledek. Výsledný vzhled je možné dle potřeby doladit css stylováním.

B) Pomocí widgetu na libovolné místo v obchodu. 'OBSAH > Widgety'

  • image1.png

  • zvolte stránku a kontejner (místo ve stránce)

  • zvolte šablonu
    image2.png

  • zvolte kategorii (Nemá-li vybraná kategorie nastavený obrázek, použije se placeholder.)
    image3.png

Uložit, cache flush, a na frontendu je vidět výsledek. Výsledný vzhled je možné dle potřeby doladit css stylováním.

Výsledek na frontendu

  • šablona 'figure'
    frontend-figure.png

  • šablona 'background'
    frontend-background.png

  • kategorie nemá obrázek - použit placeholder (šablona figure) frontend-figure-placeholder.png

  • kategorie nemá obrázek - použit placeholder (šablona background) frontend-background-placeholder.png

Stylování

Widget (obrázkový odkaz) zabere 100% šířky. V předchozím případě je velikost odkazu určena takto:

widget je obalen značkou <div> :   

<div style="max-width: 240px;">{{widget ......}}</div>

Možné využití

Příklad:
Na homepage chceme mřížku tří vybraných kategorií. V CMS si připravíme HTML/CSS pro tři bloky v jednom řádku, do každého bloku dáme pomocí widgetu jeden widget 'Obrázkový odkaz na kategorii'.

Související nastavení

Jakmile kategoriím nastavíme obrázky standardní Magento funkcionalitou (viz výše), budou se tyto obrázky automaticky zobrazovat na stránce přísulšné kategorie.

Pokud nám toto chování nevyhovuje, můžeme zobrazení obrázku kategorie na stránce kategorie zakázat úpravou rozvržení (layoutu), nejlépe v v custom tématu.

soubor: Magento_Catalog/layout/catalog_category_view.xml  

úprava: <referenceBlock name="category.image" remove="true"/>

Po této úpravě obrázek nebude vidět na stránce kategorie, ale pro obrázkový odkaz na kategorii jej bude možné použít.