Popup-palvelu. Ponnahdusikkuna palautelomake. Kuinka ladata palautelomake

On monia tapoja luoda ponnahdusikkuna verkkosivustollesi. On monimutkaisia ​​tapoja ja on yksinkertaisia. Vaikeita on, että niiden käyttäminen edellyttää ohjelmoinnin tuntemista, ja yksinkertaisiin liittyy kolmannen osapuolen palveluiden käyttö.

Monimutkaisia ​​tapoja

• Javascriptin käyttö

Ohjelmoinnissa päätyökalu ponnahdusikkunan luomiseen on javascript.

• CSS:n käyttö

Tämä vaihtoehto sopii vain uusimmille selaimille, muissa tämä toiminto ei todennäköisesti toimi.

Mutta tässä artikkelissa tarkastelen yksinkertaisia ​​menetelmiä, koska ne voidaan toteuttaa ilman ohjelmointitietoa, joten kuka tahansa voi ottaa ne käyttöön verkkosivustollaan.

Yksinkertaisia ​​tapoja

Esitän huomionne joukon parhaita palveluita ponnahdusikkunoiden - ponnahdusikkunoiden - luomiseen. Mitä tarkoitat parasta? Paras tarkoittaa ihanteellista hinnan ja laadun yhdistelmää sekä mahdollisuutta testata palveluita ilmaiseksi. Tällaisia ​​palveluita ei venäläisessä segmentissä ole niin paljon, mutta ulkomaiset kollegamme voivat ylpeillä niistä laajalla valikoimalla.

Näiden palvelujen avulla voit oppia ohjaamaan Internet-liikennettä resurssista toiseen.

• Hello Bar

Asennus askel askeleelta

Rekisteröidy osoitteessa hellobar.com;

Sinua pyydetään lisäämään koodi verkkosivustosi malliin. Voit myös asentaa laajennuksen, jos sivustosi toimii Wordpressissä.

Päätä tehtävä, jonka haluat ratkaista ponnahdusikkunan avulla: sähköpostin kerääminen, aloitussivun näyttäminen, soittaminen yhdellä napsautuksella, uudelleenohjaus bannerin kautta sosiaalisiin verkostoihin;

Sinun on syötettävä matkapuhelinnumerosi ja valittava maa.

Valitse ponnahdusikkunan tyyppi: bannerin sijainti sivuston yläosassa, keskellä tai alaosassa;

Aseta aika, jonka jälkeen ikkuna näytetään (välittömästi, 5, 10 tai 60 sekunnin kuluttua, kun on tarkasteltu tietty määrä sivuja sivustolla tai kun käyttäjä on poistumassa sivustolta);

Sinun tarvitsee vain mennä "Hallinnoi"-osioon ja käynnistää ponnahdusikkuna siellä. Lisäksi, jos haluat muuttaa asetuksia, sinun on myös siirryttävä "Hallinnoi" -välilehteen. Voit tarkastella banneritilastoja siirtymällä "Tilastot"-välilehteen.

Käyttökustannukset: maksettu suunnitelma alkaa 15 dollarista kuukaudessa ja 15 %:n alennus, kun maksat vuosittain. On ilmainen versio rajoitetuilla toiminnoilla:

• GetSiteControl

Asennus askel askeleelta

Aloita rekisteröitymällä osoitteessa GetSiteControl.com;

Hanki koodi, kopioi ja liitä se sivustosi mallikoodiin ennen sulkevaa body-tagia.

Tarkista, että widget on asennettu oikein sivustolle napsauttamalla Päivitä-painiketta. Jos lisätty koodi on asennettu oikein, voit siirtyä eteenpäin;

Voit valita tarvitsemasi widgetin: kyselylomakkeen, lomakkeen sähköpostin lähettämiseen, tarvitsemasi sivun näyttämiseen, tilaa sähköpostiuutiskirje, sosiaalisen verkoston painikkeet, online-chat;

