Úprava dizajnu pomocou vlastného CSS

Každá webová stránka je vyskladaná z HTML blokov, tzv. elementov, pričom týmto elementom je nastavenú určitý vzhľad (farba a veľkosť písma, pozadie, odsadenie, ...), ktorý je možné si upraviť pomocou CSS kódov. Požadované CSS kódy je možné vkladať v administrácii https://admin.wexbo.com alebo (http://admin.vasadomena.sk) do sekcie Nastavenia / Special CSS.

Informácie z nápovedy sekcie "Special CSS"

Kaskádové štýly alebo CSS je všeobecné rozšírenie HTML. Je to jednoduchý mechanizmus na vizuálne formátovanie Vašich stránok alebo ich častí. CSS dokáže rozšíriť, zmenšiť, zaobliť, umiestniť časti stránok alebo zmeniť ich farbu či štýl atď.

Pokročilí užívatelia si tak môžu celý dizajn, ktorý bol vytvorený v AdminSmart, naštýlovať ešte pomocou vlastného CSS. Možno si teda dizajn webu prispôsobiť tak, aby ešte viac vyhovoval Vašim požiadavkám a nárokom.

Po úprave odporúčame pre aplikovanie Special CSS obnoviť stránky v prehliadači, najčastejšie klávesou F5 alebo CTRL+F5. Viac informácii v nápovede Po zmene obrázku sa mi stále zobrazuje pôvodný obrázok

V prípade, že ste menili pozíciu jednotlivých CSS položiek, je nutné kliknúť na tlačítko , aby sa CSS súbor opätovne vygeneroval s novými pozíciami CSS položiek.

Z dôvodu, že pracovníci na technickej podpore nie sú školený v kódovaní CSS, technickú podporu pre CSS štýlovanie, resp. pre sekciu Nastavenia / Special CSS neposkytujeme. V prípade, že nemáte znalosti CSS kódovania neodporúčame do danej sekcie vkladať či upravovať CSS kódy, keďže to môže mať za následok nekorektné zobrazenie stránok. Pre špecifickú úpravu vzhľadu stránok prostredníctvom CSS je tak nutná znalosť daného štýlovania.

CSS Selectory

Každý CSS kód sa skladá z tzv. "selectora" kde je uvedená adresa alebo identifikátor HTML elementu, ktorý chcete upraviť a z jednotlivých hodnôt nastavenia vzhľadu, ktoré sú uvedené v zložených zátvorkách hneď za selectorom. Napr.:

.vlastny_nazov_selectora { color: red; font-size: 10px; }

Selectorom, teda adresou konkrétneho elementu, môže byť samotný HTML TAG, HTML atribút ID (identifikátor) alebo HTML atribút CLASS (trieda). V nižšie uvedenom príklade má HTML TAG "a" v atribúte ID nastavenú hodnotu "moje_id" a v atribúte CLASS "moj_class".

<a href="https://wexbo.com/contact/" id="moje_id" class="moj_class">Kontakt</a>

Trieda (class)

Napriek tomu, že samotná stránka už obsahuje mnoho selectorov, na ktoré je možné adresovať a meniť tak vzhľad elementov, systém umožňuje označovať aj konkrétne položky (moduly, menu položky, články, kategórie, produkty) práve vlastným atribútom CLASS (trieda) napr. "zvyraznena_menu_polozka", pričom následne je možné na vybrané elementy zobrazujúce sa na stránkach odkazovať prostredníctvom CSS kódu a meniť ich vzhľad.

Modul

Pre box modulu nastavujete v sekcii Doplnky / Moduly v úprave konkrétneho modulu v záložke Rozšírené nastavenia položka "Trieda (class)".

Článok

Pre elementy článkov (v zozname článkov a samotný detail článku) nastavujete v sekcii Články / Články v úprave konkrétneho článku (alebo po kliknutí na tlačítko Pridať článok) v otvorenom okne v záložke Rozšírené nastavenia položka "Trieda (class)".

Kategória

Pre element kategórie v zozname kategórií v sekcii Produkty / Kategórie v úprave konkrétnej menu položky (alebo po kliknutí na tlačítko Pridať kategóriu) v otvorenom okne v záložke Rozšírené nastavenia položka "Trieda (class)".

Produkt

Pre elementy produktu (v zozname produktov, samotný detail produktu, v zozname vybraného tovaru) v sekcii Produkty / Produkty v úprave konkrétneho produktu (alebo po kliknutí na tlačítko Pridať produkt v otvorenom okne v záložke Rozšírené položka "Trieda (class)".