Pozdrav prijatelji! Predlažem da razgovaramo o stvaranje modalnih prozora u WordPressu. Skočni (modalni) prozori značajno proširuju mogućnosti stranice. Imate poruku ili oglas koji bi svaki posjetitelj web stranice trebao vidjeti? Trebate li svoju kampanju učiniti vidljivom? Želite li napraviti pop-up obrazac za registraciju na vašoj web stranici ili obrazac za dijeljenje sadržaja na društvenim mrežama? Napravite modalni prozor!

Pop-up modali dizajnirani su da privuku pozornost. Pojavljujući se na stranici, blokiraju glavni sadržaj i prisiljavaju korisnika da se upozna s njihovim sadržajem (tekst, video, poziv na akciju itd.).

Pažnja! Neka vas ne uplaši duljina ove lekcije - nema poteškoća u stvaranju modalnih prozora (pročitajte i uvjerite se sami), samo detaljno opisujem svaki korak.

Algoritam za kreiranje modalnih prozora u WordPressu

WordPress nema ugrađene alate za rad sa skočnim prozorima. Dizajnirat ćemo ih i prilagoditi pomoću dodatka Izrađivač skočnih prozora. Napravimo, na primjer, modalni prozor s videom, skočni prozor kada kliknete gumb(možete ga konfigurirati kasnije automatski izgled).

1. Instalirati Dodatak za izradu skočnih prozora. Aktivirati njegov. Dopustite mi da vas podsjetim: naučili smo kako instalirati dodatke.
   
2. Pronađite odjeljak u bočnom izborniku na lijevoj strani administratorske ploče Izrađivač skočnih prozora i idite na njegov pododjeljak Dodaj skočni prozor.
3. Otvara se uređivač modalnog prozora. Unesite naziv prozora u polje na vrhu stranice (naziv će biti prikazan samo u administratorskoj ploči - korisnici ga neće vidjeti).
4. Dosjetiti se naslov prozora(bit će vidljiv korisnicima) i unesite ga u polje iznad gumba Dodajte medijsku datoteku.
5. U bloku Uvjeti Odaberite iz padajućeg izbornika stranice (kategorije) na kojima će se pojaviti prozor. Ako dodatak treba raditi na svim stranicama stranice, Izaberi Format: Sve.
6. Dodajte u veliko polje ispod alatne trake tekst, slike, video ili audio– bilo koji sadržaj koji će se prikazati u skočnom prozoru. U primjeru koji razmatram dodao sam kod za video s YouTubea (proučavali smo dodavanje videa na WordPress stranicu).
   
7. U bloku Okidači Postoje postavke za ručno ili automatsko otvaranje (samoaktivacija) skočnog prozora. U našem primjeru sam odabrao vrijednost Pritisnite Otvori.
8. Navedite u nastavku veličina skočnog prozora(u pikselima ili postocima). Prilikom odabira opcije Auto Dodatak će automatski promijeniti veličinu modalnog prozora.
9. Označite okvir u retku Onemogući pozadinu tako da je stranica stranice vidljiva iza skočnog prozora (preporučujem).
10. Postaviti vrstu i brzinu animacije(nije potrebno: optimalne vrijednosti već su postavljene prema zadanim postavkama).
    
11. Podesite položaj prozora na ekranu. U početku ga dodatak postavlja u sredinu na vrhu.
12. Vrijednost imovine z-indeks, postavljen prema zadanim postavkama, obično se ne mora mijenjati.
    
13. Odaberite opcije za zatvaranje skočnog prozora. Označite potvrdne okvire u redovima s "pticama" Pritisnite Preklapanje za zatvaranje(prozor će se zatvoriti kada kliknete na pozadinu oko njega), Pritisnite F4 za zatvaranje(prozor će se zatvoriti tipkom F4), Pritisnite ESC za zatvaranje(prozor će se zatvoriti tipkom ESC). Kako ne biste gnjavili posjetitelje web stranice zagonetkom zatvaranja modalnog prozora, preporučujem da označite sve okvire.
    
