# Honlap építő
# Cookie figyelmeztetés
Ez a leírás segítséget ad a Cookie figyelmeztetés beállításában.
#### **BEJELENTKEZÉS A KEZELŐ FELÜLETRE**
Jelentkezzen be a kezelő felületre (pl.: cPanel használata esetén az URL a következőhöz lesz hasonló [https://domain.com:2083](https://domain.com:2083/)). Ezt követően kattintson a Website Builder ikonjára, vagy hivatkozására.
A rendszer át fogja irányítani a **Website Builder** felületére.
#### **COOKIE FIGYELMEZTETÉS LEHETŐSÉG KIVÁLASZTÁSA**
Az oldal betöltődését követően a **Dashboard** felületen vigye az egeret a baoldali **Settings** menü fölé, majd válassza ki a lehulló listából a **Cookie Consent** lehetőséget.
#### **COOKIE FIGYELMEZTETÉS BEKAPCSOLÁSA**
A **Cookie Consent** oldalon engedélyeznie kell a Cookie Consent opciót, majd ezt követően lehet beállítani több lehetőséget.
- Válassza ki a **Banner poziciót**
- Válassza ki a **Banner Kinézetet**
- Válassza ki a **Banner Színt** itt lehetőség van beállítani a **Banner** és a **Gomb** színét.
- Adja hozzá a saját **Privacy Policy** hivatkozását.
- Módosítsa a bannerban megjelenő szöveget a **Custom Message** dobozban, a **Dismiss Button Text** gomb szövegét, és a **Policy Link Text** szövegét.
Ha végzett a beállításokkal akkor kattintson a **Save** gombra.
A változásokat megtekintheti ha a**Preview website** gombra kattint. Ezt követően kattintson a **Publish** gombra.
# Email sablon hozzáadása
Ez a leírás segítséget ad egynél több kapcsolati űrlap létrehozásához.
#### KAPCSOLATI ŰRLAP
1. Illessze be a **Field-Name** mezőbe a Subject szöveget, a **contact-form-id** használni fogja később a szövegbobozban a kapcsolati űrlapon.
2. Illessze be **Form Id**-t, a **Form ID** mezőbe, ezt fogja használni később a **contact-form-id** a szövegbobozban a kapcsolati űrlapon.
#### KAPCSOLATI ŰRLAP BEÁLLÍTÁSAI
1. Navigáljon a SitePad **Settings** menübe, majd kattintson a **Contact Form** almenün.
2. Illessze be a **contact-form id** amelyet az előbb létrehozott, majd kattintson az **Add Template** gombra.
3. Ezt követően kattintson a **Save** gombra.
4. Adja meg az email címeket a **To** és a **From** mezőkben amelyet a levél küldés során használni fog a form. A szövegdobozban illessze be az ön által meghatározott **Field-Name** neveket, amelyeket szögletes zárójelek között kell megadnia. Ügyeljen rá, hogy soronként csak egyet-egyet adjon meg. Kattintson a **Remove** gombra a nem használt **contact-form-id** eltávolításához. Miután minden beállítást megadott kattintson a **Save** gombra.
# SMTP/PHP Mail beállítása
**Hogyan állítható be a kapcsolati űrlap SMTP/PHP levél küldéssel**
Ez a leírás bemutatja, hogy a **Kapcsolati űrlap**-ról történő levél küldéshez hogyan lehet beállítani az **SMTP/PHP alapú levél küldést**.
#### KAPCSOLATI ŰRLAP BEÁLLÍTÁSAINAK KIVÁLASZTÁSA
**PHP alapú levél küldés** esetén a **helyi** kiszolgálón keresztül fog levelet küldeni a kapcsolati űrlap, míg az **SMTP alapú levél küldés** esetén egy külsős **szerver** lesz használva a levelek elküldéséhez. Ezen beállításokat a Kapcsolati űrlap beállításainál lehet megadni amit a következő útvonalon érhet el: **SitePad Dashboard > Settings > Contact Form**.
#### PHP ALAPÚ LEVÉL KÜLDÉS
- A PHP alapú levél küldés az alapértelmezetten kiválasztott opció.
- Adja meg ugyan azt az Email címet a **To** és a **From**, mezőkben. Több email cím megadása esetén vesszővel válassza el az egyes címeket egymástól.
- A **Subject** mezőben beállítható az üzenet tárgya.
- Módosíthatja a **Success/Fail** üzenetek szövegét.
- Lehetősége van **reCAPTCHA** hozzádásra is a spammek elkerülése végett.
**Megjegyzés:** Abban az esetben ha a szerver nem támogatja a helyi szerveren keresztül történő levél küldést akkor állítson be **SMTP alapú levél küldés**-t.
**Megjegyzés:** Nem szükséges mindig visszanavigálnia a **Dashboard** a weboldal Publikálásához. Bármikor rákattinthat a **Publish** gombra a **Dashboard** vagy a **Page Editor** felületén belül.
2.Meg fog jelenni a **Megerősítő** felugró ablak ahol kattintson a **Yes, Publish** gombra a weboldal publikálásához, abban az esetben ha a folyamatot meg kívánja szakítani kattintson a **Close** gombra.
3.Ezt követően **várjon** ameddig a **folyamat befejeződik.
4.** A folyamat befejezését követően kattintson a **Visit website** gombra ahhoz, hogy meg tudja tekinteni a **Publikált weboldalt**.
**Megjegyzés:** A **Publikált** weboldal **megtekinthető** úgy is, hogy ha a rákattint a **Site URL**-re.
# Oldaltérkép hozzáadása
Ez a leírás segít a SiteMap beállításában
#### UGRÁS A SZERKESZTŐBE
A **Website Builder** kezelő felületén vigye az egeret a baloldali oldalsávban a **Pages** elemre, majd kattintson az **All Pages** lehetőségre. A betöltődést követően kattintson az **Edit Icon**-ra bármelyik oldal esetén.
A rendszer automatikusan be fogja tölteni a szerkesztőt.
#### SITEMAP OPCIÓ KIVÁLASZTÁSA
A **Szerkesztő** felületén vigye az egeret a felső navigációs sávra, majd válassza ki a more menüt. A lehulló listában több lehetőség is meg fog jelenni mint **pl.** Reset Page, SEO Options és Custom HTML.
Válassza ki a **SEO Options** elemet.
A **SEO Options** elemre történő kattintást követően meg fog jelenni egy előugró ablak, ahol kattintson a **SiteMap** elemre ahhoz, hogy a SiteMap opciókat betöltse.
#### SITEMAP OPCIÓK SZERKESZTÉSE
A felület betöltődését követően jelölje be az **Enable SiteMap** lehetőséget, ezt követőenvan lehetősége a Manage SiteMap Settings opciók beállítására amelyek a következőek lehetnek: **Automatikus** / **Manuális.**
A szükséges beállítások módosítását követően kattintson a **Save** gombra a mentéshez.
Megjegyzés: A Blog bejegyzések SiteMap lehetősége automatikusan kerül kezelésre.
**Megjegyzés**: Ha az adott oldalhoz nem tartozik Meta adat akkor a Globális Meta adatok kerülnek felhasználásra.
Megjegyzés: A weboldalak váltásához legalább két oldallal kell rendelkezni
#### VÁLTÁS AZ OLDALAK KÖZÖTT
Az oldala közötti váltáshoz elegendő ha az egeret a felső menüsorban a **Switch Site** felirat fölé viszi
A megjelenő lehulló listában találhatja meg a jelenlegi weboldalait, amelyekre ha az egeret ráviszi akkor megjelennek az adott weboldalhoz tartozó helyi menüben válassza ki a **Dashboard** lehetőséget.
A SitePad Switch Site menüjében az oldalak a létrehozás sorrendjében jelennek meg.
# Website Builder segítség
A **Website Builder Segítség** egy eszköz amely segítséget nyújt a **Website Builder Editor** beállításain belül.
#### HOGYAN HASZNÁLHATÓ A WEBSITE BUILDER SEGÍTSÉG
A **Website Builder** felület első elérése során automatikusan engedélyezve van a Segítség.
A segítség elindításához kattintson a **Get Started** gombra a navigációs panelen. Ha le kívánja tiltani kattintson a bezárás **(x)**, vagy a **Close** gombra.
### 
#### A SEGÍTSÉG ENGEDÉLYEZÉSE
Bármikor engedélyezheti a segítséget, ehhez vigye az egeret a felhasználói neve fölé **Welcome, {username}** a navigációs sávon. A lehulló listában lehet engedélyezni a ha kiválasztja a **Enable Assistant** elemet.
#### A SEGÍTSÉG LETILTÁSA
A letiltás hasonló módon történik mint az engedélyezés, vigye az egeret a felhasználói neve fölé Welcome, {username} a navigációs sávon. A lehulló listában lehet engedélyezni a ha kiválasztja a Disable Assistant elemet.
# Egyedi weboldal
# Gomb
Ez a leírás segítséget ad a Gomb widget beállításaiban és a stílusok módosításához.
#### GOMB WIDGET BEÁLLÍTÁSAI
Amikor a **Fogd és vidd** módszer segítségével Gomb widgetet mozgat a Website Builder kezelőfelületén akkor megjelnik a **Gomb beállítások, és Stílus** doboz. Navigáljon a Gomb beállításon részre. Itt lehetősége van a **Gomb szövegének** és a **Gomb hivatkozás** módosíátásra. Abban az esetben ha bejelöli az **Open link in new window** lehetőséget akkor a gombra történő kattintást követően új ablakban fog megjelenni a hivatkozott tartalom.
Abban az esetben ha szeretne akkor ikont is megjeleníttethet a Gomb alatt, ehhez az **Icon** felirat alatt található lehulló listából válassza ki az ikont a listából.
Ha szeretne **teljes szélességű stílussal** ellátott gombot elhelyezni akkor jelölje be a **Stretch** opciót, az **Alignment** résznél lehetősége van a gomb igazításának beállítására is.
#### GOMB HIVATKOZTATÁSA EGY ADOTT OLDALHOZ
A **Gomb**-t hivatkoztatni lehet már meglévő oldalhoz, ehhez kattintson a három vízszintes pöttyre.
A felugró ablakban kattintson a lefelé mutató **nyílra**.
Válassza ki az adott oldalt, majd kattintson az **Add Link** gombra.
#### GOMB ELEM STÍLUSÁNAK SZERKESZTÉSE
Lehetősége van a **Gombhoz egyedi stílust** beállítani, mint például háttér szín, szöveg szín, stb., ehhez kattintson a **Edit Element Style** gombra.
Az **Predefined styles** gombra, ahol a már előre meghatározott stílusok közül választhat. A kiválasztás befejezését követően kattintson ismét a **Predefined Styles** gombra.
#### EGYEDI STÍLUS A GOMBHOZ
Lehetősége van egyedi stílus létrehozására is, ahol beállítható többek között a háttér szín, szöveg szín, padding, keret-rádiusza, stb. Miután minden beállítást elvégzett kattintson az **Apply** gombra.
#### ELŐRE DEFINIÁLT GOMB STÍLUS
Az előredefiniált gomb stílusok **class**-okat adnak a gombokhoz, amelyeknél már előre meg van határozva a háttér szín, szöveg szín, és a gomb mérete.
# Weboldal letöltése
**Megjegyzés:** Alapértelmezésben a Letöltési lehetőség le van tiltva, a letöltés engedélyezéséhez lépjen kapcsolatba ügyfélszolgálatunkkal. A letöltési opció nem érhető el a SitePad Free csomagban.
#### NAVIGÁLÁS A SITEPAD EDITOR-BA
A kezelő felületen keresse meg a **SitePad Website Builder**-t és kattintson rá. A felület át fogja irányítani a SitePad Szerkesztőbe.
Az átirányítást követően kattintson a felső navigációs sávban a **Download** gombra.
#### LETÖLTÉS TÖMÖRÍTETT ZIP FÁJLKÉNT
Következő lépésként kattintson a **Download Now** gombra. A weboldalát ezt követően tömörítve Zip állományban tudja lementeni.
A letöltött ZIP állományt innentől kezdve bárhová fel lehet tölteni, például cPanel esetén a /public\_html mappába.
# Többnyelvű oldalak
Ez a leírás segítséget adhat többnyelvű oldalak létrehozásához.
Készítse el a weboldalát teljesen, majd ezt az oldalt klónozza le ahol lehetősége lesz másik nyelvre történő fordítására a szerkesztő segítségével. Ehhez kövesse az alábbi lépéseket!
#### TELJES WEBOLDAL KLÓNOZÁSA
A weboldal klónozásához navigáljon a **Dashboard** -> **Sites** -> **Clone Site** menüpontba vagy a **Dashboard** -> **All Sites** menüpontba ahol válassza ki a klónozni kívánt oldalt.
Válassza ki a forrás oldalt a legördülő listából amelyet **klónozni** szeretne. Adja meg a SitePad szerkesztő URL mezőjében a weboldal nevét a **Site Name** mezőben, válassza ki a domain nevet a **Site Address** lehulló listából. Adja meg a weboldal címét a klónozáshoz a **Site Title** mezőben. Ez lesz a weboldal címe a klónozott weboldalnak a közzététel után. Kattintson a Klón gombra a webhely klónozásához.
A klónozási folyamat befejezése után két link fog megjelenni: **Visit Dashboard** illetve **Visit Site**. Itt kattintson a **Visit Dashboard** hivatkozásra a klónozott oldal szerkesztéséhez.
#### KLÓNOZOTT OLDAL SZERKESZTÉSE
A weboldal pontos mását fogja látni ugyanazzal a stílussal és tulajdonságokkal, itt lesz lehetőség arra, hogy lefordítsa az oldalát másik nyelvre.
#### HIVATKOZÁSOK HOZZÁADÁSA A FEJLÉCHEZ
Tételezzük fel, hogy van egy domain neve ami a www.example.com címen érhető el, ezen a domain néven az angol nyelvű tartalom jelenik meg. Mind a két weboldal fejlécében szeretne hivatkozást készíteni a másik nyelvű oldalra.
#### MINDEN OLDAL PUBLIKÁLÁSA
Miután minden módosítással elkészült publikálja a weboldalát.
# Jelszóval védett oldal
Ez a leírás segítséget ad a jelszavas védelem beállításához.
**Megjegyzés:** A jelszavas védelem csak Apache web szerver esetén használható.
#### NAVIGÁLÁS A SZERKESZTŐBE
A **SitePad Website Builder** kezelőfelületén válassza ki azt az oldalt amelyhez jelszavas védelmet szeretne beállítani, majd kattintson az **Edit Icon**-ra.
A kattintást követően át fogja irányítani az oldal a szerkesztőbe.
#### JELSZAVAS VÉDELEM KIVÁLASZTÁSA
A szerkesztőben (**SitePad Editor)** vigye az egeret a felső navigációs sávra, majd a lehulló listából válassza ki a **Password Protect** lehetőséget, majd kattintson rá.
#### JELSZÓ LÉTREHOZÁSA
A felugró ablakban engedélyezheti a jelszavas védelmet az **Enable Password Protection** lehetőség bejelölésével. A bejelölést követően az **Username** mezőben adja meg a felhasználói nevet, a **Password** mezőben pedig a jelszót, a **Title for Authentication** mezőben pedig a jelszavas azonosítás címsorát állíthatja be. Ezt követően a **Protect Pages** résznél válassza ki hogy mely oldalakat szeretné jelszóval védeni például: **All Pages** vagy **Selected Pages**.
A beállítást követően kattintson a **Save** gombra.
**Megjegyzés:** Az oldalakat publikálnia kell ahhoz, hogy a jelszavas védelem működjön.
#### JELSZAVAS VÉDELEM ELTÁVOLÍTÁSA
A jelszavas védelem kikapcsolásához vegye ki a pipát az **Enable Password Protection** lehetőség elől, majd kattintson a **Save** gombra.
**Megjegyzés:**Az oldalakat publikálnia kell ahhoz, hogy a módosítások érvényesüljenek.
**Megjegyzés:** Ha az oldal címet globális meta adatként állítja be akkor a főoldal oldal címe is lecserélésre kerül. Abban az esetben ha nem használ egyedi oldal címeket akkor szintén a globális meta adatoknál megadott oldalcím lesz használva.
**Megjegyzés:** Abban az esetben ha a Globális Meta adatoknál kattint a Clear Meta gombra akkor az Oldal cím nem kerül visszaállításra.
**Megjegyzés:** Abban az esetben ha teljes visszaállítást választ akkor a sablon választó oldalra fogja irányítani a rendszer.
1. Válassza ki azokat az oldalakat amiket a **Header Menu**-ben meg kíván jeleníteni, majd kattintson az **Add Menu** gombra.
1. Ha szeretne eltávolítani egy oldalt a **Menu**-ből akkor kövesse a következő lépéseket, majd kattintson a **Save Menu** gombra.
# Oldalcím és bemutatkozó szöveg hozzáadása
Ez a leírás segítséget ad a weboldal cím, és az oldal leírás beállításához.
#### UGRÁS A BEÁLLÍTÁSOKRA, MAJD AZON BELÜL AZ ÁLTALÁNOS MENÜBE
A SitePad Website Builder kezelőfelületén a baloldali oldalsávban vigye az egeret a **Settings** elemre majd válassza ki a **General** lehetőséget.
A **General Settings** oldalon lehetősége van beállítani a **Site Title, Tagline, Date Format, TimeZone, Time Format, Week Start On** stb. elemeket.
Adja meg a **Site Title** mezőben az oldal címét, a **Tagline** mezőben az oldal rövid leírását, majd kattintson a **Save Changes** gombra.
# Egyedi logó hozzáadása
Ez a leírás segítséget ad az egyedi logó beállításához.
#### UGRÁS A PAGES MENÜPONTBA, MAJD A HEADER SZERKESZTÉSE
A SitePad Website Builder kezelőfelületén a baloldali oldalsávban vigye az egeret a **Pages** lehetőség fölé , majd válassza ki az **All Pages** elemet.
A betöltődést követően kattintson a Header oldal sorában a Szerkesztés ikonra.
#### EGYEDI LOGO HOZZÁDÁSA
A rendszer át fogja irányítani a **SitePad Editor** felületére. A betöltődést követően távolítsa el az Oldal címet (**Site Title)**.
Ezt követően húzza a **Images Widget** elemet ugyanabban a sorban egy új oszlopba.
Az **Image Widget** elhelyezését követően meg fog jelenni a feltöltéshez szükséges felület ahol fel tudja tölteni a logo képet.
A felületen kiválasztható egy már korábban feltöltött kép, vagy fel is lehet tölteni egy újat.
Megjegyzés: A képfájlnak **.jpeg**, **.jpg** vagy **.png** formátumúnak kell lennie.
**Megjegyzés**: Ne törölje a Header(Fejléc) és a Footer(Lébléc) oldalakat
Ez a leírás segít Önnek egy hozzászólás doboz hozzáadásáabn a bejegyzés/oldalhoz.
**Megjegyzés**: jelenleg a Disqus-t támogatja a Website Bulder. Hamarosan azonban további hozzászólás modul is elérhető lesz.
**Megjegyzés**: Hozzáadhat Disqus hozzászólás modult a blog bejegyzéséhez, vagy az oldalához. Ehhez elegendő a hozzászólás dobozt az adott oldalra húznia ahol engedélyezni szeretné a hozzászólásokat
#### HOZZÁSZÓLÁS DOBOZ ELHELYEZÉSE
A baloldalon található Widget Panel-ről húzza a hozzászólás dobozt az oldalára.
A **hozzászólás doboz** elhelyezést követően be kell állítania a **Disqus** felhasználói nevét pl.: **shortname.disqus.com** vagy csak a felhasználói nevet pl.:**short-name**. Abban az esetben ha még nincsen **Disqus** fiókja [itt készíthet egyet](https://disqus.com/admin/create/).
**Megjegyzés**: A Disqus felületén be kell állítania a fiókot mielőtt a WebSite Builder felületén megadja felhasználói nevét.
# Visszaszámláló
Ez a leírás segít Önnek egy **Visszaszámláló** dobozt léterhozni, és beállítani.
**Megjegyzés:** A widget az **Alapértelmezett Stílussal** jön létre amelyet a beállított sablon ad, azonban ez szabadon módosítható.
#### VISSZASZÁMLÁLÓ DOBOZ HOZZÁADÁSA
A bal oldalon található Widget panelről húzza a **Visszaszámláló** dobozt az oldalára.
### VISSZASZÁMLÁLÓ BEÁLLÍTÁSAI
1. Állítsa be a lejárati dátumot, ehhez kattintson az **Kalendárium ikonra** a **Expiration Date** sor végén. Valamint állítsa be a kezdési dátumot is, ehhez kattintson az **Kalendárium ikonra** a **Start Date** sor végén.
2. Válassza ki az **időzónát** a lehulló listából, ami lehet a helyi eszközön beállított idő, illetve a szerveren beállított idő is használható.
3. A **Format** mezőben adja meg a Dátum formátumát, később ez alapján fog megjelenni a visszaszámláló.
4. Kétféle stílus közül választhat a viszzaszámláló megjelenítését tekintve, ezek az Alapértelmezett, illetve a Kör, ezek közül a **Kör** ami alapértelmezetten be van állítva
5. Beállítható a **visszaszámláló blokk** háttere is.
6. Következő lépésként adja meg a **színét** a szövegnek, a számlálónak, valamint a számláló háttérnek.
7. Adja meg a **számláló blokk** méretét.
8. Módosítsa igényei szerint a számláló méretét, a számjegyek számát, és méretét a csuszkák segítségével.
9. Beállítható a **blokkok** közötti **terület** nagysága is.
10. A visszaszámláló előtt/felett megjeleníthető bármilyen szöveg, ehhez a szöveget a **Text before Start Date** dobbozban lehet megadni.
11. Miután a visszaszámláló elérte a **nullát** szintén lehetőség van bármilyen szöveges tartalom megjelenítésére, ehhez a **Expiration Text** felirat alatti dobozban kell megadnia a szöveges tartalmat.
12. Miután a visszaszámláló elérte a **nullát** beállítható bármilyen hivatkozás is, ehhez a **Expiration URL** felirat alatti mezőben kell megadni az adott oldal címét.
# Rács galéria
Ez a leírás segít Önnek egy **Rács képgaléria** dobozt léterhozni, és beállítani.
#### RÁCS KÉPGALÉRIA HOZZÁADÁSA
- A bal oldalon található Widget panelről húzza a **Rács képgaléria** dobozt az oldalára.
#### KÉPEK KIVÁLASZTÁSA
- Válassza ki a képeket a **Media Library**-ből.
- Képfeltöltéshez kattintson az **Upload Files** gombra.
#### RÁCS KÉPGALÉRIA BEÁLLÍTÁSAI
- - Ha **módosítani, törölni, vagy hozzáadni** szeretne képeket akkor azt megteheti az **Organize Images** felületen keresztül.
- A **Column count** résznél válassza ki, hogy a rácson belül hány kép jelenlen meg oszloponként.
- Az **Image size** részen kiválaszthatja a képek méreteit, ha a **Custom** lehetőséget választja megadhat egyedi kép méretet is. 
- - A **Link** résznél kiválasztható, hogy a képek milyen hivatkozásra mutassanak.
- Ha azt szeretné, hogy a **Link** részen megadott képek **új oldalon** nyíljanak meg akkor jelölje be az **Open link in new window(tab)** lehetőséget.
- A képekhez megjeleníthet feliratot is ehhez a **Show image caption** opciót jelölje be. 
#### GALLÉRIA OPCIÓ A RÁCS KÉPGALÉRIÁN BELÜL
ez a beállítás a **link to** szekció alatt érhető el. Válassza ki azon képeket amelyeknél a rákattintást követően szeretne felugró ablakot. A kiválasztást követően további beállításokat adhat meg a képgalériához.
- - Hozzáadhat a miniatűrökhöz **keret méretet** és **kere színt** is. 
- - Lehetősége van a **képek közötti távolságot** is beállítani, beállíthatja a felugró galéria képét a **keret méretét és a színét**. 
- - Megadhatja a **maximális magasságot** és a **maximális szélességet** a felugró alblak esetén
- Ha szerente akkor lapozót is megjeleníthet ehhez jelölje be a **Show Pagination** lehetőséget
- Beállíthatja a kép címének **láthatóságát** is. 
- - A weboldalán amikor a galéria képre kattint meg fog jelenni a felugró ablak. 
# Kép
Ez a leírás segít Önnek **Kép** hozzáadásban.
#### KÉP ELHELYEZÉSE
- A bal oldalon található Widget panel-ról húzza a kép dobozt az oldalára.
#### MÉDIA BESZÚRÁSA
- Amikor egy képet húz az oldalára akkor meg fog jelenni az **Insert Media** ablak.
- Itt lehetősége van kiválasztani a további képet a **Media Library**-ból vagy fel is tölthet egy vagy több képet, ha az **Upload Files** hivatkozásra kattint.
- Mindezek mellett lehetősége van **URL cím** megadásával hivatkozni egy vagy több képre, ehhez használja az **Insert From URL** hivatkozást.
#### KÉP MÉRETE
- A kép kiválasztását követően meg fog jelenni egy **Párbeszéd ablak**
- Itt lehetősége van a kép beállításainak módosítására, valamint **le is cserélheti** a képet.
- A kiválasztott képnél több opcióból választhat, többek között módosítható a kép **méret**e, de beállítható **egyedi méret** is, ehhez válassz a **Custom** opciót, majd adja meg a kép méretét a **Width** és a **Height** mezőkben (pl. 100×100).
#### KÉP HIVATKOZÁSA
- Lehetősége van a képhez hivatkozást beállítani, ami lehet **egyedi URL**, vagy **média fájl**, illetve **Lightbox**.
- A **hivatkozás** beállításához válassza a **Custom URL** lehetőséget, média fájl esetén a **Media File** opciót. Ha nem szeretne hivatkozást beállítani akkor hagyja üresen a **Link to** mezőt.
- Lehetőség van arra is, hogy a hivatkozás új lapon nyíljon meg, ehhez jelölje be a **New Tab** opciót.
- Képaláírás beállításához jelölje be a **Show Image Caption** jelölő négyzetet.
#### KÉP IGAZÍTÁSA
- Az **Alignment** részen ki tudja választani a kép igazítását.
- Ha szeretne átmenetet beállítani akkor jelölje be az **Overlay Hover Effect** lehetőséget. Ez az effekt akkor fog működésbe lépni amikor az egeret a kép fölé viszik.
#### KÉP ÁTMENET
- Ha szeretne **átmenetet** a képhez beállítani akkor jelölje be az **Overlay Hover Effect** jelölő négyzetet.
- Ezt követően válassza ki az **Ikont**
- Válassza ki az ikon **színét** és a **méretét**.
- Végül válassza ki a **háttérszínt**.
#### EGYEDI STÍLUS
- A **stílus** fülön lehetősége van egyedi stílus megadására is.
# Cselekvési gomb
Ez a leírás segít Önnek egy Call to Action doboz hozzáadásában.
#### CALL TO ACTION WIDGET ELHELYEZÉSE
A baloldalon található Widget Panel-ről húzza a Call to Action Widget az oldalára.
#### CALL TO ACTION SZÖVEG
- Módosíthatja a **címet, alcímet, és szöveget**.
- A szöveg igazítását az **igazítás** résznél állíthatja be.
#### CALL TO ACTION HÁTTÉR
- Módosíthatja az **alakját**, a háttér előre meghatározott **stílusát** vagy beállíthat egyedi stílust is.
- Módosíthatja a **teljes szélességét** a háttérnek.
- Módosíthatja továbbá a **gomb pozíciót** a háttér alakját és a **szövegét** a gombnak.
#### CALL TO ACTION GOMB
- Módosítható a **gomb hivatkozása**, valamint megadhatja hogy a hivatkozás új ablakban nyíljon meg, ehhez **jelölje be** a jelölő négyzetet.
- A gomb alakját is **kiválaszthatja** valamint a gomb **előre definiált** színe is megadható a lehulló listából.
- A gomb méretét az **előre meghatározott** gombméretek közül lehet kiválasztani.
#### CALL TO ACTION GOMB IKON
- Módosíthatja a gomb ikonját az ikon lista alapján.
- A gombhoz tartozó ikon igazítását is be lehet állítani ami lehet bal, vagy jobbra zárt.
- A gomb **animációját** a lehulló listából választhatja ki.
#### CALL TO ACTION IKON
- Módosítható az ikon **pozíciója** a lehulló lista alapján.
- Az **Ikon** módosítható a lehulló lista alapján.
- Változtatható az **előre beállított** ikon szín, de **egyedi** szín is megadható, ehhez válassza az egyedi színt, majd adja meg a kívánt színt.
- Az ikon mérete lehet **előre meghatározott**, vagy **egyedi** méretű.
- Ha szeretné akkor beállíthat **fél ikont** is szegéllyel, ehhez jelölje be a a jelölő négyzetet.
- Az ikon animációja lehetőséget ad az ikon oldal betöltődés során megjelenő **animációs stílusának** módosítására.
#### CSELEKVÉSI STÍLUS
két cselekvési stílus közül választhat **1)** elem stílus szerkesztése valamint **2)** előre meghatározott stílus
- Az **elem stílus szerkesztése** lehetőséget biztosít egyedi stílusok beállítására, így lehetősége van többek között egyedi háttér színt, szöveg színt, margint, keret stílust beállítani.
- Alapértelmezésben itt nem választhat előre definiált stílusok közül, azonban használhat **saját class**-okat amelynek segítségével egyedi stílust állíthat be.
# Szolgáltatás doboz
Ez a leírás segít Önnek egy szolgáltatás doboz hozzáadásában**.**
#### SZOLGÁLTATÁS DOBOZ ELHELYEZÉSE
- A bal oldalon található **Widget panel**-ról húzza a **Szolgáltatás dobozt** az oldalára.
- Így megjelenik egy **párbeszédpanel**, ahol személyre szabhatja a **Szolgáltatás dobozt**.
- A képen látható módon válassza ki az Önnek megfelelő **Tartalom stílust.**
#### SZOLGÁLTATÁS DOBOZ MÉDIA TÍPUSA
- Válassza ki a **Média Típust** , amit szeretne megjeleníteni a Szolgáltatás dobozban. Mi most a **Betűtípus Ikon**-t választottuk.
- Ha kiválasztottuk a **Betűtípus Ikon**-t legörgetve megadhatunk további beállításokat is az **Ikonnak**, mint ahogy a lenti képen is látható. Ugyan így szükséges beállítani a **Ikon képet** és a **Széles képet**.
- A beállításokban további tulajdonságokat is személyre szabhat, pl.: **Szín, Méret**.
#### SZOLGÁLTATÁS DOBOZ TARTALMA
- Írja be a Szolgáltatás doboz **Címét** és adja meg a **Cím Stílusát** a képen látható módon.
- A Szolgáltatás doboz szövegét a **Tartalom** dobozban adhatja meg.
### GOMB
- Pipálja be a **Gomb megjelenítést.**
- A következő lépésben megadhatja a gombon megjelenítendő szöveget és egy **Gomb linket**, ha más oldalra szeretne irányítani a **gombra kattintással**.
- A képen látható módon válasszon egy **Gomb Színt** az előre definiált színekből, vagy az **Egyéni** lehetőségere kattintva.
- Az **Igazítás** lehetőséggel beállíthatja a **gomb** pozícióját.
#### ELŐRE ELKÉSZÍTETT STÍLUS
- Az **Edit Element Style**-ra kattintva mentheti el az **Előre elkészített stílusok** közé.
# Modal
Ez a leírás segítséget ad a **Modal**widget beállításaiban, és a stílusok módosításában.
#### MODAL WIDGET ELHELYEZÉSE
- A baloldalon található Widget Panel-ről **húzza** a Modal-t az oldalára.
- A megjelenő **párbeszéd ablakban** lehetősége van a Modal elemeinek beállítására, és módosítására.
#### MODAL MÓDOSÍTÁSA
- Beállíthat **Egyedi stílust** ehhez válassza a **Custom** lehetőséget a **Style** részen.
- Ha kiválasztotta a **Custom** lehetőséget akkor módosíthatja a **Háttérszínt** és a **Doboz színét**.
- Adja meg a **Gomb szövegét** ahhoz, hogy megjelenjen a **Modal gomb**.
- Ha szeretné akkor be lehet állítani a **Gomb** esetén a **teljes szélességet** ehhez jelölje be a **Stretch** opciót.
- Válassza ki a Modal Gomb **Pozicióját**. Itt 3 lehetőségből választhat: **bal, közép, és jobb**.
- Válassza ki a Modal Gomb **Ikonját,** ha nem szeretne ikont beállítani, akkor hagyja üresen.
- Ha kiválasztott **Ikont** akkor be kell állítania annak **Pozicióját**. Alapértelmezésben az ikon **balra zárt** azonban ezt módosítani lehet **jobbra zártra**.
- Válassza ki az **animáció** típusát a modal képernyő **végére**, temészetesen beállítható az **elrejtés is.
**
#### EGYEDI STÍLUSOK
- Választhat **előredefiniált stílusok** közül, ehhez kattintson a **előredefiniált stílusok** lehetőségre.
- Lehetősége van egyedi stílusok beállítására is, ehhez válassz az Elem stílus szerkesztése lehetőséget.
#### MODEL KÉPERNYŐKÉP
- Amikor **rákattint** a Modal gombra meg fog jelenni a beállított Modal.
# Beágyazás
Ez a leírás segítséget ad a Beágyazási widget beállításaiban, és a stílusok módosításában.
**Megjegyzés:** A widget az **Alapértelmezett Stílussal** jön létre amelyet a beállított sablon ad, azonban ez szabadon **módosítható**.
#### BEÁGYAZÁSI WIDGET ELHELYEZÉSE
A baloldalon található Widget Panel-ről húzza a Beágyazási widgetet az oldalára.
#### BEÁGYAZÁS BEÁLLÍTÁSAI
1. **Gépelje be, vagy illessze be a** HTML kódot a szövegdobozba, ahol lehetőségevan a stílust is megadni
2. Jelölje be a jelölőnégyzetet, ha teljes szélességét és magasságát szeretné elérni az oldal jelenlegi div-nél.
#### BEÁGYAZÁSI STÍLUSOK
1. Az**Edit Element style** lehetőséget ad arra, hogy egyedi háttér, és szöveg színt, valamint margint, keret-rádiuszt, stb. állítson be.
2. Itt **nincs** lehetőség előredefiniált stílusok használatára.
3. Azonban egyedi **class**-okat létre tud hozni.
# Árlista táblázat
Az első **téma** kiválasztásakor automatikusan megadja az **árlista táblázat** előre meghatározott stílusát, de ha a **Testreszabás menüpontot** kívánja követni, kövesse ezt az útmutatót.
1. Az **árlista táblázatot** a bal oldali widget részből tudja elhelyezni az oldalán. Ez a művelet az **árlista táblázat** párbeszédpaneljét fogja megjeleníteni.
2.Válassza ki a színeit az **árlista táblázat**-nak, valamint a sorok és az animációs effekteket.
3.A **Beállítások** részen több lehetősége van az **árlista táblázat** testreszabására ezen felül soronként módosíthatóak a szövegek is.
4.A **stílusok** részen további egyedi stílust állíthat be.
# Fülek
Az első **téma** kiválasztásakor automatikusan megadja a **Fülek** előredefiniált definiált stílusát, de ha szeretné **testre szabni a Füleket**, akkor követheti ezt az útmutatót.
1.A baloldalon található Widget Panel-ről húzza a Füleket az oldalára. Az áthúzást követően meg fog jelenni egy **párbeszéd ablak** ahol testre lehet szabni a füleket.
2.A **Beállítások** részen hozzáadhat új **Fület**, valamint szöveget.
3.A **Beállítások** részen lehetősége van **ikon kiválasztására** és azt az ön igényeinek megfelelően **módosítani**.
4.A **stílus** részen megadhat **Egyedi stílust** de használhatja az **Előredefiniált stílusokat** is.
# Accordion
Ez a leírás segítséget ad a Accordion widget beállításaiban, és a stílusok módosításában.
#### ACCORDION WIDGET ELHELYEZÉSE
A baloldalon található Widget Panel-ről húzza a Accordion-t az oldalára.
1. Kattintson az **Add new Accordion** elem gombra ahhoz, hogy új Accordion elemet adhasson hozzá.
2. Ha szeretné **eltávolítani az Accordion elemet** kattintson a **törlés ikonra** az Accordion elem részen.
#### ACCORDION ELEM BEÁLLÍTÁSAI
1. A **szekció cím** részen adhatja meg az Accordion elem címét.
2. A **szekció tartalom** részen állíthatja be az adott elem tartalmát.
3. Vagy kattinthat az **Open in SitePad Editor** gombra is ahhoz, hogy a tartalmat beillessze.
4. Jelölje be az **Active** jelölőnégyzetet, az adott elem alapértelmezetté tételéhez. **Megjegyzés:** Csak egy elem lehet aktív.
#### ACCORDION STÍLUSOK
Két stílus közül választhat: **1)** Elem szerkesztés, és a stílus megadása és a **2)** Előre definiált stílus
1. Az **Elem szerkesztés, és a stílus megadása** lehetőségnél lehetősége van egyedi stílus létrehozására is, ahol beállítható többek között a háttér szín, szöveg szín, padding, keret-rádiusza, stb.
1. **Előre definiált** stílusok **class**-okat adnak az Accordion-hoz mint például **Sötét és világos**.
2. Mindezek mellett lehetősége van **egyedi class**-ok létrehozására is.
# Splash képernyő
Ez a leírás segítséget ad a **Splash képernyő** widget beállításaiban, és a stílusok módosításában.
#### SPLASH KÉPERNYŐ WIDGET ELHELYEZÉSE
- A baloldalon található **Widget Panel**-ről húzza a **Splash képernyő**-et az oldalára.
- Amikor a weboldal elérte ezt a részt, akkor a **Splash képernyő** meg fog jelenni.
- Itt az oldal elejére **húztuk**, így **megjelenik**, amikor az oldalat a böngészőben behívjuk.
#### TARTALOM SZERKESZTÉSE
- Amikor a **Splash képernyő**-t elhelyezi a weboldalán akkor, automatikusan megnyitásra kerül egy **párbeszédpanel**.
- A párbeszédablakban most szerkesztheti a **Splash képernyő** tartalmát, haogyan az az alábbi képen látható.
#### KÉSLETETÉSI IDŐ ÉS MEGJELENÉS
- A késleltetési idő segítségével késleltetheti a **Splash képernyő** megjelenését.
- Válassza ki, ha a Képernyõ opciókból szeretné megjeleníteni a **Splash képernyő**-t.
- A **Splash képernyő** stílusának kiválasztása. Ha egyedi stílust szeretne megadni, válassza az **Custom** lehetőséget.
#### STÍLUSOK ÉS ANIMÁCIÓ
- A **egyéni stílust** a **Custom** gombra kattintva adhatja meg.
- Van egy másik módja annak, hogy az **egyéni stílusokat** a későbbi lépésekben adjuk meg.
- Válassza ki az **Animáció** típusát, amikor az oldal meghatározott részére ér a Splash képernyő. Ugyanígy kell megadni a Splash képernyő **elrejtését** is.
#### EGYEDI STÍLUSOK
- Ez a második módja annak, hogy egyéni stílust adjon a Splash képernyőnek.
- Egyszerű stílusok hozzáadásához kattintson az Elemstílus szerkesztése gombra.
#### SPLASH KÉPERNYŐ MEGTEKINTÉSE
- A Splash képernyő hasonlóan fog megjelenni a weboldalán, mint az az alábbi képen látható.
# Letöltés gomb
Ez a leírás segítséget ad a Letöltés gomb widget beállításaiban, és a stílusok módosításában.
#### LETÖLTÉS GOMB WIDGET ELHELYEZÉSE
A baloldalon található **Widget Panel**-ről húzza a **Letöltés gomb widget**-et az oldalára.
#### LETÖLTÉS GOMB BEÁLLÍTÁSAI
1. **Média Fájl** Ha szeretne feltölthet olyan fájlokat amelyek később **letölthetőek** akkor kattintson a három vízszintes pontra, majd töltse fel a fájlt, ezt követően automatikusan meg fog jelenni a letöltés gomb.
2. Ha szeretné akkor el is **távolíthatja** vagy **módosíthatja** az ikon betűtípusát, ehhez kattintson az Ikon Listára, majd válassza az Ikon from lehetőséget.
1. Az ikon poziciónálásánál be lehet állítani azt, hogy az ikon jobb vagy bal oldalra legyen igazítva.
2. Ha azt szeretné, hogy a gomb **teljes szélességű stílusban** jelenlen meg akkor, jelölje be a **Stretch** jelölőnégyzetet, és az **Alignment** beállításaival módosíatsa a gombot.
#### LETÖLTÉS GOMB STÍLUSA
A stílusok két lehetőséget biztosítanak: **1)** Elemstílus szerkesztése és **2)** Előredefiniált stílus
1. **Elemstílus szerkesztése** Lehetőséget biztosít egyedi stílusok beállítására mint például a háttér és szövegszín, távolság, szegély, stb.
1. **Előredefiniált stílus** lehetőséget biztosít **class**-ok használatára, ahol több előre definiált gomb közül választhat.
Ez a leírás segítséget ad a Letöltés gomb widget beállításaiban, és a stílusok módosításában.
#### LETÖLTÉS GOMB WIDGET ELHELYEZÉSE
A baloldalon található **Widget Panel**-ről húzza a **Letöltés gomb widget**-et az oldalára.
**Megjegyzés:** A widget az **Alapértelmezett Stílussal** jön létre amelyet a beállított sablon ad, azonban ez szabadon **módosítható**.
- A baloldalon található **Widget Panel**-ről húzza a **Video Lightbox** az oldalára.
- A megjelenő **Video Lightbox** dialógus ablakban válassza a **Youtube** lehetőséget forrásként.
- Ezt követően adja meg a **Youtube Video URL** címét.
- Ha szeretne akkor beállíthat **Cover Image**-t is.
- Válassza a **Vimeo** lehetőséget forrásként.
- Ezt követően adja meg a **Vimeo Video URL** címét.
- Ha szeretne akkor beállíthat **Cover Image**-t is.
- Válassza a **HTML5** lehetőséget forrásként.
- A videó fájl feltöltését követően kattintson a három vízszintes pontra, majd adja meg a videó fájl elérési útját.
**Megjegyzés**: A **HTML5 forrás** esetén ha szeretne beállíthat **Cover image**-t, azonban ezt Önnek kell feltöltenie a beállítás előtt.
**Megjegyzés:** Kérjük ne módosítsa a **Háttérszínt** a **Közösségi ikonoknál** az **előre definiált** stílusokról.
2. Most az alábbi képen látható, hogy a **Size Large** és a **Style is Circular**, így a **Közösségi gombok** stílusa **megváltozott**.
# Kapcsolat űrlap
Ez a leírás segítséget ad a **Kapcsolat űrlap módosításához**.
1.A **Drag and Drop** módszerrel létrehozhat Kapcsolat űrlapot, vagy a már meglévőt szerkesztheti a a baloldali widget panel segítségével, ehhez kattintson a **Dialógus dobozra**. A dialógus dobozban kattintson az **Új mező hozzáadása** lehetőségre ahhoz, hogy új mezőt tudjon hozzáadni a formhoz. Adja meg a gomb nevét, majd jelölje be a **reCAPTCHA használata** lehetőséget, ha szeretné használni. Ha nem tudja hogyan kell beállítani a **reCAPTCHA-t** akkor az alábbi cikket: [reCAPTCHA beállítása a kapcsolat űrlaphoz](https://dotroll.com/hu/tudasbazis/recaptcha-hozzaadas/)
2.Most válassza ki az **Egyeztetés** a kapcsolatfelvételi űrlaphoz követelményeit. **Űrlapazonosító** és **űrlap neve** ez a mező az **E-mail sablonban** használható.
3.Új mezők hozzáadásához kattintson az **Új mező hozzáadása** gombra. Az újonnan hozzáadott mező testreszabásához kattintson az adott mezőre az alábbi képen látható módon.
4.Most írja be a **Címkét** a beviteli mezőbe, és válassza ki a mező típusát. Különböző beviteli típusokkal rendelkezünk, mint például a **Szöveg** ami nevekhez vagy vezetéknevekhez használható, **E-mail** az e-mail címekhez, a **Textarea** pedig az üzenetekhez stb.
5.A fájlfeltöltés kapcsolattartó űrlapon való hozzáadásához válassza a **File** lehetőséget a legördülő listából.
6.Jelölje be a **Use Label as Placeholder** mezőt a címke elhelyezéséhez. Ha bármelyik mezőt **kötelező mezőként** kívánja használni, akkor jelölje be a **Required** mezőt. Adja meg a **CSS class**-t és az **ID**-t, ha szüksége van rá.
7.Hozzáadhat több beviteli mezőt a **Kapcsolat űrlaphoz**.
8.Beállíthat **Választ** is ha szeretne.
9.Ezen felületen lehetősége van **Egyedi stílust** beállítani a **Kapcsolat űrlaphoz**.
# Diagram
Ez a leírás segítséget ad a **Diagram Widget** beállításához, és szerkesztéséhez.
#### DIAGRAM WIDGET MOZGATÁSA
**Drag and Drop** módszer segítségével adhat Diagram Widgetet az oldalához.
#### DIAGRAM CÍM, ÉS TÍPUS
Beállítható a **Diagram címe** és kiválasztható a **Diagram típusa**. Többfajta előredefiniált diagram típusból választhat mint például oszlop diagram, vízszintes oszlop diagram, terület diagram, előzmény, vonal diagram, stb. Alapértelmezésben az **oszlop diagram** kerül beállításra amikor a widgetet beállítja.
#### DIAGRAM SZÍN
Lehetősége van a **diagram színének** módosítására, valamint a **háttérszínt** is módosíthatja ha bejelöli a **remove** opciót a diagramnál.
#### DIAGRAM ADATOK
Adja meg a diagram adatait a **Data Textarea** mezőben, oszlopos adatok esetén vesszővel válassza el az egyes értékeket.
# Lista
Ez a leírás segítséget ad a **Lista Widget** szerkesztésében, beállításaiban, és a stílusokban.
#### LISTA WIDGET MOZGATÁSA
A **Fogd meg és dobd** segítségével lista widgetet adhat az oldalához.
**Megjegyzés:** A widget az **Alapértelmezett stílus** beállításokkal jön létre a sablon alapján, azonban ez **módosítható** amennyiben szeretné.
Ez a leírás segítséget ad a **Lista Widget** szerkesztésében, beállításaiban, és a stílusokban.
#### LISTA WIDGET MOZGATÁSA
A **Fogd meg és dobd** segítségével lista widgetet adhat az oldalához.
**Megjegyzés:** A widget az **Alapértelmezett stílus** beállításokkal jön létre a sablon alapján, azonban ez **módosítható** amennyiben szeretné.
# Elsődleges menü
Amikor az elsődleges **Sablon** kiválasztásra kerül akkor automatikusan létrejön az előre meghatározott stílus alapján a **Menü**, de ha szeretné akkor lehetőség van a **Menü személyre szabására** ebben segít ez a leírás.
1.Fogja és vigye az **Elsődleges menü**-t a baloldali oldalsávban található widget részlegről, vagy válassza az **Elsődleges menü részleget** a **Fejléc** oldalon ha az megjelenik. Ez a művelet egy előugró ablakot fog megjeleníteni a **Elsődleges menü**-höz.
2.A **Beállítások** részén a **Dialógus doboz**nál több lehetősége is van a menü **egyediesítésre** mint például a szövegek színe, háttérszín, szöveg méret, stb. Állítsa be a kívánt paramétereket.
3.Az utolsó elem segítségével módosítható az **Almenü elemek** stílusa, ha szüksége van rá akkor jelölje be.
4.Válassza ki a színt, háttérszínt, szöveg méretet az **Almenüpontok**hoz.
A képen beállított almenü stílus a következőképp fog megjelenni.
5.Ha szeretne egyedi stílust beállítani az **Aktív oldal menü elemhez** akkor jelölje be az **Aktív oldal effekt** jelölő négyzetet, majd állítsa be a színt, háttérszínt.
A képen a beállított Aktív oldal menü elem stílusa látható.
6.Ha szeretne egyedi stílust hozzáadni a **lenyitható gombhoz** akkor jelölje be a **Reszponzív Menü stílust** jelölő négyzetet, majd állítsa be a színt, háttérszínt.
7.Ezen felül lehetősége van egyedi betűtípust, menü magasságot, színt és háttérszínt beállítani.
8.Módosítható az **aktív menü elem** színe, háttérszíne, valamint a hover szín is.
# Audió
Ez a leírás segítséget ad az Audió widget beállításaiban és a stílusok módosításához.
#### AUDIÓ HASZNÁLATA URL-KÉNT
- Húzza az **Audió** elemet a baloldali **Widget Panel**-ről, és engedje el ott ahol használni szeretné.
- A megjelenő dialógus ablakban az **Audió**-nál válassza az **Audio file URL** lehetőséget ahhoz, hogy URL-t adhasson meg az audió fájlnak.
- Miután megadta az **Audio URL** mezőben az Audio file URL szekcióban az meg fog jelenni.
- Jelölje be az Automatikus lejátszási lehetőséget, ha szeretné, hogy az audió automatikusan elinduljon az oldal betöltődést követően.
- Jelölje be a Repeat lehetőséget, ha azt szeretné, hogy az audi fájl folyamatosan kerüljön lejátszásra.
#### AUDIÓ HASZNÁLATA MÉDIA ELEMKÉNT
- Húzza az **Audió** elemet a baloldali **Widget Panel**-ről, és engedje el ott ahol használni szeretné.
- A megjelenő dialógus ablakban az **Audió**-nál válassza a **Media Library** lehetőséget a feltöltéshez.
- Ezt követően kattintson a három pontra a feltöltéshez.
- Jelölje be az Automatikus lejátszási lehetőséget, ha szeretné, hogy az audió automatikusan elinduljon az oldal betöltődést követően.
- Jelölje be a Repeat lehetőséget, ha azt szeretné, hogy az audi fájl folyamatosan kerüljön lejátszásra.
# Ikon
Ez a leírás segítséget ad az **Ikon Widget** szerkesztésében, beállításában.
#### IKON WIDGET MOZGATÁSA
Amikor egy Ikon widgetet **mozgat** az oldalán akkor egy menü fog megjelenni.
#### IKON WIDGET BEÁLLÍTÁSAI
A dialógus ablak megnyílását követően lehetősége van az **Ikon** módosítására a lita alapján, valamint az **Ikon színe** is kiválasztható.
Az Ikon méretei eltérőek azonban **előre meghatározottak** minden ikon esetén, a **lehulló listából** kiválasztható az ikon mérete, de választhat **egyedi méretet** is, ehhez válassza az **egyedi** lehetőséget a lehulló listából.
Az **ikon igazítással** lehetősége van az ikont az oldalon belül poziciónálni.
#### HÁTTÉR STÍLUS SZERKESZTÉSE
Szerkesztheti az ikon **háttér alakját** mint például kör, négyzet, lekerekített, szerkezeti kör, szerkezeti négyzet, szerkezetileg lekerekített, és nincs.
Az ikon háttér méret segítségvel **teret** adhat az **Ikon** köré, és a háttérszín segítségével módosíthatja az ikon háttérszínét.
A megjelenési **Effekt** segítségével animálhatja az ikon megjelenését, ilyen lehet a fentről lefelé, lentről felfelé, balról jobbra, jobbról balra, vagy nincs.
#### EGYEDI IKON HIVATKOZÁS
Az egyedi hivatkozás segítségével **hivatkozást** tud beállítani az ikonhoz.
# Google Analytics
**Google Analytics** egy webes analitikai szoftver amelyet a Goole ajánl weboldalak követésére, valamint a weboldal forgalmának áttekintésére.
A használathoz szükséges egy követő ID-re (tracking ID) amely beszerezhető a fiók létrehozását követően a [Google Analytics](https://analytics.google.com/) oldaláról
További információért látogassa meg a következő Google által készített oldalt itt: [Getting Started with Analytics](https://support.google.com/analytics/answer/1008015?hl=en)
#### Bejelentkezés a kezelő felületre
Először jelentkezzen be a kezelő felületre (például cPanel esetén a [https://domain.tld:2083](https://domain.tld:2083/)) majd kattintson a SitePad ikonra.
A rendszer ezt követően át fogja irányítani a SitePad kezelő felületére.
#### Ugrás a Google Analytics menüpontra
A felületen a baloldali menü sávban kattintson a Settings , majd a megjelenő lehulló listában a **Google Analytics** menüpontra.
Az oldal betöltődését követően adja meg a **Google Analytics** oldalán kapott **tracking ID**-t majd kattintson a mentés gombra.
A weboldal közzétételét követően a [Google Analytics](https://analytics.google.com/) felületén keresztül lehetősége lesz a weboldal forgalmának követésére.
Tovább információt a Google Csapat oldalán találhat: [How to Check Your Web Stats](https://support.google.com/analytics/answer/1008083?hl=en)