Šestý díl věnujeme úpravám detailu zboží a tvorbě variant. Webgarden nám pro tyto účely dovoluje využít celou nabídku multimediálních prvků a se zbožím tedy můžeme zacházet stejně jako se článkem nebo jiným dokumentem.

Po přihlášení na Webgarden.cz se proklikáme do detailu hrnečku S kočkou v rubrice Obsah – Produkty – Keramika. Detail neobsahuje zatím žádné dodatečné informace a vypadá stroze. Po funkční stránce to nevadí, ale dodatečné informace mohou navnadit návštěvníka ke koupi. Nehledě na to, že informace o zboží mají velký vliv na SEO (optimalizaci pro vyhledávače).

Do detailu zboží v části „Obsah“ vložíme prvek Odstavec textu. Do textového pole napíšeme poutavý popis zboží. Pokud je popis delší, je dobré jej rozdělit do několika prvků Odstavec textu.

Pokud chceme některý z odstavců zvýraznit, můžeme použít předdefinovaný vzor pro zvýraznění. Klikneme na editační ikonku odstavce, přepneme na kartu „Rozšířené“ a na řádku Zvýraznění zvolíme např. „Vzor 2“. Uložíme.

Pod poslední text přidáme prvek Obrázek a nahrajeme do něj alternativní fotografie produktu. Obrázky v našem příkladu přidáme tři. Jelikož je obsah dokumentů na Webgarden obvykle dělen do čtyř myšlených sloupců, jsou tyto obrázky řazeny vedle sebe. Webgarden je také nastaven tak, že pokud jsou obrázky řazeny do 4 a více sloupců, je pro náhled použita zmenšenina, které je sice datově malá a rychle se načítá, ale může mít sníženou kvalitu.

Abychom docílili zarovnání obrázků s textem a použití kvalitních zmenšenin, změníme sazbu celého zboží ze 4 na 3 sloupce. Klikneme na horní editační ikonku – tu, která náleží k samotné stránce s prvky. V dialogu změníme počet buněk (tedy sloupců) na 3 a uložíme. Celo-šířkové prvky – Odstavce textu budou stále zabírat celou šířku, ale obrázky se poměrně roztáhnou.

Stejného efektu můžeme docílit také zanořením prvku Sloupce, ukážeme si to v následujících krocích. Nejprve ale vrátíme sazbu celého Zboží zpět na 4 sloupce. Poté klikneme na drobnou ikonku „Přidat položku“ přímo ve vyskakovacím menu u první fotografie. Tímto postupem přidáme prvek do toku před tuto fotografii. Vybereme prvek Sloupec.

Sloupci nastavíme hodnoty na 4 – pro šířku a 3 – pro počet buněk/sloupců. Uložíme.

Nad fotografiemi se nám objeví nové pozice, které zde vytváří prvek Sloupec. Mohlo by nám připadat zavádějící, že to přece není sloupec, ale řádek. Z principu ale tento prvek umožňuje řadit prvky do sloupcové sazby, ale zde je použit zatím jen jeden. Druhou funkcí prvku Sloupec je možnost změnit pro množinu dalších prvků sazbu nebo je společně zvýraznit nějakým vzorem.

Nyní myší přetaháme postupně fotografie do prostoru sloupce. Jelikož sloupec má nastavenu sazbu 3, tak se nám fotografie rovnou relativně zvětší.

Nakonec ještě posledně vloženému sloupci (tomu, co obaluje fotografie) nastavíme barevné zvýraznění. Klikneme na jeho editační ikonku, zvolíme Zvýraznění „Vzor 1“ a uložíme.

Nyní si celý obsah rozdělíme na dva sloupce a vpravo od popisu hrníčku vložíme anketu. Nejprve – již známým postupem – vložíme před první odstavec nový prvek Sloupec. Nastavíme mu šířku 3 (sazba celého zboží je 4, takže Sloupec bude zabírat 3/4) a počet buněk 3.

Do nového sloupce myší postupně přetaháme všechny ostatní prvky.