14. Klik Objaviti.Čestitamo, vaš modalni prozor je stvoren!

O prilagodbi dizajna skočnog prozora

Da biste promijenili dizajn kreiranog modalnog prozora, idite na pododjeljak Tema odjeljak Izrađivač skočnih prozora bočni izbornik administratorske ploče (lijevo).

U uređivaču koji se otvori konfigurirajte željena pozadina prozora, boja I veličine fonta, ispuna, sjene, naziv gumba zatvaranje. Okus i boja... znate, pa neću ulaziti u detalje o prilagođavanju dizajna skočnog prozora. Ako imate pitanja, postavite ih u komentarima.

Kako postaviti skočni prozor

Zapamtite, nismo omogućili funkciju automatskog otvaranja modalnog prozora u postavkama dodatka? Stoga moramo smisliti kako će se naš prozor otvoriti. Postavimo prozor koji će iskočiti kada kliknete na poveznicu, sliku ili gumb.

Dodatak Popup Make dodjeljuje svaki prozor dvije jedinstvene CSS klase. Ako bilo koju od ovih klasa dodate elementu web stranice, kada kliknete na taj element, otvorit će se modalni prozor.

Gdje i kako povećati komentare na Instagramu – sve metode. Portal pricesmm.com otkrio je što je jeftinije i bolje: sami povećati komentare na Instagramu, programima, dobiti u zamjenu ili naručiti uslugu na SMM servisu. Za i protiv svake metode.

Primjeri dodavanja CSS koda modalnog prozora na vezu, sliku i gumb:

< a href = "#" class = >Otvori modalni prozor< / a >

Kada kliknete na sliku pojavit će se modalni prozor

< img src = "popup-primer.jpg" class = "popmake-obrazets-modalnogo-okna"/ >

Modalni prozor se aktivira nakon klika na gumb

< button class = "popmake-obrazets-modalnogo-okna"> Otvori modalni prozor< / button >

Kliknite na HTML element nakon što ste mu dodali CSS klasu popmake-obrazets-modalnogo-okna. Trebao bi se pojaviti modalni prozor sličan ovome:

Je li se pojavilo? Sjajno! Sada možete konfigurirati skočne prozore. Ako se prozor ne otvori, opišite problem u komentarima - pokrenut ćemo ga zajedno!

Pozdrav, dragi čitatelji bloga. Primjećujete li skočne prozore na nekim web stranicama? Pojavila su se pitanja: kako se izrađuju i zašto su uopće potrebni? Imam da.

Dakle, prijatelji, danas ću vam reći točno o njima. Ali! Hajdemo prvo saznati zašto nam uopće trebaju? Što možete dobiti od njih i kakav će biti rezultat? Ja odgovaram.

Kroz takve skočne prozore učinak utjecaja je vrlo velik. Kažu da se ponekad dogodi da se broj pretplatnika poveća 4 puta. cool! Nije li? Korištenje skočnih prozora (popunders) vrlo je učinkovit način privlačenja velikog broja posjetitelja. Obično se koriste za:

• bilten;
• PR za plaćene tečajeve;
• promicanje grupa na društvenim mrežama mreže;

Moram vas podsjetiti da ponekad takvi skočni oglasi mogu naštetiti stranici. To je zbog činjenice da nekim korisnicima to jako smeta. Što reći, i mene jako ljute takve metode privlačenja pažnje. Kao odgovor na sve to dolazi do porasta kvarova na stranici od 100%, što je štetno.

Ali! Svi ovi problemi mogu se zaobići ako je skočni prozor ispravno konfiguriran.

Dakle, vratimo se našem glavnom pitanju.

Skočni prozori na WordPressu

1.WP-MK

