Nápověda k e-shop řešení ShopSystem.
Efektivní e-shop systém pro internetové obchodování bez kompromisů.

Design shopu - neresponzivní šablony

V záložce Design shopu se dá nastavit pozadí e-shopu a hlavička nad menu. U statických šablon Modern, Classic a Style je šířka e-shop stránky bez pozadí 990px. Pokud je šířka prohlížeče větší, zobrazí se za stránkou pozadí. Hlavička se přizpůsobuje šířce prohlížeče, je tedy vhodné po jejím nastavení zkontrolovat zobrazení při různé šířce prohlížeče (např. na monitoru, notebooku, tabletu a mobilu).

=> Postup, jak nahrát obrázky. =>

Pozadí

Doporučovaný rozměr pozadí je alespoň 1 920px x 1080px (FullHD), záleží ale i na charakteru a nastavení pozadí. Pozadí se zobrazuje pouze pokud je šířka prohlížeče větší než 990px. U šablony Style je pozadí vidět i pod záhlavím (lišta s menu, košík i stránka jsou umístěny nad pozadím jako jednotlivé boxy).

  • Obrázek pozadí: Je důležitá dostatečná kvalita zdrojového obrázku v rozlišení alespoň 1 920px x 1080px (FullHD). Můžete nahrát fotografii nebo grafiku.
  • Umístění pozadí / Zobrazit pozadí
    • Pevné/Responzivní: Šířka obrázku pozadí se přizpůsobuje šířce prohlížeče. Při rolování stránky pozadí zůstává statické (Obsah stránky plave nad pozadím).
    • Pevné/Pevná šíře: Obrázek pozadí je zobrazen v originálním rozlišení a horizontálně na středu. Při rolování stránky pozadí zůstává statické (Obsah stránky plave nad pozadím).
    • Posuvné/Responzivní: Šířka obrázku pozadí se přizpůsobuje šířce stránky a při rolování stránky se roluje i pozadí. Pozor! Obrázek musí být dostatečně vysoký nebo musí přecházet plynule do barvy pozadí.
    • Posuvné/Pevná šíře: Obrázek pozadí je zobrazen v originálním rozlišení, horizontálně na středu a svázán s horním okrajem stránky, při rolování stránky se tedy roluje i pozadí. Pozor! Obrázek musí být dostatečně vysoký nebo musí přecházet plynule do barvy pozadí.
  • Barva pozadí: Barvu pozadí nastavte i v případě, že jste nahráli obrázek pro případ monitoru většího než rozměr pozadí. 
šablona Modern a Classic šablona Style

Pár pravidel pro pozadí:

  • dostatečná kvalita zdrojových obrázků
  • rozlišení minimálně 1 920px x 1080px (FullHD)
  • je dobré mít spodní a boční okraje pozadí do ztracena (do barvy pozadí), aby nebyl vidět přechod mezi obrázkem pozadí a barvou pozadí u delších stránek či u větších monitorů.

Záhlaví

Záhlaví tvoří Koláž, Banner, Logo a Slogan. Jednotlivé prvky záhlaví se skládají přes sebe do vrstev (banner se zobrazí nad koláží, logo se zobrazí nad bannerem i koláží, slogan se zobrazí nad logem, bannerem i koláží). V mobilním zobrazení se záhlaví nezobrazuje.

Obrázky můžete nahrát v běžných formátech pro obrázky. Pěkně vypadá, když pro banner / logo použijete průhledné pozadí, což hezky spojí hranice mezi jednotlivými prvky.

Příklad, jak lze poskládat záhlaví.

1. Koláž: Rozměry koláže se liší pro každou šablonu. U šablon Modern a Classic by měla koláž vyplňovat celé záhlaví nebo mít pěkný přechod do bílé barvy. U šablony Style se pod záhlavím zobrazuje pozadí, které můžete využít místo koláže. 

Doporučené rozměry koláže jsou pro jednotlivé šablony:

  • Modern: 770px x 185px

  • Classic: 970px x 180px

  • Style: 970px x 170/185px.

2. Banner: Banner překryje koláž. V našem příkladu jsme místo banneru použili obrázek dítěte s průhledným pozadím ve formátu png.

3. Logo: Logo překryje banner i koláž. U loga se také hodí průhledné pozadí. Logo funguje jako proklik na homepage.

4. Slogan: Slogan je text, u kterého můžete zvolit barvu.

Pozicování - Umístění prvku do správné polohy

V náhledu stránky můžete myší táhnout obrázek na správné místo. Někdy však může být obtížné tímto způsobem umístit obrázek na pixely přesně. Proto můžete k přesnému umístění použít pozicování, kde šipka posunuje obrázek o 1 pixel a dvojšipka o 10px.