Informace o designu v kódu stránky

Při vytváření úprav frontendu pomocí vkládaných kódů v administraci nebo doplňky může být užitečné vědět, jaké barvy, fonty, obrázky a rozvržení je aktuálně v eshopu nastaveno. Informace obsahuje javascriptový objekt shoptet.design v každé stránce.

shoptet.design = {
    "template": {
        "name": "Classic",
        "colorVariant": "11-one"
    },
    "layout": {
        "homepage": "catalog4",
        "subPage": "catalog3",
        "productDetail": "catalog4"
    },
    "colorScheme": {
        "conversionColor": "#468c98",
        "conversionColorHover": "#3b7580",
        "color1": "#239ceb",
        "color2": "#1997e5",
        "color3": "#ffc807",
        "color4": "#ffbb00"
    },
    "fonts": {
        "heading": "Exo 2",
        "text": "Source Sans Pro"
    },
    "header": {
        "backgroundImage": null,
        "image": null,
        "logo": "https:\/\/classic.shoptet.czuser\/logos\/logo-2.png"
    },
    "background": {
        "enabled": false,
        "color": null,
        "image": null
    }
};

Následuje vysvětlení jedntlivých položek. Použití některých nebo konkrétní možné hodnoty mohou být závislé na použité šabloně.

Sekce Položka Popis
template
name Název šablony (Swing, Jazz, Funk, Pop, Rock, Soul, Techno, Echo, Tango, Waltz, Classic, Step, Custom)
colorVariant Kódové označení konkrétní barevné varianty šablony
layout Rozvržení stránky
homepage Domovská stránka
subPage Výpis kategorie
productDetail Detail produktu
colorScheme Základní barevné schéma
conversionColor Konverzní barva
conversionColorHover Konverzní barva po najetí myši
color1 Primární barva eshopu
color2 Primární barva eshopu po najetí
color3 Sekundární barva (může být null – není u všech šablon)
color4 Sekundární barva po najetí (může být null – není u všech šablon)
fonts Použité fonty
heading Font pro nadpis
text Font pro texty
header Vlastnosti hlavičky
backgroundImage Obrázek na pozadí hlavičky
image Obrázek v hlavičce
logo Logo eshopu v hlavičce
background Pozadí stránek
enabled Zda je pozadí nastavováno
color.enabled Barva pozadí – zda je povolena
color.color Barva pozadí
image Obrázek na pozadí
image.url URL obrázku
image.attachment Připevnění – fixed, scroll
image.position Umístění – center, tile
Facebook
Twitter