Cool dodatak na koji sam slučajno naišao. Jednostavan za postavljanje, sučelje na ruskom jeziku i čitav niz alata. Savršeno je za:

• Oglašavanje (na primjer, Google Adsense);
• PR vaših grupa na društvenim mrežama. mreže;
• Jednostavan obrazac za pretplatu.

Dodatak možete preuzeti s . Zatim ga instaliramo i aktiviramo na uobičajeni način. Ići na postavke s lijeve strane? skočni prozor i vidimo sljedeće:

Po mom mišljenju, ovdje je sve jednostavno; ne vidim smisla rastavljati sve zasebno. Ako imate pitanja, možete ih postaviti u komentarima.

2. Ninja skočni prozori.

Ako želite da korisnici dobiju "Wow" kada posjete vašu stranicu i vide skočni prozor, instalirajte ovaj mega cool dodatak. Ninja Popups je pop-up čudovište na . U usporedbi s WP-MK daleko je superiorniji po funkcionalnosti. Primijetio sam da Ninja Popups koriste majstori svog zanata. Zašto? Dodatak se plaća i ne može ga svatko priuštiti. Za sebe mogu reći da su im cijene prihvatljive, ne traže puno. Možete saznati više o cijeni Ovdje.

Pa, saznajmo što točno dobivamo od ovog dodatka:

• jednostavnost postavki;
• više od 100 gotovih predložaka za pretplate i druge vrste oglašavanja (natjecanja, promocije, tečajevi itd.);
• statistika;
• mobilna verzija skočnog prozora;
• napredno podešavanje vremena prikaza;
• I mnogo više.

Ako želite saznati više o svim prednostima dodatka, idite na ovaj veza.

Kako prilagoditi dodatak za sebe? Predlažem sljedeće... Umjesto dosadnog teksta, bolje je pogledati video trening:

To je sve, prijatelji, što se tiče postavki. Ali ipak, ako imate pitanja, postavite ih u komentarima.

3. Popup Maker (modalni prozor)

Dodatak koji ima funkciju stvaranja modalnog skočnog prozora. U našem slučaju, skočni prozori će se prikazati kada kliknete na:

• veza;
• dugme;
• slika.

Dakle, kako to postaviti?

1. preuzimanje datoteka uključiti;

2. Instalirajte i aktivirajte;

3. S lijeve strane u izborniku tražimo: Pupup Maker -> Dodaj novo.

4. Pred nama će se pojaviti ovakva stranica:

Ne podsjeća te ni na što? Stranica je potpuno ista kao obrazac za objavljivanje članaka na WordPressu. Kao što vidite, ovdje su dodane neke dodatne funkcije (postavke).

Pogledajmo ih detaljnije.

Skočni prozor (naziv)- neće se nigdje prikazati, ovdje dajemo naziv našem skočnom prozoru u dodatku.

Ovdje unesite naslov prozora- napišite naziv (na primjer: pretplata na vijesti).

Uvjeti ciljanja- označite kućicu gdje će biti prikazan naš prozor.

Postavke teme - ovdje još nema opcija. Odaberite prema zadanim postavkama. Prijatelji, ubuduće možete izraditi vlastiti predložak za dizajn modalnog prozora. Usput, funkcija je vrlo cool. Možete ga pronaći: Pupup Maker -> Sve teme.

Kod - što će biti prikazano u prozoru. U našem slučaju, video s YouTubea:

U nastavku nas čekaju ostale postavke (veličina prozora, prozirnost, vrijeme prikaza itd.). Tu nema ništa komplicirano. Nadam se da ćeš to moći podnijeti. Ako imate pitanja, slobodno ih postavite u komentarima.

Nakon što su sve postavke napravljene, ostaje nam samo objaviti skočni prozor.

Ali prijatelji nisu sve. Idi na odjeljak Pupup Maker -> Svi skočni prozori. Tražimo CSS tečajeve. Zanima nas ovakav kod: popmake-xxx.

