Chapters

Contents

the email tool that makes email marketing simple

Sign Up FreeNo credit card required.
maildroppa-promo-notebookmaildroppa-promo-spaceship

Skapa och placera slide-in-formulär

Published: · Last updated: · By

In brief

Lär dig skapa Maildroppa Slide-in-formulär, välja position, ställa in fördröjning och frekvens, bädda in dem på din webbplats och testa dem på mobilen.

En slide-in är ett kompakt registreringsformulär som visas vid kanten av eller på en vald position i webbläsarfönstret.

Det drar till sig mer uppmärksamhet än ett formulär som placerats på sidan, samtidigt som det täcker mindre av webbplatsen än en centrerad popup. Slide-ins passar bra för påminnelser om nyhetsbrev, rabatter, produktuppdateringar och korta erbjudanden som bör förbli synliga medan besökaren läser sidan.

Den här guiden förklarar inställningarna som är unika för slide-ins. De gemensamma funktionerna för layout, innehåll, fält, taggar, typografi, lager och registreringsflöden beskrivs i huvudguiden Guide till byggaren för registreringsformulär.

Byggaren för slide-in: komplett byggare

Skapa en slide-in

Öppna ”Signup Forms”, klicka på ”Create Form” och välj ”Slide-in”. Ange ett tydligt internt namn och fortsätt till byggaren.

Du kan också redigera en befintlig slide-in genom att klicka på dess namn i översikten över registreringsformulär.

Använd ett namn som ”Blog Newsletter Slide-in”, ”New Product Reminder” eller ”Summer Coupon Slide-in”. Det interna namnet hjälper dig att hantera formuläret och visas inte automatiskt för besökare.

Välj en mall för slide-in

Slide-ins erbjuder ett tomt formulär, ett standardformulär och fyra designade mallar:

  • Ren påminnelse
  • Mörkt erbjudande
  • Varm kupong
  • Minimal anteckning

Mallarna är utformade för kompakta meddelanden, men alla element kan fortfarande redigeras. Du kan ändra innehåll, fält, färger, typografi, kantlinje, avstånd och knappen för att skicka formuläret efter att du valt en startmall.

Byggaren för slide-in: startmallar

Utforma slide-in-formuläret

Använd den visuella byggaren för att arrangera slide-in-formuläret. Det kan innehålla registreringsformuläret tillsammans med text, en bild, video, lista, knapp, sociala länkar, en prenumeranträknare, tomt utrymme eller en avdelare.

Utrymmet är mer begränsat än på en landningssida eller i ett brett inbäddat formulär. Håll erbjudandet fokuserat och undvik att lägga till innehåll som tvingar besökare att leta efter fälten eller knappen för att skicka formuläret.

Välj blocket för registreringsformuläret för att konfigurera fält, obligatorisk information, dolda taggar, förloppsindikator, prenumeranträknare, inmatningsfält och knapp för att skicka formuläret. Öppna ”Page settings” för att ändra bakgrunden för slide-in-formuläret och standardinställningarna för dess övergripande utseende.

En layout med en kolumn är vanligtvis det tydligaste valet. Om du använder flera kolumner bör du noggrant kontrollera hur de staplas på smala skärmar.

Välj skärmposition

Välj blocket för registreringsformuläret och öppna ”Widget Settings”. Positionsväljaren erbjuder ett rutnät med tre gånger tre positioner:

  • Överst till vänster, överst i mitten eller överst till höger
  • I mitten till vänster, i mitten eller i mitten till höger
  • Nederst till vänster, nederst i mitten eller nederst till höger

Välj en position som inte täcker viktiga kontroller på webbplatsen. Kontrollera cookie-meddelanden, chattwidgetar, navigering, knappar för kundvagnen och andra fasta element innan du bestämmer dig.

På smala mobilskärmar förenklar Maildroppa placeringen så att slide-in-formuläret får plats på den tillgängliga bredden. Positioner högst upp förblir högst upp; övriga positioner visas från den nedre kanten. Testa alltid resultatet på en liten skärm i stället för att enbart förlita dig på positionen på datorn.

Byggaren för slide-in: positionsväljare

Ställ in visningsfördröjningen

”Display Delay” anger hur många sekunder Maildroppa väntar innan slide-in-formuläret visas på en inbäddad webbsida.

