Vzhľad stránky

V piatej položke hlavného menu "Vzhľad" nájdete všetky nastavenia súvisiace so správou vzhľadu vašej stránky.

Upozornenie: Všetky zmeny súvisiace so zmenou vzhľadu, (okrem úprav vykonaných funkciou Drag & Drop) vykonávané prostredníctvom ISWID menu sa až do uloženia prejavujú iba lokálne a to iba na stránke v administrácii. Zmeny pre návštevníkov stránky sa prejavia až po uložení a znovu načítaní stránky. V prípade, že zmeny neuložíte a zatvoríte ISWID menu, budú na stránke obnovené pôvodné nastavenia. 

Šírka a členenie stránky

V prvej položke s názvom "Šírka a členenie stránky" si nastavte šírku a členenie stránky ktoré najviac zodpovedá Vašim predstavám. Na výber máte z troch šírok: 732 pixelov (úzka) 918 pixelov (stredná) a 1068 pixelov (široká). Ak bude mať Vaša stránka bohatší obsah, zvoľte si širšiu stránku. Pri členení stránky Vám viac stĺpcov umožňuje lepšie rozdeliť obsah stránky. Ak plánujete využiť model e-shop, zvoľte si stránku rozdelenú na tri stĺpce. Zákazníci tak budú mať lepší prehľad o Vašom tovare, akciových produktoch alebo o nákupnom košíku. Šírku a členenie stránky môžete kedykoľvek zmeniť a už vložený obsah sa automaticky prispôsobí novému nastaveniu.

Téma (motív)

Tému (motív) si zvolíte cez druhú položku. Po zvolení kategórie sa Vám načítajú náhľady jednotlivých tém danej kategórie. Po zvolení náhľadu sa zvolená téma automaticky načíta. a jej zmenu okamžite vidíte na stránke Tlačidlom "Uložiť" potvrdíte vykonanie zmeny témy, tlačidlom "Reset" sa vrátite k pôvodným nastaveniam. Zvolená téma obsahuje obrázok použitý v hlavičke,  v hlavičke boxov, v päte stránky a obrázok efektu hlavičky. Aj v prípade, že máte zvolenú konkrétnu tému (motív) môžete vypnúť zobrazovanie každého obrázku z témy. Obrázok hlavičky vypnete v nastavení hlavičky, obrázok hlavičky boxu v nastavení boxu, obrázok v päte v nastavení päty.

Upozornenie: V prípade, že máte v nastavení hlavičky použitý vlastný obrázok, tak v tom prípade sa vám ani pri zmene témy nezmení obrázok hlavičky. Pre zmenu obrázku je treba nastavenie zmeniť v hlavičke na voľbu "Použiť obrázok z témy".

Farby

Na prvej záložke "Generátor" sa nachádza generátor farebných schém - MagicColor. Generátor vám na základe Vami zvolenej farby vygeneruje všetky zvyšné farby vašej stránky. Na záložke generátor nájdete nastavenia pre jednu, dve alebo tri farby. Nastavenie Vlastné je aktívna vždy keď sú farby upravované manuálne. V prípade nastavenia užívateľskej schémy nie je generátor prístupný. Pri tomto nastavení je možné iba manuálne nastavovanie farieb na záložke "Zvolená farebná schéma". V prípade, že chcete generovať schému, musíte si vybrať jedno z nastavení pre jednu, dve alebo tri farby. Po výbere módu generovania napríklad pre jednu farbu si kliknutím na farbu pozadia menu otvoríte farebnú paletu, v ktorej si vyberiete základnú farbu pozadia tlačítka menu a systém vygeneruje zvyšné farby v rovnakom odtieni ale odlišnej sýtosti. Posuvníkom "Farebná gradácia" môžete schému v rámci vybranej farby gradovať s väčším alebo menším kontrastom. Posun farebnosti v nastavení pre jednu farbu nie je prístupný. Pri nastavení generátoru na dve farby systém kombinuje vami vybranú farbu a druhú automaticky generovanú farbu. Posuvníkom farebnej gradácie je možná úprava kontrastu vybranej farby. Posuvník "Posun farebnosti" mení (posúva vpravo alebo vľavo) druhú automaticky dopočítavanú farbu, pričom pôvodne vybraná farba ostáva nezmenená. Pri nastavení  generátoru na tri farby systém generuje k Vami vybranej farbe ďalšie dve farby. Takisto môžete použiť gradáciu a posun farebnosti. Samozrejme ktorúkoľvek farbu vygenerovanú MagicColorom môžete manuálne zmeniť. Avšak po manuálnej úprave sa generátor prepne do režimu "Vlastné" a následné použitie generátoru na takto upravenú schému už nie je možné. V prípade, že prejdete z voľby "Vlastná" na akúkoľvek inú voľbu, generátor automaticky znovu vygeneruje schému zodpovedajúcu nastavenej základnej farbe pozadia menu a nastaveniu gradácie a posunu farebnosti.