Valittua widgetiä on muokattava (ulkonäkö ja näyttöasetukset sivustolla);

Viimeinen vaihe on widgetin aktivointi.

Käyttökustannukset: alkaen 10 dollaria kuukaudessa yhden sivuston yhdistämisestä. Maksamalla vuoden kerralla saat 20 % alennuksen. Tarjolla on myös ilmainen perustoiminto, joka auttaa sinua tutustumaan palveluun.

• Witget

Asennus askel askeleelta

Rekisteröidy osoitteessa Witget.com;

Sinun on lisättävä ehdotettu sivustomallin koodi ennen päättävää body-tagia.

Menemällä malligalleriaan voit valita ponnahdusikkunaan sinulle sopivan mallin;

Keksi oma ainutlaatuinen myyntitekstisi ja lisää se;

Valitse väriteemasi, ponnahdusikkunan parametrit (leveys, tiheys ja bannerin näyttämisen ehdot, näyttöpaikka ja -aika) ja napsauta Tallenna;

Nyt ei jää enää muuta kuin tarkistaa ponnahdusikkunan näyttö verkkosivustollasi. Voit tehdä tämän napsauttamalla "Näytä sivustolla" -painiketta. Oletko tyytyväinen kaikkeen? Aktivoi se sitten.

Käyttökustannukset: 700 ruplasta kuukaudessa perustariffiin, voit yhdistää kaksi sivustoa. Tarjolla on lisäominaisuuksia alkaen Advanced-tariffista. Voit kokeilla palvelua ilmaiseksi rekisteröitymällä seitsemän päivän kokeilujaksoksi.

• Ponnahdusikkunat
• WordPress PopUp
• Vieritä laukaistuja laatikoita
• WordPressin ilmoituspalkki
• WP Popup Plugin - Lightbox Popup
• PopupAlly
• YITH-uutiskirjeen ponnahdusikkuna

Näytä sivustoosi liittyvät tiedot ponnahdusikkunoiden avulla. Ponnahdusikkuna on tehokas, jos se vastaa sisältöäsi. Kun luot ponnahdusikkunan, valitse huolellisesti kuva ja teksti - mitä parempi tekstinkirjoitus ja grafiikka, sitä tehokkaampi banneri on.

Kun yhdistät ponnahdusikkunan, ota huomioon vierailijoiden laitteiden näytön resoluutiot, luota kultastandardiin - 1024*768.

Käyttämällä ponnahdusikkunoita oikein voit saada vaikuttavia tuloksia, kuten lisätä sähköpostitilauskantaasi. Tämä muoto auttaa myös myymään tietotuotteita, kuten e-kirjoja ja videokursseja.

1) Ponnahdusikkunan tulee olla optimaalinen koko: ei liian suuri eikä liian pieni;

2) Annostelujäljet

Rajoita ponnahdusikkuna samaan henkilöön aina, kun vierailet sivustollasi. Jos näet, että hän on sulkenut ikkunan, näytä ponnahdusikkuna parin viikon kuluttua, kun hän on unohtanut sen.

3) Varaa aikaa

Ponnahdusikkunan ulkoasu heti sivustolle tulon jälkeen on huono. Aseta se näkymään jonkin ajan kuluttua tai sen jälkeen, kun sivustollasi on suoritettu toimia.

4) Siellä pitäisi olla "Sulje" -painike tutun ristin muodossa

Sivustosi vierailijalla on oikeus sulkea ponnahdusikkunasi, jos hän ei halua nähdä sitä tai ryhtyä toimiin, joita pyydät häntä tekemään siinä. Halu sulkea ikkunan ei saa viedä paljon aikaa, ja sen tulisi olla tavanomainen tapa.

5) Selkeä toimintakehotus

Suuri virhe on ponnahdusikkunan ylikuormittaminen tiedoilla. Yksi tehtävä - yksi toimintakehotus. Jos esimerkiksi haluat lisätä tilaajien määrää Facebookissa, tee ponnahdusikkuna niin, että se selittää selvästi, että kutsut sivustosi kävijää tilaamaan Facebook-sivusi.