Använd 0 när slide-in-formuläret ska vara tillgängligt direkt. Ange en längre fördröjning när besökare först ska få tid att interagera med sidan. Byggaren accepterar en fördröjning på upp till 86 400 sekunder.

En kort fördröjning kan fungera bra för en enkel påminnelse om nyhetsbrev. För en längre artikel kan en senare visning kännas mer naturlig och göra erbjudandet mer relevant för engagerade läsare.

Ställ in visningsfrekvensen

”Display Frequency” styr den period efter vilken slide-in-formuläret kan visas för samma besökare igen. Du kan välja:

  • Alltid
  • En gång i timmen
  • En gång om dagen
  • En gång i veckan
  • En gång i månaden

Använd en frekvens som passar erbjudandet. En tidsbegränsad kampanj kan behöva ett kortare intervall, medan en allmän påminnelse om nyhetsbrev vanligtvis inte behöver visas vid varje besök.

Frekvensen sparas i besökarens webbläsare. En annan webbläsare, ett privat webbläsarfönster eller rensad webbläsarlagring behandlas som en annan besökshistorik.

Byggaren för slide-in: kontroller för fördröjning och frekvens

Anslut registreringsflödet

Granska det tilldelade registreringsflödet i byggarens sidhuvud. Det definierar svaret efter registreringen, e-postmeddelandet för Double Opt-in och vad som händer efter bekräftelsen.

Du kan välja ett befintligt flöde, redigera det aktuella flödet eller skapa ett specifikt för den här slide-in. Om flödet delas av flera formulär påverkar ändringar i det alla formulären.

Förhandsgranska och spara

Klicka på ”Preview” för att granska slide-in-formuläret innan du lägger till det på webbplatsen. Kontrollera vald position, öppningsbeteende, fältordning, stängningskontroll och det fullständiga svaret efter registreringen.

Klicka på ”Save changes” när formuläret och Widget Settings är klara. Gå sedan tillbaka till översikten över registreringsformulär.

Aktivera och bädda in slide-in-formuläret

Aktivera slide-in-formuläret från menyn med åtgärder via de tre punkterna om det inte redan är aktivt. Klicka på ”Show Code Snippet” och kopiera hela koden från fliken ”JavaScript”.

Lägg till skriptet på alla webbsidor där slide-in-formuläret ska vara tillgängligt. Till skillnad från ett inbäddat formulär avgör skriptets exakta placering på sidan inte slide-in-formulärets synliga position. Positionen som valts i Widget Settings styr var det visas.

Fliken ”HTML” innehåller den genererade uppmärkningen för anpassade implementationer. Testa hela interaktionen och registreringsprocessen noggrant om webbplatsen använder detta alternativ.

För allmänna instruktioner om kodplacering, se Bygga och bädda in ett inbäddat formulär.

Byggaren för slide-in: dialogrutan för att bädda in formulär

Testa slide-in-formuläret på webbplatsen

När du har lagt till koden testar du den riktiga webbsidan:

  1. Kontrollera att slide-in-formuläret visas efter den valda fördröjningen.
  2. Bekräfta positionen på en bred skärm.
  3. Kontrollera den anpassade positionen och bredden på en smal skärm.
  4. Se till att det inte täcker navigering, cookie-kontroller, chattknappar eller andra viktiga åtgärder.
  5. Testa att öppna och stänga slide-in-formuläret.
  6. Skicka formuläret och slutför Double Opt-in-processen.
  7. Kontrollera prenumeranten och de dolda taggarna i Maildroppa.

Frekvensinställningen kan förhindra att formuläret visas igen under upprepade tester. Använd ett privat webbläsarfönster eller rensa relevant webbläsarlagring när du behöver simulera en ny besökare.

Uppdatera eller inaktivera slide-in-formuläret

Öppna samma slide-in-formulär i Maildroppa, gör ändringarna, förhandsgranska dem och klicka på ”Save changes”. JavaScript-kodavsnittet fortsätter att använda samma formulär-ID och läser in den sparade konfigurationen.

Välj ”Deactivate” i översikten över registreringsformulär när slide-in-formuläret ska tas offline utan att raderas. Ta även bort skriptet från webbplatsen om du inte längre planerar att använda det där.

Ready to Send Better Emails?

Stop juggling bloated tools or overpriced plans. Maildroppa offers personal support, GDPR-level privacy, and powerful email marketing - starting free forever.

Sign Up For Free

No credit card required. No time limit.