Po nastavení farby menu si kliknutím na náhľad farby pozadia nastavíte aj farbu pozadia. Pri zvolení farby pozadia sa môže zmeniť aj základná a doplnková farba tak, aby bola na zvolenej farbe pozadia kontrastná.

Na druhej záložke "Zvolená farebná schéme" sa nachádzajú nastavenia farebných schém. Farebnú schému Vašej stránky tvorí 9 farieb. Týchto deväť farieb si definujete sami. Zvolíte si základnú farbu - je to farba, ktorou sú základné texty ako nadpisy alebo titulky, doplnkovú farbu - je farba ostatných textov na web stránke. Farbou pozadie stránky definujete najväčšiu farebnú plochu. Farba by mala byť kontrastná k zvolenej základnej a doplnkovej farbe. Zvyšných 6 farieb definuje ako bude vyzerať menu a ostatné tlačítka Vašej stránky. Pozadie menu je farba základného tlačítka v menu, písmo menu je farba písma na tomto tlačítku. Pozadie hover menu je pozadie tlačítka po prechode myšou nad tlačítkom, písmo hover menu je farba písma na tomto tlačítku. Pozadie hlavičky boxu je farba pozadia hlavičky boxu ako je napr. kontakt, akciový produkt, oznam a pod. Rovnakú farbu akú zvolíte pre hlavičku boxu bude mať aj tlačítko aktívneho menu. Farby je možné definovať jednotlivo manuálne. Pre zmenu farby stačí kliknúť na náhľad farby ktorú chcete editovať. Po vybratí farby ktorú chcete editovať si kliknutím do farebnej palety vyberiete farbu. Na jemné doladenie môžete použiť posuvníky. Kliknutím na tiahlo posuvníka ho označíte a môžete posúvať šípkami na klávesnici vodorovne alebo zvisle po jednej hodnote.

Upozornenie: V prípade, že máte v záložke "POZADIE" nastavený farebný prechod, môže byť v určitých prípadoch vygenerovaná farba nekontrastná. V takomto prípade upravte farby manuálne pre optimálny kontrast.

Na tretej záložke "Predvolené farebné schémy" nájdete už vytvorené a preddefinované  farebné schémy (aj vlastné farebné schémy), ktoré môžete použiť, prípadne si ich znovu upraviť podľa vlastných predstáv a následne uložiť medzi vlastné schémy. Preddefinované schémy sú rozdelené na schémy s tmavým farebným prechodom pozadia a s bledým prechodom pozadia. O nastavení farebného prechodu sa dozviete viac v časti "Pozadia". 

Na štvrtej záložke "Uložiť schému" si môžete vytvorenú farebnú schému  uložiť ako vlastnú definovanú schému. Po uložení sa vami vytvorená farebná schéma bude zobrazovať medzi predvolenými farebnými schémami v kolónke "Vlastné farebné schémy".

Pozadie

Nastavovanie pozadia prebieha na štyroch záložkách: Obrázok pozadia,  Farebný prechod, Efekt pozadia a Efekt témy.

