3. KORAK: Pojavna okna

V tretjem koraku ustvarite pojavno okno. Oblikujte ga tako, da bo v skladu z vašo celostno podobo. Barve naj bodo kontrastne barvi ozadja vaše spletne strani, saj ga bodo tako obiskovalci prej opazili. Več o oblikovanju si lahko preberete tudi na našem blogu.

Navodila za ustvarjanje pojavnega okna:

Pred izdelavo pojavnega okna morate imeti določena vnosna polja (polja po meri – email, ime, priimek, spol,…), ki jih boste vstavili v pojavno okno. Ta polja ustvarite v Prejemniki > Polja po meri. Navodila za izdelavo novih Prejemnikovih polj si lahko preberete tukaj.

Sedaj se lahko lotite izdelave obrazca, ki je prikazan spodaj

1. V glavnem meniju zgoraj izberite Obrazci > POJAVNA OKNA > Pojavna okna. 

2. V funkcijskem meniju desno zgoraj kliknite na Ustvari novo, da ustvarite novo pojavno okno.

Odpre se vnosna maska, kjer v levem stolpcu urejate nastavitve in obliko pojavnega okna, v desnem stolpcu pa je viden predogled. S klikom na ikono žebljička desno zgoraj, vam bo predogled sledil med urejanjem.

VNOSNA POLJA NA POJAVNEM OKNU

Privzeti obrazec pojavnega okna že vsebuje polje za email naslov. Če želite dodati tudi druga vnosna polja (polja po meri), jih izberite s klikom nanje pod predogledom. Navodila, kako ustvarite novo vnosno polje si lahko preberete tukaj.

Vrstni red polj lahko urejate na samem predogledu. Ko se postavite z miško na polje, se pojavijo puščice za premik gor oziroma dol. S klikom na znak X lahko polje tudi odstranite.

Ime oznake, napis v polju ali dodatni opis pod poljem lahko spreminjate s klikom na znak za urejanje, tako, da se z miško postavite na polje.

Odpre se vam novo modalno okno, kjer spremenite tekst in za potrditev sprememb kliknite Shrani. Na ta način lahko prevedete obrazec tudi v katerikoli jezik.

Če ste določenim poljem po meri nastavili pogoje prikaza oziroma privzeto vrednost, se bo na vnosnih poljih izpisalo opozorilo (ko se boste z miško postavili na vnosno polje na pojavnem oknu). Vnosna polja, ki se prikazujejo le pod pogojem, morate prav tako vstaviti v pojavno okno.

Privzeta vrednost polja bo vidna šele ko se bo pojavno okno prikazalo na spletni strani. Urejate jo v nastavitvah polja po meri. Če ste polju določili prevzeto vrednost tako ne bodo vidne spremembe napisa v polju.

NASTAVITVE POJAVNEGA OKNA

  1. Naslov
    Vpišite naslov oziroma ime pojavnega okna. Namenjeno je predvsem temu, da ga vi prepoznate. Ta podatek je obvezen.
  2. Komentar
    Tu lahko vpišete poljuben komentar/opis, ki je viden tudi v seznamu vseh pojavnih oken.
  3. Tip zamika pojavnega okna in Vrednost zakasnitve pojavnega okna
    Izberite tip zamika, po katerem se bo prikazovalo pojavno okno in v polje spodaj vpišite želeno vrednost:

    • Časovni zamik – okno se bo pokazalo po določenem času. V polje spodaj vpišite število sekund, brez enot.
    • Zamik po straneh – okno se bo prikazalo po tem, ko bo uporabnik obiskal določeno število strani. V polje spodaj vpišite število strani. Vrednost vpisujte brez enot.
    • Zamik na strani – pojavno okno se bo prikazalo po tem, ko bo uporabnik pregledal določen procentualni del te spletne strani (npr. 50%). V polje spodaj vpišite število, brez enot.
  4. Pozicija pojavnega okna
    Določite tip pojavnega okna. Ali je to sredina zaslona (pop-up), ali pa se okno pojavi nemodalno iz strani (pop-out).
  5. Št. dni do ponovnega prikaza
    Določite število dni, po katerih se uporabniku (v primeru, da zapre pojavno okno ali se prijavi) ponovno prikaže pojavno okno. Če ste to nastavitev določili globalno (v nastavitvah spletnih mest), bo vidna tukaj.
  6. Prikaži pojavno okno tudi uporabnikom, ki so prišli na stran preko newsletterja
    Če želite, da se vašim prejemnikom ne prikazujejo pojavna okna, ko pridejo na vašo spletno stran preko newsletterja, označite to možnost na NE. Ta nastavitev vam tako omogoča, da vaših prejemnikov ne pozivate ponovno k prijavi na mailing listo.
  7. Preusmeri po prijavi
    Tu lahko izberete, ali prejemnika po prijavi preusmeri na Zahvalno stran ali na vaš poljuben URL naslov.

    • Če izberete Zahvalno stran lahko tudi uredite besedilo le-te. V polja vstavite naslov zahvalne strani, tekst, ki se bo prikazal pod naslovom in besedilo gumba. Gumb vsebuje povezavo do strani, na kateri je bilo pojavno okno. Te povezave ni možno spreminjati.
    • Če izberete Poljuben URL, v polje URL vstavite želeno povezavo.
  8. Ob prijavi pošlji obvestilo na
    Tukaj lahko vpišite email naslov, na katerega prejemate obvestila o novi prijavi na seznam, torej o novem prejemniku. Če ne želite prejemati obvestil, pustite prazno.

 

