Začnite tu

Styling

Začnime so štylizáciou šablóny.

Farby

Šablóna Web3 X je vytvorená pomocou vzorkovníkov farieb, čo znamená, že môžete ľahko upraviť vzorník farieb, ktorý sa aktualizuje na celom webe.

Aby ste to mohli urobiť, stačí prejsť na kartu Štýl v pravom bočnom paneli, potom prejsť na položku Farby v časti Typografia a po kliknutí na farbu budete môcť zobraziť všetky farebné vzorky a upraviť ich tak, aby sa aktualizovali na celom webe na akúkoľvek potrebnú farbu.

Fonty

Šablóna Web3 X používa jedno jediné písmo na celej strane a je nastavené vo výberovom okne Telo (všetky stránky ), čo znamená, že môžete ľahko aktualizovať písmo na celom webe jedným kliknutím.

Na ľubovoľnej stránke kliknite na oranžovú možnosť výberu v pravom hornom rohu karty Štýl a potom vyberte položku Telo (všetky stránky). Po tomto kroku môžete prejsť do časti Typografia nižšie a zmeniť písmo na ľubovoľné písmo pre vašu obchodnú značku.

V prípade, že potrebujete vlastné alebo prémiové písmo, ktoré nie je k dispozícii v službe Webflow, môžete vždy prejsť do časti Nastavenia projektu > Písma a budete môcť nahrať vlastné písma alebo pripojiť svoje konto Adobe Fonts.

Grafika a ikony

Niektoré ikony alebo grafika v šablóne sú normálne obrázky/grafika, takže si všimnete, že pri aktualizácii všetkých farieb budú mať stále farbu šablóny.

Stáva sa to preto, lebo táto grafika sú obrázky (PNG, JPG, SVG atď.), takže aktualizácia CSS (štýlovania) Webflow ich neovplyvní. Ak by ste chceli túto grafiku znovu použiť, môžete si ju vždy stiahnuť a upraviť pomocou ľubovoľného softvéru na navrhovanie (t. j. Photoshop, Illustrator, Sketch, Figma atď.) alebo priamo nahrať vlastné obrázky/grafiku, ktoré zodpovedajú vašej značke.

Statické stránky

Statický obsah je všetok obsah, ktorý nie je založený na systéme CMS, čo znamená, že nie je dynamický (ako napríklad príspevok v blogu).

Všetok tento obsah môžete ľahko identifikovať, pretože je v ľavom bočnom paneli navigátora zobrazený sivou farbou a po kliknutí alebo prejdení myšou sa zobrazí modrý rám.

Ak chcete upraviť tento typ obsahu, stačí naň dvakrát kliknúť a budete môcť priamo písať priamo tam.

Dynamický obsah (CMS)

Dynamický obsah je všetok obsah, ktorý je dynamický a bude automaticky generovaný na základe obsahu pridaného v časti CMS v ľavom bočnom paneli (hneď pod ikonou Stránky).

Toto všetko môžete ľahko identifikovať, pretože v ľavom bočnom paneli navigátora sa zobrazuje ako fialová farba a po kliknutí alebo prejdení myšou sa zobrazí fialový okraj.

Tento obsah by sa mal aktualizovať priamo v sekcii CMS. To vám má veľmi uľahčiť jeho aktualizáciu, pretože je veľmi pravdepodobné, že ho bude potrebné neustále aktualizovať (Napríklad pridanie nového príspevku na blog).

Ak chcete upraviť celú automaticky vygenerovanú stránku CMS (napríklad príspevok na blogu), nájdete ju na úpravu v spodnej časti všetkých stránok v časti Stránky v ľavom bočnom paneli.

Produkty (elektronický obchod)

Produkty alebo obsah elektronického obchodu fungujú podobne ako dynamický obsah CMS, avšak sú zamerané výlučne na produkty elektronického obchodu.

Obsah elektronického obchodu môžete identifikovať podobným spôsobom ako obsah CMS, pretože je tiež zobrazený fialovou farbou v ľavom bočnom paneli navigátora, ako aj s fialovým rámčekom, keď naň kliknete alebo naň prejdete myšou.

Tento obsah by sa mal aktualizovať priamo na karte elektronického obchodu v ľavom bočnom paneli. Má vám to veľmi uľahčiť jeho aktualizáciu, pretože je veľmi pravdepodobné, že ho bude potrebné neustále aktualizovať (Napríklad zmena ceny výrobku alebo pridanie ďalších skladových zásob).

Ak chcete upraviť automaticky vygenerovanú stránku elektronického obchodu s produktmi, nájdete túto stránku na úpravu takmer v spodnej časti všetkých stránok hneď nad stránkami kolekcie CMS.

Užitočné poznámky

Okrem hlavného základného vysvetlenia, ktoré sme uviedli vyššie, sa tu podelíme o niekoľko tipov a návodov, ktoré pochádzajú z najčastejších otázok, ktoré dostávame.

Interakcie

Ak chcete upraviť akúkoľvek interakciu šablóny (napr. odstrániť efekt vzhľadu), môžete ľahko identifikovať prvky, ktoré majú interakcie, pretože majú malú ikonu interakcie (malý hrom) v ľavom bočnom paneli navigátora.

Ak kliknete na túto malú ikonu Interakcie, otvorí sa pravý bočný panel Interakcie pre tento prvok, kde môžete interakciu upraviť.

Zobrazenie na mobile alebo tablete

Pri každej zmene (napríklad pri vytváraní nového dizajnu sekcie) je dobré prejsť do hornej navigácie Viewport a pozrieť sa, ako vyzerá na tabletoch a mobilných zariadeniach.

Ak upravujete iba časť šablóny s aktualizovaným textom alebo obrázkami a nevymazávate žiadnu triedu šablóny, nemalo by to byť potrebné, ak však šablónu upravujete hlbšie, upravujete triedy alebo vytvárate nové časti, je vždy dobré neustále upravovať zobrazenia pre mobilné zariadenia a tablety, aby ste sa uistili, že všetko vyzerá perfektne.

Úprava meta názvu, popisu a odporúčaného obrázka

Ak by ste chceli prispôsobiť názov, opis a obrázok, ktorý sa zobrazí pri zdieľaní vašej webovej stránky na akomkoľvek mieste (napr. na Facebooku, Twitteri atď.), môžete jednoducho prejsť do časti Stránky v ľavom bočnom paneli, kliknúť na malú ikonu Nastavenia stránky, ktorú chcete prispôsobiť, a všetky tieto nastavenia sa zobrazia.

Upozorňujeme, že je dôležité zmeniť to na základe stránky.

Zálohovanie

Ak sa niečo pokazí, napríklad ak sa vám nepáči, kam webová stránka smeruje, ak ste odstránili niektoré kritické triedy, ktoré boli potrebné na to, aby šablóna vyzerala pekne, alebo ak sa len chcete z akéhokoľvek dôvodu vrátiť k predchádzajúcej verzii, vždy môžete prejsť do časti Zálohy.

Nájdete ju v časti Nastavenia v ľavom bočnom paneli a potom si môžete prezrieť všetky automatické alebo manuálne zálohy. Obnovenie starej zálohy je vzdialené len jedno kliknutie.