Na záložke "Obrázok pozadia" nastavujete obrázok pozadia. Obrázok pozadia má tri voľby. Prvou voľbou "Nezobrazovať obrázok" vypnete zobrazovanie obrázku. Druhá voľba "Roztiahnuť na celé pozadie" roztiahne vami vložený obrázok na celé pozadie vašej stránky. Odporúčame použitie obrázkov s minimálnou šírkou 750 pixelov. Obrázok sa prispôsobuje veľkosti obrazovky používateľa, takže výsledok môže byť u každého používateľa iný. Treťou možnosťou je nastavenie voľby "Pevná veľkosť obrázku". Pri zvolení tejto voľby sa sprístupnia ďalšie nastavenia obrázku, ktorými sú pozíciovanie vloženého obrázku vzhľadom k stránke (hore na stred, hore vpravo, hore vľavo, v strede vpravo, v strede vľavo...), v ďalšej voľbe nastavujete opakovanie obrázku, či sa ma opakovať a ak áno či po zvislej, vodorovnej osi alebo donekonečna ako dlaždice. Každú zmenu nastavenia vidíte v živom náhľade.

V prípade, že chcete použiť vlastný obrázok na pozadí, tlačidlom "VYBRAŤ" sa dostanete do správcu obrázkov, ktorým si vložíte vlastný obrázok. Vybraný obrázok sa automaticky zobrazí na pozadí vašej stránky a môžete skúsiť vhodné nastavenie a výsledok je okamžite zobrazený na stránke. Viac o práci s obrázkami sa dozviete na podstránke Práca s obrázkami tu>

Záložka "Farebný prechod"  slúži na nastavovanie polo-priehľadného prechodu, ktorým môžete zvýšiť kontrast alebo dynamiku stránky. Prechod môžete nastavovať sliderom v rozmedzí od 0 po 100%. So zmenou krytia sa zmení aj náhľad priamo na stránke. Na výber máte 4 voľby. Biely prechod, čierny prechod, prechod vo farbe pozadia alebo môžete cez voľbu Žiadny" prechod vypnúť. Kombináciou farebného prechodu, obrázku pozadia a efektu pozadia môžete dosiahnuť zaujímavé a rôznorodé výsledky. Na podstránke Tipy a triky nájdete návody a pomôcky ako využiť naplno možnosti Webasteru.

Záložka "Efekt pozadia" slúži na nastavovanie efektu pozadia. V prípade, že nechcete efekt zobrazovať, vyberte voľbu "Nezobrazovať efekt". V prípade, že chcete efekt použiť, vyberte si jeden z veľkého množstva dostupných efektov. Všetky efekty sú polopriehľadné a z časti prekrývajú farbu pozadia aj vložený obrázok pozadia. Každý efekt nájdete v čiernej a bielej variante pre lepšie zladenie vašej stránky.

Záložka "Efekt témy" slúži na nastavovanie efektu témy. Efekt témy je polopriehľadný obrázok, ktorý sa zobrazuje v ľavej hornej časti Vašej stránky. Každá nami pripravená téma obsahuje obrázok, ktorý sa vzťahuje k vybranej téme. Na výber máte aj iné univerzálne efekty témy rozdelené do viacerých kategórií. V prípade, že nechcete efekt zobrazovať, môžete ho voľbou "Bez efektu" vypnúť.

Štýl stránky

Administračné okno štýlu stránky slúži na nastavovanie vzhľadu rôznych objektov stránky ako sú články, galérie, produkty, tlačítky, texty na stránke a iné. Administrácia prebieha na piatich záložkách.

Prvá záložka "Štýl stránky"slúži na rýchlu zmenu štýlu stránky. Vybrať si môžete z prednastavených štýlov alebo z vami vytvorených štýlov. Tlačidlom "Správca štýlov" sa dostanete do správcu štýlov, kde je možné existujúce štýly upravovať (okrem systémom preddefinovaných) alebo vytvárať nové vlastné štýly.

Upozornenie: Zmena štýlu a aj vzhľadu stránky je viditeľná až po uložení zmenených nastavení a znovunačítaní stránky.

Druhá záložka "Pozadie" slúži na nastavovanie vzhľadu jednotlivých tlačítok v menu. Samostatne môžete nastaviť vzhľad pozadia Hlavičky boxu (boxy v úzkych stĺpcoch ako sú kontakt, novinky a pod.), Pozadie základnej položky menu - je pozadie základného tlačítka v menu, Pozadie hover položky menu - je pozadie tlačítka po prejdení myšou, Pozadie aktívnej položky - je pozadie tlačítka po kliknutí myšou a vybratí konkrétnej podstránky.