Ponnahdusikkuna on jo nykyään kaikkien verkkosivustojen pakollinen osa. On tärkeää, että se ei ole ärsyttävää ja tuo konkreettista hyötyä tarvittavan tiedon keräämiseen. Tämän päivän uutiskirjeessä puhumme siitä, miten ja miksi ponnahdusikkunaa käytetään.

Toimintaperiaate

Ponnahdusikkunaa käytetään yleensä vierailijan huomion siirtämiseen äkillisesti suurimmasta osasta sisällöstä tiettyyn elementtiin - ponnahdusikkunaan. Tämä on aina yllätysvaikutus, kuten terävä juonenkäänne, kun "pupillit laajenevat". Sitä voidaan myös verrata huomion herättämiseen esityksen aikana (puheen tauko, käsien liikkeet, kirkkaiden esineiden ja kuvien käyttö).

Verkkomarkkinoinnissa ponnahdusikkunoita käytetään useimmiten silloin, kun on selvää, että käyttäjä on kiinnostunut: hän on vierittänyt alas useita näyttöjä tai sivu on ollut auki tietyn ajan, mutta kävijä ei tee mitään. Kuinka "herättää hänet?"

Esimerkkejä ponnahdusikkunoista

Joten siirrytään verkkosivustoilla toteutettuihin ponnahdusikkunoihin. Jos siirryt Netology-projektiresurssiin etkä tee mitään noin 1 minuuttiin, vasemmalle tulee kirkas ikkuna, jossa on lomake.

Verkkokaupassa lacoste.ru jonkin odotuksen jälkeen näkyviin tulee ponnahdusikkuna, jossa on tarjous tilata uutiskirje, mikä peittää muun sisällön. Lacosten tavoitteena on kerätä asiakkaiden sähköpostit. Samaan aikaan ilmestyy online-konsultti, mikä ei ole kovin kätevää ja häiritsee vierailijan huomion.

Sivustolla sapato.ru jokaisella napsautuksella tulee näkyviin peittokuva, joka valitsee käyttäjän kaupungin. Kun kaupunki on valittu, ikkuna ei avaudu. Tämä auttaa sinua oppimaan lisää vierailijoistasi ja tarjoamaan heille erityisiä tarjouksia tietylle alueelle.

Verkkokauppa Bonprix.ua tarjoaa uutiskirjeen tilaamisen, josta se antaa alennuksen ensimmäisestä ostoksestasi. Huomaa "Anna sähköpostiosoitteesi" -kehote, joka katoaa vain, kun alat kirjoittaa kenttään.

Lacywear.ru tarjoaa 400 ruplaa tilauksesta. matkapuhelimesta, mikä on myös hyvä motivaatio.

Reebok.ru käyttää tätä tekniikkaa houkutellakseen käyttäjiä alennuksella. Napsauta siirtyäksesi lisävarusteosaan. Kuten muistamme, nämä ovat suosituimpia jokaisessa verkkokaupassa. Huomaa, että tässä ikkunassa on "Hae alennus" -painike. Älä unohda toimintakehotusta, jos tavoittelet tätä tavoitetta.

Books.ru-sivustossa käytetään ponnahdusikkunaa, joka tulee näkyviin vierittäessä sivua. Tässä on ilmoitus uudesta tuotteesta kirjavalikoimassa. Näet selvästi, missä rullauksen kohdassa ikkuna tulee näkyviin. On myös ponnahdusikkunoita, jotka tulevat näkyviin, kun yrität sulkea sivun. He joko suosittelevat katsomaan muita sivuston osia tai ottamaan yhteyttä johtajaan.

