Skapa en länk för att prenumerera på push-meddelanden med ett klick

Letar du efter ett sätt att skapa en klick-för-att-prenumerera-länk och samla prenumeranter på push-notiser?

Vi förstår. Ibland är det mycket bekvämare att ha lite flexibilitet i hur du växer dina prenumeranter.

Oroa dig inte. Vi har dig täckt.

I den här artikeln kommer vi att visa dig steg-för-steg hur du skapar din egen prenumerationsknapp eller länk.

Vi kommer att använda PushEngage för att visa dig hur du gör det.

Men oroa dig inte ens om du använder en annan leverantör. Processen bör vara ganska liknande. Men om du menar allvar med att växa dina prenumeranter bör du prova PushEngage. PushEngage är den främsta push-notisprogramvaran i världen.

Så, om du inte redan har gjort det, kom igång med PushEngage idag.

Redo? Låt oss dyka in.

Hur man skapar en klick-för-att-prenumerera-knapp med PushEngage

Om du inte har ställt in PushEngage ännu är det ett bra tillfälle att göra det.

Steg 1: Kom igång med PushEngage

Gå till PushEngages 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.

Steg 2: Kopiera kodavsnittet

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 kommer inte att kunna kopiera koden på bilden och samla prenumeranter på push-notiser.

När du har koden i din PushEngage-instrumentpanel, lägg till detta kodavsnitt i din kod:

<script> window._peq = window._peq || [];</script>

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 || [];</script>

Steg 3: Skapa en knapp eller länk

Hur man skapar en knapp för prenumeration vid klick i HTML

Nu när du har koden är det mesta av det svåra gjort. Nu måste du skapa en knapp som utlöser din kod när den klickas. Detta är vad vi kallar en 'onclick-händelse'.

För att skapa en knapp för prenumeration vid klick, använd detta HTML-kodavsnitt:

<button onclick="subscribeOnClickButton()">Subscribe</button>

En prenumerationsknapp kan vara utmärkt som en uppmaning till handling ovanför vecket.

Här är hur det skulle se ut utan någon styling:

Ignorera rubriken och stycket i skärmdumpen. Det är bara för att visa dig hur det kan se ut på en webbplats första veck. HTML-kodavsnittet kommer inte att generera rubriken och stycket.

Självklart bör du styla din knapp med CSS när du klistrar in koden. Om du inte vet hur man stylar HTML-element, här är en fin lista med exempel du kan titta på.

Hur man skapar en länk för prenumeration vid klick i HTML

Du kan också samla dina prenumeranter med en prenumerationslänk. I så fall är här HTML-kodavsnittet:

<a onclick="subscribeOnClickButton();" href="javascript:void(0)">Subscribe</a>

Detta är för när du skapar en hyperlänk i texten. Detta kan vara mycket användbart om du vill infoga ett erbjudande om prenumeration på push-notiser i dina blogginlägg.

Det bör se ut ungefär så här:

Din HTML-kodsnutt kommer bara att skapa en länk som säger Prenumerera. Lägg gärna till resten av innehållet som vi gjorde på bilden. Då kommer det att kännas mycket mer naturligt.

Och det är allt! Din länk är redo.

Steg #4: Bädda in koden i WordPress

Klart? Låt oss ta resten av koden då.

Nu, om du bara vill samla in en prenumerant när knappen klickas, klistra in den här koden:

<script>
function subscribeOnClickButton() {
window._peq.push(['subscribe']);
}
</script>

Det finns inga fina finesser här. Bara en knapp som samlar in prenumeranter när den klickas.

Men om du vill ha något lite mer avancerat kan du också logga svaret du får från PushEngage-servern till konsolen:

function subscribeOnClickButton(){
window._peq.push(['subscribe',{}.pe,function(res){
if(res.statuscode==1)
{
// Code to return response
console.log(res);
}
}]);
}

Om du vill samla in prenumeranter när din knapp klickas och sedan segmentera dessa prenumeranter automatiskt, kan du använda den här koden istället:

function subscribeOnClickButton(){
window._peq.push(['subscribe','segment_name',function(res){
if(res.statuscode==1)
{
// Code to return response
console.log(res);
}
}]);
}

Och du är klar. Välj den kodsnutt som passar dig bäst och klistra in den i din webbplats HTML-kod.

Nu, för att knappen eller länken ska fungera, måste du klistra in lite mer Javascript-kod längst ner på din sida.

Om du driver en WordPress-sida är det enklaste sättet att använda ett plugin. Det bästa pluginet för jobbet är Insert Headers and Footers-pluginet. Installera pluginet (det är gratis) och gå till Inställningar » Infoga sidhuvuden och sidfötter:

Och placera din fullständiga kod i rutan Skript i sidfot. Du bör klistra in koden du fick från PushEngage-instrumentpanelen samt Javascript-koden du behöver för att köra knappen eller länken korrekt.

Steg #5: Klistra in HTML-koden för knappen eller länken på din sida

Slutligen måste du klistra in HTML-koden för antingen din knapp eller din länk på dina sidor och inlägg.

Om du använder WordPress kan du klistra in HTML-kod direkt i artikeln.

Det är okej om du aldrig har gjort det här förut.

Här är en artikel om hur man lägger till HTML-kod i WordPress med steg-för-steg-instruktioner.

Vid det här laget rekommenderar vi starkt att du testar dina push-notiser för att se om allt fungerar.

Om allt gick bra, kommer du att ha en knapp eller en länk på din sida som samlar in prenumeranter när den klickas. Och om något inte fungerar, är du välkommen att kontakta vårt kundframgångsteam. Vi hjälper gärna till.

Avslutning

Det var allt för den här gången, gott folk!

När du har skapat en klickbar prenumerationsknapp för din sida bör du kolla in våra avancerade segmenteringsregler.

Att skapa detaljerade segment kan hjälpa dig att personifiera dina push-notiser i stor utsträckning. Det innebär mer engagemang, högre klickfrekvens och fler försäljningar från dina push-notiskampanjer.

Och om du är nybörjare på push-notiser bör du prova PushEngage. PushEngage erbjuder några av de mest kraftfulla och flexibla push-notiskampanjerna som finns. Så, om du menar allvar med att växa ditt företag, kom igång med PushEngage idag!