Ovaj kod nam je potreban za prikaz prozora kada kliknemo na link, sliku ili gumb (rekao sam na početku).

Otvaranje prozora kada kliknete na sliku:

Otvaranje pritiskom na tipku:

< button class = "popmake-xxx" >Otvoreni prozor

Ovaj kod možete umetnuti bilo gdje (na primjer, u članak ili widget). Nema razlike. Ako imate problema ili pitanja, pitajte u komentarima, rado ću vam pomoći.

Na ovoj veseloj noti završava popis skočnih dodataka za WordPress. Nadam se da ćete među ova tri pronaći onaj koji vam se sviđa. Hvala ti što si bio uz mene do kraja.

Za ažuriranja sudjelujte u . Vidimo se uskoro. Cao svima!

Srdačan pozdrav, Mogish Ivan

Možete saznati da je pop-up prozor prozor koji se otvara na zaslonu računala kao rezultat izvođenja neke operacije.

U ovom ćemo članku pogledati stvaranje PopUP skočnih prozora za WordPress.

Ova vrsta skočnih prozora može se koristiti u različite svrhe: u ovaj prozor možete umetnuti obrazac za pretplatu, neku vrstu informativne poruke, sliku, obrazac za kontakt itd.

Kao alat za stvaranje skočnih prozora u ovom ću članku razmotriti poseban dodatak za WordPress pod nazivom WordPress skočni prozor.

WordPress PopUp dodatak za stvaranje skočnih prozora

Ovaj je dodatak dostupan u direktoriju dodataka u administratorskom području WordPressa, tako da je instaliranje jednostavno.

Pronađite ga kroz obrazac za pretraživanje i kliknite Instalirati:

Nova stavka postat će dostupna u izborniku administratora Iskočiti:

Ova stavka vam omogućuje da konfigurirate dodatak i upravljate njegovim funkcijama. Razmotrimo sve gore navedeno detaljnije.

U podstavku Skočni prozori točka Iskočiti Dostupni su svi postojeći skočni prozori i njihovo upravljanje. Budući da prozor još nije kreiran, stavka je prazna:

Ispravimo ovu situaciju i stvorimo svoj prvi skočni prozor, za to idemo na podstavku Dodaj novi i pritisnite istoimeni gumb:

Stvoren je novi prozor. Odmah odlučimo što će biti sadržaj ovog prozora, neka to bude, na primjer, obrazac za pretplatu.

Počnimo s postavljanjem kreiranog skočnog prozora ispisivanjem njegovog naziva, odnosno određenog identifikatora po kojem ćemo taj prozor pronaći među ostalima, ako postoje.

Ovaj identifikator upisuje se u stupac Naziv skočnog prozora (nije prikazan na skočnom prozoru), i, kao što nije teško pogoditi iz naziva ovog stupca kada se prevede na ruski, on se ne prikazuje u samom skočnom prozoru:

Ovi naslov i podnaslov bit će prikazani na samom vrhu skočnog prozora.

Odmah ispod, u području tzv Glavni skočni sadržaj Moramo smjestiti glavni sadržaj našeg skočnog prozora. Budući da sam odlučio postaviti obrazac za pretplatu u ovaj prozor, u ovom području u uređivaču teksta pišem točno kod za obrazac za pretplatu:

Ovdje, malo desno, u dijelu Slika značajke u skočnom prozoru (nije obavezno) Možete implementirati umetanje bilo koje slike u skočni prozor:

Neću ubaciti sliku.

Malo niže, u odjeljku Gumb poziva na radnju (neobavezno) U stvoreni prozor moguće je dodati gumb s pozivom na neku radnju:

Izrada takvog gumba vrlo je jednostavna - u stupac morate napisati naziv gumba Oznaka gumba, a na grafikonu Veza gumba postavite poveznicu koja aktivira traženu akciju.

Ostalo je utvrditi neke parametre stvorenog Iskočiti prozor. Pogledajmo ih pobliže.

