<img height="1" width="1" style="display:none" src="https://www.facebook.com/tr?id=1268201939863114&amp;ev=PageView&amp;noscript=1">

HubSpot pop-up-ikkuna - konversio kasvuun ponnahdusikkunalla

kirjoittanut Elsi Hirvonen 6.4.2017 15:14

hubspot-pop-up-ponnahdusikkuna.png

Otimme tovi sitten käyttöön pop-up- eli ponnahdusikkunan, jonka tavoitteena oli kasvattaa uutiskirjeen tilaajien määrää. Tulokset olivat häkellyttävän hyviä. Siksi haluammekin jakaa teille ohjeet pop-up-ikkunan lisäämiseen HubSpot-sivuillenne.

Oma kokemuksenne ponnahdusikkunan tehosta

Lisäsimme blogiimme vuoden vaihteen jälkeen pop-up- eli ponnahdusikkunan, jonka tavoitteena oli kasvattaa uutiskirjeen tilaajien määrää. Vaikka lähes kaikkien mielikuva ponnahdusikkunoista on negatiivinen ja niitä pidetään ärsyttävinä, tutkimusten mukaan pop-upit kasvattavat sivuston konversioastetta merkittävästi. Siksi annoimme sille mahdollisuuden.

Aiemmin uutiskirjetilauksen lomake oli sivuillamme vain blogiartikkeleiden sivupalkissa. Kuten arvata saattaa, emme hukkuneet uusien uutiskirjetilaajien määrään. Kaipasimme tilanteeseen muutosta ja päätimme testata pop-up-ikkunaa uutiskirjetilausten määrän kasvattamiseen. Täytyy sanoa, että aiemmista tutkimustuloksista huolimatta tulokset yllättivät.

Ponnahdusikkunan lisäämisen jälkeen uusien kuukausittaisten uutiskirjetilausten määrä on kasvanut keskimäärin 1500 prosenttia.

Vaikka lähtötilanteessa tilaajien määrään ei juurikaan panostettu, tulokset ovat silti häkellyttävän hyviä. Siksi halusimmekin jakaa teille ohjeet siitä, miten pystytte lisäämään omille HubSpot-sivuillenne ponnahdusikkunan - oli kyse normaaleista verkkosivuista, laskeutumissivuista tai blogista.

Näin teet ajastetun pop-up-ikkunan HubSpotissa

Pop-upin lisääminen saattaa kuulostaa tekniseltä, mutta yksinkertaisen pop-upin luominen onnistuu kohtuullisilla IT-taidoilla. Ponnahdusikkunan muotoilu silmää miellyttäväksi saattaa sen sijaan vaatia koodauksen alkeiden hallintaa, mutta alkuun pääsee ilmankin. Erinomaiset ohjeet ikkunan lisäämiseen löytyy esimerkiksi tästä Saleslionin tutoriaalista. Käytän näiden ohjeiden perustana kyseistä tutoriaalia. Voit katsoa ohjeet linkin takaa myös videomuodossa!

  1. Siirry HubSpotissa Design manageriin.
    Klikkaa vasemmasta laidasta “Custom modules”.
    Klikkaa oikeasta yläkulmasta “New custom module”.
    Anna moduulille haluamasi nimi ja valitse “Create”.
  2. Kopio pop-up-ikkunan koodi täältä.
    Kopioi koko teksti < Main Custom module section > ja < Rich Text Field > -kohtien välistä.
    Liitä teksti juuri luomasi moduulin tekstikenttään.
  3. Klikkaa vasemmasta alakulmasta “Add new field” ja valitse “Rich text”.
    Täytä seuraavat kohdat:

    “Label”: Nimeä osio haluamallasi tavalla.

    “Default rich text”:
    Kirjoita ja muotoile tässä kentässä pop-up-ikkunassa näkyvä teksti. Voit käyttää tässä kentässä esimerkiksi tekstien muotoiluita, kuvia, CTA:ita tai vaikka personointia. Voit myös upottaa kentän koodiin haluamasi lomakkeen.

    “Name”:
    Tämä kohta on tärkeä! Kirjoita tähän kohtaan “pop_up_text”. Mikäli kirjoitat kenttään jotain muuta tai unohdat alaviivan, pop-up ei toimi.

    Tallenna osio klikkaamalla “Save field”.
  4. Klikkaa taas vasemmasta alakulmasta “Add new field” ja valitse tällä kertaa “Choice”.
    Täytä tästä osiosta seuraavat kohdat:

    “Label”:
    Nimeä osio taas haluamallasi tavalla.

    “Choice options":

    “Value”: Tässä kohtaa määrittelet sen, millaisella viiveellä ponnahdusikkuna aukeaa. Arvo 1000 tarkoittaa yhtä sekuntia, 60000 kuuttakymmentä sekuntia eli minuuttia. Mieti siis, monenko sekunnin viiveen haluat ikkunaan asettaa ja kerro se tuhannella.

    “Label”: mikäli annat kohtaan “Value” esimerkiksi arvon 30000, voit kirjoittaa tähän kenttään selvennykseksi “30 sekuntia”.

    “Name”: Tämä kohta on tärkeä! Kirjoita tähän “modal_delay”. Mikäli tekstissä on pienikin virhe, pop-up ei toimi haluamallasi tavalla.

    Tallenna osio klikkaamalla “Save field”.
  5. Kas noin, olet luonut yksinkertaisen pop-upin! Klikkaa vielä oikeasta yläkulmasta “Publish” tallentaaksesi luomasi moduulin.

Miten lisään pop-up-ikkunan HubSpot-sivulle?

Pop-up lisätään sivupohjan eli templaten kautta. Avaa Design managerista template, jolla haluat pop-upin näkyvän. Vaihtoehtoisesti voit surffailla itsesi haluamallesi sivulle ja klikata oikeasta yläkulmasta HubSpot-ikonia ja valita ilmestyvästä pudotusvalikosta “Edit layout”.

Lisää luomasi Custom module templateen joko raahaamalla se vasemman laidan palkista templateen tai klikkaamalla “Add row” ja muuttamalla sen klikkaamalla palkin oikean laidan rattaan kuvaa ja valitsemalla sieltä “Swap module”.

Huom! Kun lisäät luomasi pop-up Custom modulen johonkin templateen, pop-up ilmestyy kaikille sivuille, jotka käyttävät kyseistä templatea. Mikäli haluat pop-upin näkyvän vain yhdellä sivulla, luo sivulle oma template.

Mikäli pop-upin luominen ei onnistu, kerro siitä vaikka kommenteissa. Koitamme tarjota apuamme!

Kyllä, HubSpotilla voi tehdä tällaistakin. Mihin kaikkeen muuhun se oikein pystyy?

Varaa maksuton HubSpot konsultaatio. Asiantuntijamme kertovat sinulle, miten pystyt hyödyntämään HubSpotin kattavia ominaisuuksia täysipainoisesti.

Tilaa HubSpot-konsultaatio

Mikäli teillä ei ole vielä HubSpotia käytössä, varaa maksuton HubSpot demo. Pääset itse kokeilemaan, miten yrityksenne voisi hyötyä HubSpotin käyttöönotosta!

Tilaa 30vrk HubSpot-demo

Tilaa uusimmat blogiartikkelit suoraan sähköpostiisi

Uusimmat artikkelit

Onko sinulla kysyttävää B2B-markkinoinnista?Tilaa maksuton markkinoinnin sparraushetki!

 

 

skydive3.jpg
author avatar

Kirjoittanut Elsi Hirvonen

Seuraa minua somessa