Looking for a way to create a full screen popup for your WordPress site?
A full screen popup can be incredibly effective for capturing leads. They’re designed to convince and convert by pulling the visitor’s entire focus on themselves.
Men att behöva koda en från grunden är ett verkligt bekymmer. För det första måste du kunna tillräckligt med HTML, CSS och Javascript för att skapa popupen tillsammans med utlösande regler för när den ska visas. Sedan måste du skapa en manuell integration med din e-postleverantör. Och slutligen måste du hantera eventuella integritets- och säkerhetsfrågor.
Goda nyheter: det finns ett mycket enklare sätt.
In this article, we’re going to show you how to launch a full screen popup in WordPress with zero coding in less than 10 minutes.
Låt oss dyka in.
What is a Full Screen Popup in WordPress?
A full screen popup is an opt-in form that popups up with a full screen cinematic effect. Think of it as watching a movie on Netflix in full-screen mode. When a full screen optin form pops up, you can’t see the rest of the WordPress site. This way, your entire focus is on the popup.
Här är ett exempel:
You can use full screen popups to:
- Welcome new visitors
- Offer a discount coupon
- Point visitors to their best content
- Send visitors to their social media profiles
And more. You can even create popup contact forms. Popups are super flexible and as long as you’re creative, you can set up high-converting ones easily.
How to Create a Full Screen Popup in WordPress
Now that you understand what a full screen popup is and why you’d want to create one, how do you create a full screen popup? We recommend using OptinMonster to create all your popups.
OptinMonster är världens främsta verktyg för konvertering och vi har använt det själva. OptinMonster gör det superenkelt att skapa kraftfulla popup-fönster som konverterar. Och du behöver aldrig använda någon kod alls.
Vi skrev till och med en fullständig recension av OptinMonster.
Du kan kolla in det, eller börja med din kampanj direkt. Allt du behöver göra är att registrera dig för OptinMonster och följa med resten av den här artikeln.
Steg #1: Skapa en kampanj
Gå till din OptinMonster-instrumentpanel och klicka på knappen Skapa:
Välj alternativet Mall för att börja skapa en optin med en fördesignad mall:
Select the Fullscreen to get started with full screen popup templates:
Then, choose a campaign template. You can choose whatever template you like, but we’re going with the Product Recommendation (Gamified) campaign template for this tutorial.
Efter att du har valt din mall, ge din kampanj ett namn. Kom ihåg, detta kampanjnamn är för dig och du kommer troligen att skapa en hel del av dessa popup-fönster med olika målinriktningsalternativ. Så, ge kampanjen ett meningsfullt namn, annars kommer du att bli riktigt förvirrad senare.
Also, depending on your plan, you can also use OptinMonster on multiple sites. So, select the website where you want to display your campaign as well.
Tryck på Börja bygga när du är klar.
Step #2: Edit Your Popup
Med OptinMonster får du en visuell dra-och-släpp-popup-byggare. När du är klar med att skapa din kampanj kommer du att kunna redigera även de minsta detaljerna om din popup. Börja med att redigera din popup-rubrik:
Det mest fantastiska här är att du bara klickar på den text du vill redigera och ändrar den direkt. Det finns inget behov av att fylla i ett formulär eller redigera någon HTML-kod i popup-fönstret.
You can edit everything you want about your full screen popup. When you’re happy with the optin’s appearance, you can move on to more advanced settings.
Step #3: Set Full Screen Popup Display Rules
Visningsregler är avsedda att definiera när din kampanj visas på din webbplats och vem som ser den.
Vår rekommendation är att du ändrar utlösarvillkoret till avsikt att lämna:
Klicka på Nästa steg för att välja Åtgärd. Här rekommenderar vi att du ställer in Visa kampanjvyn till Optin View, ställer in visa med MonsterEffect till valfri inkommande animation du vill ha, och spela ljudeffekt till valfri ljudeffekt för din popup.
Klicka sedan på knappen Nästa steg. Du kan se hela omfattningen av dina inställningar i fliken Sammanfattning.
Steg 4: Lägg till en klick-för-att-prenumerera-knapp till ditt popup-fönster
Pushnotiser hjälper dig att öka din webbplatstrafik och engagemang automatiskt. Och om du driver en onlinebutik hjälper PushEngage dig också att öka din försäljning genom att hjälpa dig att skapa automatiserade e-handelspushnotiser.
Du kan komma igång gratis, men om du menar allvar med att växa ditt företag bör du köpa en betald plan. Innan du köper någon pushmeddelandetjänst bör du också kolla in den här guiden till kostnader för pushmeddelanden.
Här är en snabb överblick över vad du får med PushEngage:
- Automatiserade kampanjer med hög konvertering
- Flera alternativ för målinriktning och kampanjschemaläggning
- Målspårning och avancerad analys
- Smart A/B-testning
- En dedikerad framgångschef
Du kommer att se att PushEngage är utan tvekan det bästa valet om du vill bygga trafik, engagemang och försäljning för ditt företag. Och om du har en budget kan du alltid vara lite kreativ med dina pushmeddelanden.
Lägg först till ett HTML-block i ditt popupfönster från sidofältet i OptinMonster.
Det här är där vi kommer att lägga till koden för att samla prenumeranter på push-notiser. Klistra först in följande kod för att skapa en klickbar knapp:
<button onclick="subscribeOnClickButton()" style="border: none; width: 100%; padding-left: 15%; padding-right:15%; text-align: center; display: inline-block; color: white;">Get Updates via Push Notifications</button>Klistra in koden där det står att du kan lägga till HTML:
Naturligtvis kan du leka med stilarna för att göra det mer tilltalande. Därefter ska vi göra knappen för att samla prenumeranter på push-notiser när den klickas på.
Gå till PushEngage startsida och klicka på knappen Kom igång :
Sedan vill du välja gratisplanen för att prova PushEngage eller välja en betald plan om du menar allvar med att växa din verksamhet. De betalda planerna kommer med fler kampanjalternativ och möjligheten att bygga ännu större prenumerantlistor.
I din PushEngage-instrumentpanel, gå till Webbplatsinställningar » Webbplatsdetaljer och klicka på knappen Klicka här för installationsinstruktioner. Under Valfri webbplats, får du din installationskod:
VARNING: Du måste kopiera koden du får från din instrumentpanel. Koden är unik för varje PushEngage-användare. Du kan inte kopiera koden i bilden och samla prenumeranter på push-notiser.
När du har koden i din PushEngage-instrumentpanel, ta det andra skriptet och lägg till lite extra kod. Din slutliga kod bör se ut ungefär så här:
<script src="https://clientcdn.pushengage.com/core/02a6e92667ae2279fcba8932356c1d93.js" async></script>
<script> window._peq = window._peq || [];
function subscribeOnClickButton(){
window._peq.push(['subscribe',{}.pe,function(res){
console.log(res);
}]);
}
</script>Lägg till den här koden i HTML-blocket i OptinMonster direkt efter koden för din knapp och mellan kodblocket <div></div> och du är klar!
Step #5: Setup Your Email Integration
Nästa steg är att konfigurera din e-postintegration. Klicka på Lägg till ny integration från fliken Integrationer och välj din e-postleverantör:
Vi rekommenderar att använda Drip för din e-postmarknadsföring om du inte redan har en e-postleverantör.
Step #6: Publish Your Full Screen Popup in WordPress
När du skapar en ny kampanj är den Pausad som standard.
Gå till fliken Publicera i toppmenyn för att se Publiceringsalternativ. Ställ sedan in statusen till Publicera och välj webbplattformen:
Om du driver en WordPress-webbplats hanterar OptinMonster-pluginet resten av installationen automatiskt. Det är samma för Shopify och BigCommerce. För alla andra webbplatser, klicka på Valfri webbplats och klistra in inbäddningskoden i webbplatsens head:
Och du är klar!
What to do After Creating a Full Screen Popup in WordPress
Det var allt för den här gången, gott folk!
Let us know if this article helped. Creating popups on your site can help you convert your traffic into email subscribers and genuine business leads. And we highly recommend that you start creating full screen popups right away.
Och om du letar efter ett prisvärt sätt att öka din trafik, rekommenderar vi att använda push-notiser. Push-notiser kan hjälpa dig att få mer återkommande trafik och webbplatsengagemang. Du kan också skapa automatiserade push-notiskampanjer som genererar försäljning.
Inte övertygad? Kolla in dessa resurser:
- 7 smarta strategier för att öka kundengagemanget
- Är push-notiser effektiva? 7 statistik + 3 experttips
- Hur du ställer in pushmeddelanden för övergivna kundvagnar (Enkel handledning)
- Hur man lägger till ett WordPress-plugin för webbnotiser på din webbplats
Vi rekommenderar att använda PushEngage för att skapa dina push-notiskampanjer. PushEngage är den främsta push-notisprogramvaran i världen. Så om du inte redan har gjort det, kom igång med PushEngage idag!