OBLIKA POJAVNEGA OKNA

  1. Radij zaobljenosti okna
    S pomočjo spustnega polja lahko izberete poljuben radij zaobljenosti okna.
  2. Širina okna
    S pomočjo spustnega polja lahko izberete eno izmed štirih velikosti pojavnega okna.
  3. Odmik elementov od roba okna
    S pomočjo spustnega polja lahko izberete, za koliko pikslov (px) bodo elementi odmaknjeni od notranjega roba okna.
  4. Razmik med elementi
    S pomočjo spustnega polja lahko izberete, za koliko pikslov (px) bodo elementi razmaknjeni.
  5. Barva ozadja
    Barvo vpišite v polje (v hex vrednosti) ali jo izberite s klikom na barvno okence, tako da kliknete na želeno mesto na barvni paleti in izberete OK.
    Transparentnost ozadja obrazca
    Nastavite lahko tudi transparentnost barve ozadja. Če želite, da okno prevzame barvo in vzorec ozadja spletne strani, nastavite transparentnost barve ozadja na nič.
  6. Barva sence okna
    Barvo vpišite v polje (v hex vrednosti) ali jo izberite s klikom na barvno okence, tako da kliknete na želeno mesto na barvni paleti in izberete OK.
  7. Transparentnost sence obrazca
    Nastavite lahko tudi transparentnost barve sence. Če želite, da senca okna prevzame barvo in vzorec ozadja spletne strani, nastavite transparentnost barve sence na nič.

 

LASTNOSTI SLIKE

Sliko vstavite v pojavno okno na enak način kot vnosna polja. Pod predogledom kliknite na polje Slika okna.

  1. URL slike obrazca
    Izberite sliko. S klikom na gumb Izberi se vam odpre Brskalnik slik, kamor lahko naložite novo sliko, jo izberete iz že naloženih slik, ali pa jo vstavite kot URL naslov.
  2. Velikost slike
    S pomočjo spustnega polja izberite velikost slike in jo tako pomanjšajte ali povečajte.
  3. Pozicija slike
    S pomočjo spustnega polja izberite horizontalno pozicijo slike (levo, center, sredinsko). Če želite spremeniti vertikalno pozicijo slike, se z miško postavite na sliko na predogledu in kliknite na puščico gor oziroma dol ali na X za odstranitev.

 

LASTNOSTI VSEBINE

V pojavno okno lahko dodate dva napisa. Z Napisom 1 na primer sporočite namen prijave (»Prijavite se na e-novičke«) z Napisom 2 pa enostavno možnost odjave (»Odjava je preprosta!«).

Napis vstavite v pojavno okno na enak način kot vnosna polja. Pod predogledom kliknite na polje Napis 1 ali Napis 2.