Tretia záložka "Zaoblenia" slúži na nastavenie zaoblenia tlačítok. Samostatne sa nastavujú zaoblenia tlačítok hlavného menu, podmenu a ostatných potvrdzovacích tlačítok. Zmenu zaoblenia vykonáte posunom slideru pre každý roh samostatne. Zmenené zaoblenie vidíte aj v živom náhľade.

Tretia záložka "Efekt" slúži na nastavovanie efektu na tlačítku. Po zvolení efektu si môžete nastaviť či sa má zvolený efekt zobrazovať na tlačítkach hlavného menu alebo aj podmenu a tak isto či sa majú zobrazovať na Základnej položke, Hover položke a aj na Aktívnej položke.

Štvrtá záložka "Písmo" slúži na nastavenie typu písma. Môžete si vybrať zo 16 druhov písiem. Font stránky je písmo, ktoré sa používa na prevažnú väčšinu písma na stránke. Písmo Font stránky je písmo používané pre nadpisy.

Upozornenie: Správne zobrazenie písma je závislé na programovom vybavení počítača ktorý používa návštevník Vašej stránky. Pri určitých operačných systémoch alebo obmedzeniach môže byť stránka zobrazená s použitím iného alternatívneho písma typu písma.

Hlavička

Prvá záložka "Texty" slúži na editáciu textov v hlavičke. Každý z týchto troch textov môžete editovať individuálne. Môžete zmeniť text, kliknutím na ikonu farby zmeniť farbu písma, môžete zmeniť rez písme na tučné alebo naklonené a tiež môžete zmeniť veľkosť písma. Rovnako prostredníctvom funkcie Drag&Drop môžete zmeniť veľkosť (šírku aj výšku) textového poľa, v ktorom sa text nachádza a aj jeho pozíciu.

V prípade, že chcete text v hlavičke rozdeliť do viacerých riadkov, vložte znaky <br /> na miesto, kde chcete aby začínal nový riadok. Znak sa zobrazovať na stránke nebude, iba zabezpečí aby sa nový riadok začínal tam, kde potrebujete.

Druhá záložka "Vzhľad" obsahuje nástroje na prácu s nastavením vzhľadu.  V prvej položke si môžete nastaviť výšku hlavičky (nízka s výškou 150 pixelov, stredná 200 px, vysoká 250 px). O aktuálnej šírke hlavičky vás zase informuje text pod voľbou výšky hlavičky. Takže spávnu veľkosť obrázku hlavičky zistíte jednoducho z týchto hodnôt. Zaškrtnutím voľby "Zobrazovať oddeľovacie čiary" môžete zapnúť zobrazovanie čiar nad a pod hlavičkou. Prostredníctvom nastavenia "Animácia v hlavičke" si môžete vybrať jeden z predpripravených flash efektov, alebo si môžete vložiť aj vlastný flash do hlavičky.

Tretia záložka "Obrázok hlavičky" slúži na nastavenie obrázku hlavičky. Môžete si vybrať z troch nastavení "Bez obrázka" kedy sa obrázok hlavičky nebude zobrazovať, "Použiť obrázok z témy" touto voľbou  nastavujete zobrazovanie obrázka, ktorý patrí k zvolenej téme.  Poslednou voľbou "Použiť vlastný obrázok" môžete vložiť vlastný obrázok - pri vkladaní môžete použiť aj niektorý z obrázkov z verejných galérií. V prípade vkladania obrázku Vám systém podľa zvolenej šírky a členenia stránky upraví šírku Vami vkladaného obrázku. Výška obrázku bude prispôsobená proporčne upravenej šírke, takže sa môže stať, že obrázok nebude celý viditeľný. Najlepšie výsledky dosiahnete ak si obrázok predpripravíte presne na veľkosť hlavičky v obrázkovom editore. Hlavičky sú v šírkach 732 px, 918px a 1068 px. Výška hlavičky môže byť 150, 200 alebo 250px. Zaškrtnutím voľby "Otočiť obrázok" obrátite obrázok. Upozornenie: funkcia obrátenia obrázku nemusí pri používaní prehliadača Internet Explorer fungovať správne.

Štvrtá záložka "Logo v hlavičke" vám umožňuje vložiť vlastné logo alebo obrázok, ktorý je možné umiestniť na ľubovoľné miesto alebo mu zmeniť veľkosť.