Vpravo pak přidáme druhý sloupec. Tentokrát nastavíme oba parametry – šířku i počet buněk na 4.

V rámci pravého úzkého sloupce vytvoříme nový Titulek s textem „Výhody“.

Pod něj přidáme prvek Odstavec textu s výčtem výhod zboží. Na třetí místo zařadíme prvek Anketa.

U ankety vyplníme titulní Otázku a varianty odpovědí.

Při rozdělení sloupců 1:3 je pravý sloupec velmi úzký. Ukážeme si, jak změnit poměr na 1:2. Nejprve vyvoláme editační Dialog levému sloupci kliknutím na příslušnou ikonku. Změníme jeho šířku z hodnoty 3 na 2. Nyní již máme sloupce ve správném poměru, ale jelikož je celková sazba zboží 4, tak nám prvky vyplňují pouze první tři sloupce.

Vyvoláme tedy editační okénku základního rámce stránky a změníme sazbu – počet buněk ze 4 na 3. Po uložení máme popis Zboží s dělením na tři pole, přičemž první dvě obsazuje jeden sloupec a třetí pole druhý sloupec.

Webgarden umí zacházet s neomezeným množstvím variant zboží. To se nám hodí v případě, že máme produkt například v několika barevných provedeních nebo velikostech. V případě, že potřebujeme evidovat dva různé druhy variant, například velikost a barvu, musíme si pomoci tak, že produkt rozdělíme podle jedné varianty do samostatných Zboží a teprve v jejich rámci použijeme druhou variantu.

V detailu zboží hrneček S kočkou klikneme na tlačítko „Přidat variantu“.

U vzniknuvší varianty vyplníme cenu, název, skladové zásoby, nahrajeme obrázek a uložíme.

U variant můžeme vyplnit také rozlišovací kód. To je vhodné udělat, jelikož tento kód nám může usnadnit identifikaci v případné objednávce.

Stále častěji najdeme na eshopech pod zbožím prostor pro vyjádření návštěvníků. Pokud chceme pod zboží diskuzi přidat, posuneme se v administraci v detailu zboží níže a v části Prostor pro komentáře stiskneme tlačítko Přidat. Na webu se nám v zápatí zboží objeví proklik do nové diskuze.

Na webu můžeme pod zbožím prokliknout do detailu diskuze a zde položit dotaz.

Administrátor (nebo kdokoliv jiný) může pak na dotaz reagovat.

Aby měl administrátor přehled nad diskuzemi, umístíme do nějaké skryté rubriky (například rubriky viditelné pouze v administraci) prvek Nové příspěvky. V něm pak uvidíme agregované poslední položené dotazy napříč diskuzemi.

Nakonec si zkusíme přeskupit multimediální popis zboží. Nad prvkem Sloupec, obalujícím obrázky, vytvoříme Titulek „Dostupné varianty“.

Nad druhou fotografií vytvoříme další zanořený Sloupec s šířkou 2 a počtem buněk 1.

Do tohoto zanořeného sloupce vložíme Titulek s názvem první varianty.

Pod titulek vložíme Odstavec textu např. s cenou varianty.

Obdobně vytvoříme Sloupce ještě u dvou zbylých fotografií a vyplníme je titulkem a textem.

Kromě diskuze můžeme ke zboží umístit také kontaktní formulář. Pokud skrze něj zákazník odešle dotaz, obdržíme ho emailem. Pod přehled variant přidáme prvek Titulek s textem „Máte dotaz ke zboží?“.

Pod titulek přidáme prvek Formulář. Vymažeme název formuláře, překontrolujeme email a nakonfigurujeme políčka formuláře. Obvykle budeme potřebovat políčko pro email a pro vlastní text dotazu.

Tento návod ilustroval některé možnosti formátování popisu zboží, ale uživatelé jich mají k dispozici více – např. videa nebo oblíbené video-návody či video-recenze z YouTube, doplňující dokumenty ke stažení a nepřeberné množství kombinací multimediálních prvků. Další informace k formátování mohou uživatelé nalézt v nápovědě k Obsahu.