Če ste v pojavno okno dodali Napis 1 (oz. Napis 2), sedaj uredite njegovo vsebino in obliko:

  1. Vnesite besedilo
    V polje za tekst vnesite poljubno besedilo. Spremembe so takoj vidne na predogledu.
  2. Poravnava
    S pomočjo spustnega polja izberite horizontalno poravnavo napisa (levo, center, sredinsko). Če želite spremeniti vertikalno pozicijo napisa, se z miško postavite nanj na predogledu in kliknite na puščico gor oziroma dol ali na X za odstranitev.
  3. Pisava
    S pomočjo spustnega polja izberite vrsto pisave napisa.
  4. Velikost
    S pomočjo spustnega polja izberite poljubno velikost pisave napisa (majhno, normalno, veliko, zelo veliko).
  5. Barva
    Barvo vpišite v polje (v hex vrednosti) ali jo izberite s klikom na barvno okence, tako da kliknete na želeno mesto na barvni paleti in izberete OK.

 

LASTNOSTI POLJ

Tukaj urejate izgled vnosnih polj, kjer nastavite:

  1. Radij zaobljenosti polj
    S pomočjo spustnega polja izberite poljuben radij zaobljenosti robov polj.
  2. Barva pisave polj po meri
    Ta nastavitev velja za posebna vnosna polja, torej tipe polj, kot so Radio gumbi, Potrditveno polje in Prijava na sezname. Tako lahko prilagodite barvo pisave poleg gumbov, tako da je kontrastna barvi ozadja.

LASTNOSTI OZNAK

Tukaj urejate izgled oznak vnosnih polj, kjer nastavite:

  1. Predlogo obrazca
    S pomočjo spustnega polja lahko izberete horizontalno predlogo (oznaka je poleg polja), vertikalno predlogo (oznaka je nad poljem) ali predlogo brez oznak.
  2. Poravnavo oznak
    S pomočjo spustnega polja izberite poravnavo oznak.
  3. Vrsto pisave
    S pomočjo spustnega polja izberite poljubno vrsto pisave oznak.
  4. Velikost pisave
    S pomočjo spustnega polja izberite poljubno velikost pisave oznak.
  5. Barvo pisave
    Barvo vpišite v polje (v hex vrednosti) ali jo izberite s klikom na barvno okence, tako da kliknete na želeno mesto na barvni paleti in izberete OK.

LASTNOSTI POTRDITVENEGA GUMBA

  1. Tekst gumba
    Vpišite tekst, ki bo prikazan v gumbu (največ 32 znakov).
  2. Vrsta pisave
    S pomočjo spustnega polja izberite poljubno vrsto pisave gumba.
  3. Velikost pisave
    S pomočjo spustnega polja izberite poljubno velikost pisave gumba.
  4. Barva pisave
    Barvo vpišite v polje (v hex vrednosti) ali jo izberite s klikom na barvno okence, tako da kliknete na želeno mesto na barvni paleti in izberete OK.
  5. Barva ozadja
    Barvo vpišite v polje (v hex vrednosti) ali jo izberite s klikom na barvno okence, tako da kliknete na želeno mesto na barvni paleti in izberete OK.
  6. Pozicija
    S pomočjo spustnega polja lahko gumb poravnate na sredino, na levo ali na desno stran pojavnega okna.
  7. Radij zaobljenosti
    S pomočjo spustnega polja izberite radij zaobljenosti gumba v pikslih.
  8. Razred prilagoditve
    Sem lahko vpišete HTML razred gumba (Class), v kolikor želite imeti vaš stil gumba.

LASTNOSTI GUMBA ZA ZAPIRANJE (X)

  1. Velikost gumba za zapiranje (X)
    S pomočjo spustnega polja izberite poljubno velikost gumba za zapiranje.
  2. Barva gumba za zapiranje (X)
    Barvo vpišite v polje (v hex vrednosti) ali jo izberite s klikom na barvno okence, tako da kliknete na želeno mesto na barvni paleti in izberete OK.

 

3. Pojavno okno shranite s klikom na Shrani in zapri v funkcijskem meniju zgoraj desno.

 

Sedaj ste ustvarili pojavno okno. Naslednji in zadnji korak je ta, da povežete pojavno okno s podstranjo. Definirajte torej pravilo prikazovanja pojavnega okna.

4. KORAK: Pravila pojavnih oken >>>