Postavljanje skočnih opcija

Zapravo, nisu sve postavke dostupne u besplatnoj verziji dodatka, a budući da ne želi svaki korisnik potrošiti vlastiti novac na verziju dodatka koja se plaća, prvo ćemo pogledati osnovne postavke dostupne u besplatnoj verziji dodatka. uključiti.

Krenimo redom s odjeljkom Izgled:

Doslovni prijevod naziva ove stavke znači "izgled". Nije teško pogoditi da postavke u ovom odjeljku određuju svojstva skočnog prozora.

Od dodataka dostupnih za besplatnu verziju, ovdje postoji samo potvrdni okvir Nema zaobljenih kutova, kvačica u kojoj se aktiviraju ravni, a ne zaobljeni, kao prema zadanim postavkama, kutovi prilagođenog prozora, kao i mogućnost ručnog određivanja veličine prilagođenog prozora u stavci Koristite prilagođenu veličinu(kvačica u odgovarajućem potvrdnom okviru omogućuje vam da odredite širinu i visinu prozora u pikselima).

Sada pogledajmo odjeljak Ponašanje, postavke u kojima određuju ponašanje skočnog prozora:

Dostupne postavke za besplatnu verziju dodatka uključuju sljedeće:

• Kada prikazati skočni prozor:— vrijeme (u sekundama ili minutama, izborno) od trenutka otvaranja stranice stranice do pojavljivanja skočnog prozora;
• Postavke "Nikad više ne vidi ovu poruku":— postavke koje omogućuju posjetitelju da klikne poseban gumb za blokiranje prikaza skočnog prozora u budućnosti prilikom otvaranja stranica ovog resursa. Ovdje je dostupan samo potvrdni okvir Dodajte vezu "Nikad više ne vidi ovu poruku"., kvačica u kojoj se aktivira pojavljivanje poveznice sa sidrom Nikad više nemoj vidjeti ovu poruku, klikom na koji blokira daljnji prikaz skočnog prozora ovom korisniku na stranicama ovog resursa.

Prijeđimo na odjeljak postavki Prikaz uvjeta (neobavezno) odgovoran za uvjete za prikazivanje prilagođenog skočnog prozora:

Ovdje postoji značajan broj točaka, pogledajmo ih redom:

• Posjetitelj je prijavljen— prikazivanje skočnog prozora korisnicima koji su autentificirani na stranici (ovisno o dostupnosti takve opcije);
• Posjetitelj nije prijavljen— prikazivanje skočnog prozora korisnicima koji nisu autentificirani na stranici;
• Skočni prozor prikazan je manje od— prikazati skočni prozor dok ga korisnik ne vidi određeni broj puta (postavljeno u stupcu Ovo često prikazuj skočni prozor:);
• Samo na mobilnim uređajima— prikazivanje skočnog prozora samo za posjetitelje s mobilnih uređaja;
• Ne na mobilnim uređajima— prikazivanje skočnog prozora samo za posjetitelje s računala ili prijenosnog računala (ne s mobilnih uređaja);
• Od određenog referera— prikazati skočni prozor ako je korisnik došao pomoću posebnog upućivač
• Ne od određenog referera— skrivanje skočnog prozora ako je korisnik došao pomoću posebnog upućivač(ovdje se postavljaju refereri);
• Ne s interne veze— skočni prozor se neće prikazati ako je korisnik došao putem interne veze s druge stranice istog resursa;
• Iz tražilice— prikazivanje skočnog prozora za posjetitelje koji su na stranicu došli s tražilica;
• Na određenom URL-u— prikazati skočni prozor za posjetitelje koji se nalaze na određenim URL Puni URL-ovi;
• Ne na određenom URL-u— prikazati skočni prozor za posjetitelje, s izuzetkom onih na određenim URL, čiji je popis naveden ovdje u stupcu Puni URL-ovi;
• Posjetitelj je već komentirao— prikazivanje skočnog prozora korisnicima koji su ostavili komentare na stranici. Ovo stanje se može kombinirati sa stanjem Posjetitelj je prijavljen ili Posjetitelj nije prijavljen;
• Posjetitelj nikada nije komentirao— prikazivanje skočnog prozora korisnicima koji nisu ostavili komentare na stranici. Ovo stanje se može kombinirati sa stanjem Posjetitelj je prijavljen ili Posjetitelj nije prijavljen.