• Ponnahdusikkunan tulee olla jyrkästi eri värinen kuin tausta. Pyrkiessäsi näyttämään luonnolliselta ja samassa värimaailmassa voit törmätä käytettävyysongelmiin. Sävyt eivät kuitenkaan saa olla hylkiviä.
• Valitse sanat lauseellesi. Kaikki eivät ole kiinnostuneita jättämään sinulle sähköpostia ja vastaanottamaan tylsiä yritysuutisia. Jos aiot lähettää kirjeitä sähköpostitse, se voi olla "100 ja 1 tapa säästää rahaa supermarketissa", "Kuinka neljä ihmistä voi elää 1000 ruplasta?" On selvää, että sinun täytyy kirjoittaa siitä, mikä liittyy toimintaasi.
• Pidä se lyhyenä. Ponnahdusikkunan tutkimisen ei pitäisi kestää kauan.
• Ponnahdusikkuna, joka näkyy vierailijan sivustolla oleskelun ensimmäisistä sekunneista lähtien, on tietty riski, että hän poistuu. Tai käyttäjän on ymmärrettävä selvästi, miksi häneltä vaaditaan jotain "tuttamisen" ensimmäisistä hetkistä lähtien.
• Useat ikkunat saman näytön eri osissa eivät ole hyvä idea. Samoin ne, jotka korvaavat toisiaan. Tämä on ärsyttävää ja häiritsee huomion. Päätä, mihin tarkoitukseen näytät ikkunan vierailijallesi.
• Testaa erilaisia ​​vaihtoehtoja ja löydät täydellisen esittelyn.
• Älä lupaa sellaista, mitä et pysty toteuttamaan. Jos peität tärkeän sisällön halvan tempun vuoksi, käyttäjä lähtee.
• Jos yleisösi on jo segmentoitu, voit lisätä tehokkuutta valitsemalla kenelle näytettävät ikkunat.
• Anna vierailijasi kieltäytyä lomakkeen täyttämisestä tai tarjouksen napsauttamisesta. Anna hänelle oikeus sulkea ikkuna selkeällä ristillä oikeassa yläkulmassa.
• Jos käyttäjä on jo sulkenut ikkunan kerran, sitä ei tarvitse näyttää uudelleen. Ei ei.
• Ponnahdusikkuna voi sisältää tarjouksen pyytää takaisinsoittoa konsultaatiota tai tilausta varten.

Mistä saa?

Ponnahdusikkunan saamiseksi tarvitset skriptin. Voit tilata sen tai käyttää lukuisia valmiita ratkaisuja Internetistä ja koulutusmateriaaleista.

Artikkeli, jossa tarkastellaan ponnahduspalautelomakkeen asentamista verkkosivustolle, jossa on captcha ja mahdollisuus liittää siihen tiedostoja.

Tämä lomake on lähdekoodiprojekti, joka sijaitsee GitHubissa osoitteessa https://github.com/itchief/feedback-form-in-modal.

Bootstrap 3:lle rakennetun projektin aiemmat lähdekoodit voidaan ladata GitHubista tämän linkin kautta.

Palautelomakkeen ominaisuudet

Esitetty lomake on tehty Bootstrap 4- ja jQuery-komponenteilla. Foman palvelinkoodi on kirjoitettu PHP:llä.

Muut muotoominaisuudet:

• avoin lähdekoodi, projekti saatavilla GitHubissa;
• lomaketietojen lähettäminen palvelimelle ja vastauksen vastaanottaminen tapahtuu ilman sivun uudelleenlatausta, ts. käyttämällä AJAX-tekniikkaa;
• graafisen captchan läsnäolo (suojatakseen roskapostilta);
• mahdollisuus liittää siihen tiedostoja (oletusarvoisesti enintään 5);
• lomaketietojen varmennus (validointi) järjestetään sekä asiakkaalla että palvelimella;
• lomaketietojen lähettäminen onnistuneen validoinnin jälkeen johtajan (järjestelmänvalvojan) sähköpostiin ja toimituskirje asiakkaalle;
• kirjettä lähetettäessä tiedostot voidaan joko liittää tai lähettää linkkien avulla;
• lähetyksen kirjaaminen (tiedot tallennetaan message.txt-tiedostoon).