Druhou úrovňou práce s hlavičkou je práca na stránke. Jednotlivé texty a pozíciovateľný obrázok je možné posúvať na ľubovoľné miesto. Stačí myšou ukázať na text v hlavičke a po zobrazení kurzoru posunu je možné ich presúvať. V prípade, že chcete zmeniť veľkosť poľa v ktorom sa nachádza text, stačí po zobrazení kurzoru zmeny veľkosti iba zmeniť veľkosť na požadovanú. V prípade, že chcete upraviť pozíciovateľný obrázok proporčne, pridržte pri zmene veľkosti klávesu SHIFT. Obrázok sa bude zmenšovať/zväčšovať proporčne bez deformácie pomeru strán. Výšku hlavičky môžete takisto zmeniť funkciou Drag & Drop zachytením za spodný okraj hlavičky a potiahnutí na žiadanú výšku. Všetky zmeny pozícií textov, výšky hlavičky, obrázku hlavičky a pozíciovateľného obrázku sú až do uloženia vykonávané iba lokálne a návštevníci stránky ich nevidia.

Menu

Pri nastavovaní menu nastavujete pozíciu hlavného menu a následne pozíciu submenu. Submenu je menu na ďalších úrovniach pod hlavným menu. Hlavné menu môže mať štyri pozície: Nad hlavičkou, Pod hlavičkou ,V ľavom  a  v Pravom stĺpci. Podľa zvoleného typu menu je dostupná možnosť nastavenia submenu. Buď ako Dropdown z hlavného menu, to znamená, že pri zvolení tejto voľby sa submenu rozbaľuje z hlavného menu smerom dole. Pokiaľ si zvolíte nastavenie pre submenu ako "Vysúvacie" (maximálne 5 úrovní) budú sa ďalšie úrovne hlavného menu zobrazovať v ľavom stĺpci ako samostatné menu, ktoré sa bude vysúvať smerom do strany. V prípade, že máte hlavné menu umiestnené v ľavom alebo pravom stĺpci je voľba submenu ako "Dropdown" nedostupná a menu môže byť nastavené iba ako "Vysúvacie" a menu sa bude rozbaľovať do bočných strán.

Päta

Pri nastavovaní vzhľadu päty máte na výber z dvoch základných vzhľadov typu päty.

Úzka päta je päta, ktorá obsahuje iba text o Copyrighte (v prípade, že je vyplnený) a základné ikony (logo Webaster, ikonu TOP stránky s klávesovou skratkou, ikonu HOME) plus ikony, obchodných podmienok, mapy stránky a sociálnych sietí, ktoré ste si vyplnili a spustili.

Široká päta okrem všetkého čo obsahuje úzka päta obsahuje aj položky hlavného menu a v prípadne aj menu e-shopu v prípade, že je zapnutá voba "Prvá úroveň stromu" vo voľbe Typ menu e-shop.

Nastavenie vzhľadu päty je možné prostredníctvom "Správcu štýlov" napríklad zmenou zaoblenia rohov a zmenou fareby pozadia, farby textov, tieňom alebo orámovaním.

V prípade, že chcete do päty vložiť aj iný obsah stačí po otvorení editácie vložiť do okna textového editora požadovaný obsah. Tento obsah s apo uložení bude zobrazovať navrchu paty. Do paty je takto možné vložiť akýkoľvek obsah, ktorý je možné vložiť do bežného článku na stránke.

Upozornenie: V prípade, že chcete aby Vaše webové odkazy fungovali správne, nezabudnite, že každá webová adresa musí začínať znakmi http:// V prípade, že zadané webové adresy nebudú začínať znakmi http:// môže systém vyhodnotiť takto zadané adresy ako chybné a pozastaviť uloženie takto zadaných údajov.

Správca štýlov

Správca štýlov slúži na vytváranie a editáciu štýlov, ktoré môžete používať na komplexnú úpravu vzhľadu vašej stránky.