Pregledali smo sve postavke dostupne za besplatnu verziju dodatka, a sada ćemo ukratko pregledati postavke dostupne samo za plaćenu verziju dodatka WordPress skočni prozor:

Ovo su bonusi koji dolaze s plaćenom verzijom predmetnog dodatka, koja se, usput rečeno, nudi za 19 USD.

Kada ste dovršili sve potrebne korake za izradu i konfiguraciju skočnog prozora, morate spremiti rezultat (gumb Uštedjeti) i pogledajte što se dogodilo pomoću pregleda (gumb Pregledajte skočni prozor):

Ako vam rezultat odgovara, možete aktivirati skočni prozor (klizač Status premjestiti se na položaj aktivan).

U konačnici, nakon svih gore navedenih koraka, dobio sam sljedeći rezultat:

Pokazalo se da je to prilično opsežna recenzija dodatka. WordPress skočni prozor, koji vam omogućuje stvaranje skočnih prozora za internetske resurse pomoću pogona WordPress.

Nakon što pročitate članak, jednostavno možete koristiti funkcionalnost dodatka u svoju korist na svojoj web stranici.

Nedavno su me za jednu stranicu zamolili da izradim obrazac za povratne informacije za WordPress u modalnom prozoru. Odnosno, prilikom klika na poveznicu “pišite nam”, umjesto odlaska na odgovarajuću stranicu, korisnik bi trebao otvoriti novi pop-up prozor, gdje će se nalaziti funkcija slanja poruke. Ovo je interaktivnije rješenje, iako se ne sviđa svima. Ja osobno preferiram klasičnu implementaciju sa stranicom za kontakt, ali obrasci na web stranicama su drugačiji - stoga će biti korisno razmotriti rješenje ovog problema. U svom radu koristio sam 2 dodatka: dobro poznati Contact Form 7 i Easy Modal modul za izradu modalnog prozora u WordPressu.

Ažuriranje 18.5.2017.: Sudeći prema najnovijim recenzijama u repozitoriju, u nekim slučajevima može doći do problema s njegovim radom. Ako i vas to pogađa, isprobajte novo rješenje programera pod nazivom Popup Maker. Može se razmotriti i druga alternativa.

Neću ulaziti u detalje o instaliranju i konfiguriranju kontakt forme 7; Blog je također imao članak o tome što bi moglo biti korisno.

Prijeđimo ravno na modul Easy Modal. Naći ćeš ga. Programeri tvrde da je ovo najbolje rješenje za kreiranje modalnih prozora na web stranici s raznim zanimljivim opcijama za predstavljanje sadržaja.

Preko 10 tisuća preuzimanja, ocjena 4,6. Valjane verzije 3.4 su 4.0.8, iako sam je uspješno pokrenuo na WP 4.3.1. Unatoč činjenici da je dodatak sada transformiran u novo rješenje Popup Maker, na web stranici wordpress.org i kada tražite dodatke unutar admin panela još uvijek možete pronaći uobičajenu Easy Modal verziju 2.0.17. Koristeći njegov primjer, ispričat ću vam o stvaranju modalnog prozora za povratne informacije u WordPressu.

Nakon instalacije pojavit će se istoimeni odjeljak u kojem se nalazi nekoliko stavki. Trebat će nam prvi od njih - Modali. Tamo kliknite gumb Dodaj novo.

