Tesztelje a vektoros címkék sablonjait CSS változókkal

Mik azok a vektoros sablonok, és milyen előnyeik vannak

Ezek a sablonok nagy részben beállíthatók az ún. natív CSS változók segítségével, amelyek lehetővé teszik a kódolóknak a megjelenés módosítását vagy javítását további, szükségtelen kódírás nélkül.

Hogyan teszteljük a funkciót

A sablonokban lévő változók bekapcsolásához szükséges az adminisztrációban (Megjelenés és tartalom > Szerkesztő) hozzáadni a kódot, amely átkapcsolja a sablont:

Most frissítjük az oldalt, és megnézzük a tulajdonságokat, például a címsornál, ahol a következő kód látható:

Ezeket a változókat nagyon könnyen lehet igény szerint módosítani - a Pobo Page Builderben létrehozunk egy új CSS módosítást, és kódként beillesztjük a következőt:

Mit lehet változókkal módosítani

A változókkal meglehetősen részletesen módosítható a tipográfia címsorok, felsorolások, bekezdések stb. esetén (szövegméret, sorköz, szín, behúzás, ...) ugyanúgy, mint widgeteknél. Az összetettebb widgeteknél a lekerekítések, árnyékok, színek stb. is módosíthatók.

A változók teljes listáját megtalálja az oldalon https://github.com/pobo-builder/widget-asset/blob/master/src/utils/native-variable.scss.

Konkrét példa

A vektoros sablont bemutatjuk az első e-shopnál www.ksd-art.cz, ahol a következő változókat használják:

Ezzel az egyszerű kóddal a megjelenést az adott e-shophoz lehet igazítani.

Megjelenés bemutatása