Lomakkeen asentaminen sivulle

Palautelomakkeen yhdistämisen perusvaiheet.

Avaa lomake modaaliikkunassa

2. Luo modaalinen ikkuna ja sijoita siihen palautelomakkeen HTML-koodi.

Palautelomake × Nimi Sähköpostiosoite Viesti (vähintään 20 merkkiä) Liitä viestiin tarvittaessa kuvia (enintään ): yhden kuvan enimmäiskoko 512 KB Valitse tiedosto... Päivitä kuvassa näkyvä koodi Napsauttamalla painiketta hyväksyn käyttösopimuksen ehdot ja annan suostumukseni henkilötietojeni käsittelyyn 27. heinäkuuta 2006 annetun liittovaltion lain nro 152-FZ "On" mukaisesti. Henkilökohtaiset tiedot". Virheitä on tapahtunut! Korjaa ne ja lähetä lomake uudelleen. 0% Lähetä viesti Lomake lähetetty onnistuneesti. Napsauta linkkiä lähettääksesi toisen viestin.

3. Yhdistä käytettyjen komponenttien (jQuery, Bootstrap) ja itse lomakkeen (main.css, main.js) tyylit ja komentosarjat:

Kuinka ladata palautelomake

Voit ladata lomakkeen GitHubista. Voit siirtyä projektin sivulle seuraavalla painikkeella.

Aikoinaan, kun olin juuri aloittamassa blogini ja verkkokaupan pitämistä, muistan, että minulla oli ongelma - kuinka tehdä sivustolle kauniita ponnahdusikkunoita, joiden avulla kertoa kävijöille tietyistä kampanjoita tai, jos se koskee blogia, varmistaa erityyppisten koulutusmateriaalien tilaajien sähköpostiosoitteiden kerääminen. Ei ole turhaa, että monet tietoliikemiehet ja itse asiassa kaikki kokeneet bloggaajat sanovat, että tilaajakunta on kultainen voimavara! Nämä ovat samat ihmiset, jotka ovat valmiita kuuntelemaan sinua, ostamaan sinulta ja tekemään sen uudestaan ​​ja uudestaan. Tietenkin, jos materiaalisi ansaitsevat sen.

Joten mistä minä puhun?! Ja kuinka kerätä tämä erittäin kultainen omaisuus! Ja yksi parhaista tavoista on pätevät ja laadukkaat ponnahdusikkunatilauslomakkeet resurssiisi. On todella monia tapoja käyttää ponnahdusikkunoita! Useita kymmeniä voidaan varmasti ajatella - tähän sisältyy vierailijoille tiedottaminen sivuston mielenkiintoisimmista materiaaleista ja ilmoitukset uusista artikkeleista, promootioista ja kilpailuista; Siellä voit tarvittaessa esittää myös mainostarjouksen. Ja tietysti tärkein, kuten jo totesin, on kerätä kohdeyleisösi yhteystiedot (sähköposti, puhelinnumerot) myöhempää vuorovaikutusta varten heidän kanssaan.

Tänään kerron sinulle mielestäni yhdestä parhaista ja erittäin kätevistä ponnahdusikkunoiden laajennuksista. Olen käyttänyt sitä itse jo pitkään, mutta ajatus kirjoittaa siitä artikkeli tuli minulle vasta nyt. Joten tänään MakeDreamProfits-yrityksen tuote on tulipalossa -.

Itse asiassa laajennuksen ominaisuuksista kirjoittaminen ei ole kaikkein palkitsevin tehtävä, koska siihen tulee jatkuvasti päivityksiä ja lisäyksiä, ja siksi riskin kattaa sen hyvin yksipuolisesti, 2-3 kuukautta tämän julkaisun jälkeen. artikkeli . Keskitytään kuitenkin tärkeimpiin ominaisuuksiin:

• 11 valmiiksi tehtyä kaunista ponnahdusikkunamallia, joita voit muokata
• kätevä henkilökohtainen tili, jossa teet kaikki asetukset ja lisäät sitten valmiin koodin sivustolle
• integrointi kaikkiin postituslistapalveluihin tai tapa lähettää vastaanotettuja tietoja sähköpostiisi
• ponnahdusikkunoiden jaettu testaus (muuten, ponnahdusikkuna on ponnahdusikkuna, kuka ei tiedä)
• 3 tyyppiä ponnahdusikkunoita:
  • tietojen syöttölomakkeella
  • Ei oikeastaan
  • linkin jälkeen
• avausprosentti- ja tulostilastot (tietojen syöttäminen tai linkin napsauttaminen)
• mahdollisuus luoda ponnahdusikkunaryhmä jaettuna ensimmäisellä sivustolla käynnillä tai uutiskirjeen tilauksella
• ponnahdusikkunoiden näyttämisen tilan ja sääntöjen asettaminen
• mahdollisuus upottaa ikkunaan

Olen listannut vain perusasiat, itse asiassa JumpOutin toiminnallisuus on vielä laajempi!

Plugin ulkoasusääntöjen joustava konfigurointi:

• kun vierailija poistuu sivustolta
• kun napsautat elementtiä
• tietyn ajan kuluttua
• kun selaat sivua
• ja joukko muita

Lisäksi voit määrittää erilaisia ​​laajennuksia sivuston eri sivuille -

Henkilökohtaisesti käytän tätä ponnahdusikkunan tilauslomakelaajennusta kaikilla verkkosivustoillani. Tämä on todella kätevä työkalu vuorovaikutukseen resurssin yleisön kanssa. Testini osoittavat, että ponnahdusikkunoiden muunnostehokkuus on lähes sama kuin yksisivuisilla aloitussivuilla olevilla vakiolomakkeilla. Vielä siistimpää on, että laajennuksen toiminnallisuuden avulla voit seurata tätä tehokkuutta pienintä yksityiskohtaa myöten – katso itsellesi muutama kuvakaappaus alta –

Kuten näet kuvakaappauksessa Yandex-Metrica-konversioista viimeisen kuukauden aikana, 3,76 %:sta käyttäjistä eli absoluuttisesti 207:stä tuli tilaajani juuri oikea-aikaisen ponnahdusikkunan ansiosta, jossa tarjottiin materiaalini vastaanottamista!

Kun listasin palvelun ominaisuuksia, panin jo merkille mahdollisuuden integroida kaikkiin postituslistoihin -

Voit arvioida ja kokeilla kaikkia ponnahdusikkunoiden tilauslomakkeiden ja ponnahdusikkunoiden laajennuksen ominaisuuksia verkkosivustollasi täysin ilmaiseksi 15 päivän ajan, jonka jälkeen voit maksaa kerran tarvittavasta laajennuksen versiosta - riippuen sivustojen määrä, joilla sitä on tarkoitus käyttää - yksi, kolme tai rajoittamaton, sekä useita lisäominaisuuksia, esimerkiksi mahdollisuus käyttää omaa CSS-koodiasi.

P.S. : Onko sinulla kokemusta ponnahdusikkuna- ja tilauslomakelaajennuksista? Kirjoita siitä muutama rivi alla olevan artikkelin kommentteihin! Äläkä unohda Tykkää, jos olen auttanut sinua valitsemaan laajennuksen!

Sijoittamiseen tässä blogissa käsiteltyihin hankkeisiin liittyy tiettyjä riskejä aina sijoitettujen varojen täydelliseen menettämiseen asti. Kirjoittaja ei ole vastuussa blogissa kuvattujen yritysten/projektien toimista. Blogimateriaalit ovat vain tiedoksi, eivätkä vaadi mihinkään toimiin.