Ova će radnja stvoriti novi modalni prozor za vašu WordPress stranicu. Postavke elementa imat će 4 kartice:

• Općenito—opći parametri.
• Display Options - opcije prikaza.
• Close Options - postavke za zatvaranje prozora (klikom ili tipkom Esc).
• Primjeri - primjeri koda za korištenje.

Opće postavke sadrže naziv prozora (nije prikazan na stranici), njegov naslov, sadržaj i vrstu preuzimanja. U bloku sadržaja, prebacujući se u HTML način, dodajte kratki kod obrasca za povratne informacije u modalni prozor.

Vrsta opterećenja ima 2 opcije:

• Load Sitewide (za cijelu stranicu).
• Po stranici/objavi (za određene postove i stranice).

Vrlo zanimljiva opcija. Ako vam je potreban skočni prozor koji će biti prikazan na svim stranicama web mjesta (veza se nalazi na bočnoj traci, na primjer), odaberite prvu opciju. U drugom slučaju, odgovarajući blok postavki pojavit će se na stranicama/objavama web mjesta prilikom uređivanja:

Možete aktivirati i odabrati vlastiti skočni prozor za određenu stranicu. Ako ne označite okvir, element se neće učitati na stranici.

Druga kartica parametara modula je Postavke zaslona.

Ovdje naznačite:

• veličina prozora - automatski, srednji, adaptivni, mali, veliki itd.;
• pozadinu - možete koristiti pozadinu za obrazac ili ga prikazati bez nje;
• animacija skočnog prozora;
• položaj (lokacija) - gore u sredini, dolje desno itd.; fiksni ili ne;
• udubljenje na vrhu ekrana.

Primjeri prikaza izlaza modalnog prozora u WordPressu pomoću dodatka Easy Modal mogu se pronaći u posljednjoj kartici.

Morate umetnuti ovaj kod kroz widget na bočnoj traci ili u uređivaču teksta. Ne razlikuje se od bilo kojeg drugog HTML koda, jedino je ovdje naznačena klasa određenog modalnog prozora (eModal-1). Za drugi element koji ste stvorili, klasa će biti eModal-2, itd. Da ne biste pogriješili kod umetanja koda, najjednostavnije ga je kopirati s ove stranice.

Uređivanje teme modalnog prozora

U dodatku Easy Modal, osim postavki za određeni element, možete definirati teme za skočne prozore (Theme). Osnovna besplatna verzija modula ima samo jedan predložak, ali to je više nego dovoljno.

Ovaj alat ima 6 kartica:

• Općenito - označiti naziv teme;
• Prekrivanje — pozadina (ovdje možete odabrati boju i prozirnost pozadine obrasca);
• Spremnik - različite postavke samog modalnog prozora (padding, frame, shadow);
• Naslov—parametri naslova skočnog prozora (font, sjena);
• Sadržaj — font i boja teksta u bloku;
• Zatvori - element za zatvaranje forme (tekst i dizajn).

Kao što vidite, izgled se može prilagoditi vašim potrebama. Završio sam s ovim jednostavnim WordPress obrascem u modalnom prozoru:

Nakon postavljanja svih postavki, ne zaboravite ih spremiti (kliknite gumb Spremi).

Videozapis dodavanja obrasca za kontakt 7 u skočni prozor Easy Modal

Usput, pronašao sam video o radu s dodatkom Easy Modal, koji demonstrira proces stvaranja prozora za modalne povratne informacije u WordPressu. Tamo je sučelje modula malo zastarjelo (neke postavke izgledaju drugačije), ali možete dobiti opću suštinu. Možda će nekome biti lakše razumjeti ovo pitanje uz pomoć videa.

Ukupno o modalnim prozorima za WordPress

Kao što je gore spomenuto, sada je dodatak Easy Modal (sudeći prema službenoj stranici) pretvoren u Popup Maker. Uspio sam pronaći istoimeni modul u repozitoriju, ali ga nisam testirao. Govorim vam o ovome kako biste znali što trebate tražiti ako Easy Modal u WordPressu u sljedećim verzijama iznenada prestane raditi.

