Stabilní třídy a ID a doporučovaná práce s nimi

Stabilní třídy a ID

Na http://www.shoptet.cz/action/ShoptetFrontendDevelopers/getCrucialIdsAndClasses/ v objektu payload najdete seznam ID a tříd, které považujeme za stabilní a doporučujeme je používat pro stylování.

Pro zobrazení tohoto JSON souboru v čitelném formátu můžete použít některou z online služeb, např. https://jsonformatter.curiousconcept.com/ nebo doplněk do prolížeče Chrome JSONView

Do budoucna by se tato ID a třídy neměly měnit vůbec, nebo pouze minimálně – a pokud k nějaké změně výjimečně dojde, budete s dostatečným přestihem informováni pomocí tohoto blogu. Seznam těchto ID a tříd není konečný a bude průběžně přibývat.

Informace jsou rozděleny na část týkající se ID a tříd, část s třídami se pak dělí na jednotlivé elementy, viz příklad níže.

{
    "classes": {
        "uniqueClass",
        "uniqueClass%variableParameter%",
        [
            "elementClassA",
            "elementClassB"
        ]
    }
}

Prvek z výše uvedeného příkladu může mít obě třídy uniqueClass i uniqueClass%variableParameter%, ale pouze jednu ze tříd vyjmenovaných v poli, tj. buď elementClassA, nebo elementClassB.

Doporučované použití selektorů

Chybný způsob

.content-wrapper:nth-of-type(5) { background-color: red; }

Na prvek míříme přes strukturu DOMu, která se může změnit, takovéto selektory jsou také pro prohlížeč “drahé”.

Správný způsob

.homepage-box.before-carousel { background-color: red; }

Správně adresovaným selektorem máme jistotu, že ani případná změna DOMu nezpůsobí nefunkčnost selektoru. Doporučujeme používt v co největší míře selektory z výše uvedeného seznamu.

Post navigation