Ako to funguje?
Štýl stránky obsahuje rôzne časti stránky, ktorým je možné jednotlivo nastaviť požadované vlastnosti. Každý objekt môžete editovať jednotlivo. Pozor! Použitý však bude celý štýl so všetkými jeho nastaveniami. Zmenu, ktorú vykonáte na štýle sa na stránke prejaví až po zatvorení správcu štýlov a iba v prípade, že je štýl aj "Použitý". Väčšina objektov má už systémom niektoré vlastnosti definované ale prostredníctvom správcu štýlov si môžete tieto vlastnosti definovať podľa vlastnej potreby.

Časti stránky, ktorým je možné nastaviť vlastnosti sú:
- Článok
- Galéria
- Fotky (v galérii)
- Formulár
- Políčka formulára
- Hlavička
- Päta
- Obsah celej stránky
- Obsah bez stĺpcov
- Produkty (náhľady produktov)
- Detail produktu
- Bloky v stĺpcoch (vyhľadávanie, kontakty a pod.)
 

Aké vlastnosti je možné nastaviť?
- Farby: Farba pozadia, Základná farba, Doplnková farba (väčšinou farba bežného textu)
- Tieň: možnosť nastavenia veľkosti, umiestneia a farby tieňu
- Zaoblenie: možnosť nastaviť polomer zaoblenia rohov
- Orámovanie: možnosť nastaviť typ linky a farbu

Vytvorenie nového štýlu / Kopírovanie štýlu
Nový štýl vytvoríte kliknutím na tlačidlo "Pridať" v ľavom hornom rohu administračného okna. V ISWID menu môžete následne vytvoriť nový štýl. Zmenou nastavenia na "Kópia" môžete vytvoriť kópiu z existujúceho. V políčku názov vyplňte názov štýlu a v políčku popis si môžete zapísať popis, ktorý sa zobrazuje v detaile štýlu pre lepšiu orientáciu.

Použitie existujúceho štýlu
Kliknutím na ikonu "Upraviť", ktorá sa nachádza naľavo od názvu štýlu v otovrenom ISWID menu zakliknete voľbu "Použitý". Použitý štýl je označený - "zafajknutý" v stĺpci s názvom "Použitý".

Globálne vlastnosti. Čo to je a ako fungujú?
Globálne vlastnosti slúžia na jednoduchšie nastavovanie spoločných vlastností viacerím objektom súčasne.
Globálne vlastnosti môžu byť prevzaté od iného prvku, ktorý už globálne vlastnosti nastavené má, alebo môžu byť ako globálne vlastnosti nastavené.
Napríklad: V prípade, že máte nastavený štýl pre článok a chcete aby mali napríklad aj galérie rovnaké vlastnosti, stačí aby ste pri editácii štýlu článku nastavili globálne vlastnosti na "Nastav hodnoty tohto prvku ako globálne".  Pri editácii štýlu pre galériu stačí iba nastaviť globálne vlastnosti na "Prevziať pre tento prvok". Následne budú pre galérie prevzaté rovnaké vlastnosti ako má nastavený štýl článku. Ak v budúcnosti zmeníte nastavenie či už pre článok alebo galériu ich hodnoty budú po uložení zosúladené.

Kaskádové štýly (CSS)

V prípade, že potrebuje aby bol vzhľad vašej stránky individuálny môžete prostredníctvom vlastného CSS štýlu nastavovať vzhľad pre každý objekt na stránke podľa vašej potreby a predstavy. Používanie funkcie odporúčame iba skúseným užívateľom, nakoľko nesprávne použitie môžete spôsobiť nefunkčnosť vašich stránok. Použitím vlastných CSS štýlov nedochádza k prepisu pôvodných CSS štýlov. V prípade, že vypnete používanie vlastných CSS štýlov budú načítané pôvodné systémové CSS.

Editácia vlastných CSS štýlov je dostupná prostredníctvom horného administračného menu alebo ISWID menu cez položku "Vzhľad > Kaskádové štýly (CSS)". V editore môžete vykonať potrebné úpravy a po zakliknutí voľby "Použiť vlastný súbor CSS" sa súbor vygeneruje a na stránke budú prevedené zmeny. 

Upozornenie: V prípade, že budete používať vlastné CSS štýly na úpravu vzhľadu, môžu byť niektoré zmeny uskutočnené v systéme neúčinné a zmena sa nemusí prejaviť pokiaľ budete používať vlastné CSS. Používanie vlastných CSS štýlov odporúčame iba skúseným používateľom.