Oba rješenja su besplatna, iako imaju dodatke koji se plaćaju. Omogućuju vam prilagođavanje ciljanja, dodavanje više tema dizajna, sadrže analitiku i neke druge značajke. Ako trebate napredniji modalni mehanizam prozora, možete pobliže pogledati ova proširenja.

Što se tiče zadatka otvaranja obrasca za povratne informacije Contact Form 7 u skočnom prozoru, dovoljne su osnovne mogućnosti Easy Modala. Štoviše, ovo se rješenje može koristiti i za prikaz drugih modalnih prozora u WordPressu - korisni savjeti, dodatne informacije itd. S obzirom na prisutnost uređivača za umetanje HTML koda, možete prikazati videozapise, obrasce itd. u skočnom prozoru. Općenito, koristan dodatak. Ako imate pitanja o tome, napišite u komentarima.

Bok svima!

Popup dodatak WordPress – slojeviti skočni prozori

Dakle, nakon što ga preuzmete s poveznice na kraju posta i instalirate na svoj blog ili wordpress stranicu, što dobivate?

Imat ćete priliku:

stvoriti pop-up prozor;

koristite unaprijed postavljeni skočni predložak;

izradite vlastiti skočni prozor.

Iskreno govoreći, potrošio sam otprilike tjedan dana na prevođenje ovog popup dodatka i trudio sam se da to bude dobro. Nadam se da ćete ga uživati.

Postavke skočnog dodatka

U glavnim postavkama sve je na ruskom, kao što je gore spomenuto. Neće biti ništa komplicirano za vas. Vi birate parametre, testirate ih i odabirete najbolju opciju.

Prilikom izrade novog skočnog prozora imat ćete pristup nizu funkcija putem kojih možete izvršiti potrebne postavke u svom WordPress skočnom prozoru, pri čemu vas nitko ne sprječava da budete kreativni.

Ako vidite tekst poput: "unesite svoju poruku.." - ne brinite, možete ga zamijeniti bilo kojim drugim tekstom i na bilo kojem jeziku koji želite.

Skočni dodatak kartice za slanje pošte

Ovdje ste već sređeni, ali možete unijeti svoj tekst kako želite.

WordPress skočni dodatak za integracije odjeljaka

Za mene osobno to nije od posebnog interesa, ali možda netko koristi usluge trećih strana za slanje e-pošte.

Skočni prozori – A/B kampanje

Ovdje možete kreirati tvrtke i pratiti koji je skočni prozor najučinkovitiji.

Ako vidite da su neki obrasci blokirani, ne brinite, možete ih jednostavno deblokirati, ali u drugom odjeljku.

Odmah ću reći da nisam posebno testirao ovaj odjeljak.

Ako kliknete na gumb "kreiraj", pojavit će se dodatne postavke koje možete prilagoditi svojim potrebama.

Časopis nisam ni testirala pa ću samo njega spomenuti i ništa više..

Popup plugin WordPress – slojeviti Popups ima funkciju koja vam omogućuje preuzimanje i instaliranje dodatnih skočnih prozora, ali problem je što je beskoristan bez kupovnog koda.

Postoji i odjeljak s dodacima, ali, nažalost, i oni koštaju..

Svakako bih prvo pogledao odjeljak s postavkama. Iskreno govoreći, postaviti sve potrebne parametre.

Postoji i odjeljak FAQ - “Frequently Asked Questions”, ali on nema nikakve veze s dodatkom i preusmjerava korisnika na stranicu s odgovorima na engleskom, tako da ga neće biti moguće prevesti.

Sada bih želio dati nekoliko primjera kakve WordPress skočne prozore možete napraviti, čak i koristeći primjere skočnih prozora ugrađenih u dodatak: