Så här lägger du till Web Push Notification till din WordPress-webbplats

Har du lagt märke till webbpumpmeddelanden som används på populära webbplatser som Facebook? Nyligen frågade en av våra läsare om det var möjligt att lägga till web push-meddelanden i WordPress. Så klart det är. I den här artikeln kommer vi att visa dig hur du lägger till web push notification till din WordPress-webbplats.

Varför Lägg till Web Push-meddelanden till din WordPress-webbplats?

Web push-meddelanden är klickbara meddelanden som visas ovanpå användarens skrivbord. De kan visas även när användarens webbläsare inte är öppen.

Bortsett från skrivbordet arbetar Web-push-meddelanden också med mobila webbläsare.

Populära webbplatser, inklusive Facebook, Pinterest, LinkedIn, och många andra använder redan web push notifieringar. Det visar sig vara mer engagerande än SMS, e-postmarknadsföring och andra sociala medier. Enligt en undersökning har push-meddelanden en 50% öppen ränta på mobila enheter.

Det betyder mer engagerad publik för din WordPress-webbplats och en betydande ökning av dina övergripande sidvisningar och återkommande besökare.

När vi har sagt det, låt oss ta en titt på hur man lägger till webbpumpmeddelanden till en WordPress-webbplats.

Ställa in Web Push Notifications i WordPress med OneSignal

OneSignal är en gratis tjänst som gör att du kan lägga till push-meddelanden till alla webbplatser, webb- eller mobilappar.

Det första du behöver göra är att installera och aktivera OneSignal-plugin. För mer information, se vår steg för steg guide om hur du installerar ett WordPress-plugin.

Vid aktivering kommer plugin att lägga till ett nytt menyalternativ som är märkt OneSignal i din WordPress-administratörsfält. Genom att klicka på det tar du dig till plugins inställningssida.

Inställningssidan är uppdelad i fliken Inställningar och Konfiguration. Inställningsfliken är faktiskt detaljerad dokumentation om hur du konfigurerar OneSignal push-meddelanden i WordPress. Det har samma steg som vi kommer att visa dig i denna handledning.

För att installera OneSignal måste du lägga till olika API-nycklar och program-ID i plugin-inställningarna.

Låt oss börja.

Steg 1: Skapa Google Keys

Först måste du besöka webbplatsen för Googles tjänsterguide.

Ange bara ett namn på din app och lägg till ett Android-paketnamn. OneSignal använder inte Android-paketnamn, men det är ett obligatoriskt fält.

Välj sedan ditt land och din region, klicka sedan på knappen "Välj och konfigurera tjänster".

Detta tar dig till nästa skärm där du kommer att bli ombedd att välja Google-tjänster du vill använda med din app. Du måste klicka på knappen Aktivera Google Cloud Messaging.

Nu ser du serverns API-nyckel och avsender-ID.

Du måste kopiera ditt avsändar-ID och klistra in det i fliken Konfiguration i WordPress-plugin under fältet Google Projektnummer.

Du måste också kopiera din Server API-nyckel och klistra in den i en textfil på din dator. Du behöver denna API-nyckel senare i denna handledning.

Steg 2: Konfigurera meddelanden om Chrome och Firefox

Vi kommer nu att installera push-meddelanden på Chrome och Firefox. Först måste du besöka OneSignals webbplats och skapa ditt gratis konto.

När du har skapat ditt konto måste du logga in och klicka på knappen "Lägg till en ny app".

Du kommer att bli ombedd att ange ett namn för din app. Du kan använda vilket namn du vill och klicka sedan på "Skapa" knappen för att fortsätta.

På nästa sida kommer du att bli ombedd att välja en plattform för att konfigurera. Du måste välja "Website Push" och sedan klicka på nästa knapp för att fortsätta.

Därefter kommer du att bli ombedd att välja webbläsarplattform. Du kommer att se Google Chrome och Mozilla Firefox i en ruta och Safari i en annan ruta.

Du måste klicka på Google Chrome och Mozilla Firefox-rutan. Vi visar hur du konfigurerar Safari, senare i den här artikeln.

Klicka på nästa knapp för att fortsätta.

I nästa steg kommer du att bli ombedd att ange din WordPress-webbadress, Google Server API-nyckel och URL för din standardmeddelandeikonbild.

Om din webbplats inte stöder SSL / HTTPS, måste du markera rutan bredvid "Min webbplats är inte fullständigt HTTPS" alternativ. Du kan också konfigurera SSL på din webbplats om du vill, men det är inte nödvändigt.

Google Chrome stöder inte webbpumpmeddelanden för icke-ssl eller http-webbplatser. OneSignal löser detta problem genom att prenumerera användare på en underdomän på sin egen https-domän.

Kontroll "Min webbplats är inte fullständigt HTTPS" alternativet visar alternativen för HTTP-återgång. Du måste välja en underdomän för din app och ange Google Project Number eller Sender ID du genererade i det första steget.

Klicka på Spara för att fortsätta. Nu kan du lämna denna dialogruta. Du kommer att få ett meddelande om att din inställning inte är klar än och kan återupptas senare. Klicka på Ja för att stänga dialogrutan.

Steg 3: Få OneSignal Keys

Du behöver nu få OneSignal Keys för din webbplats. Klicka på Appinställningar i appens instrumentpanel.

Detta tar dig till din appinställningssida. Du måste klicka på fliken Nycklar och ID-skivor.

Detta visar ditt OneSignal App ID och Rest API-nyckel.

Du måste kopiera och klistra in dem i OneSignal WordPress-plugins konfigurationsflik på din webbplats.

Steg 4: Ställa in Safari Web Push Notifications

Kom ihåg att vi hoppade över inställningarna för Safari Web push notification. Nu kommer vi att visa dig hur du konfigurerar Safari Web push-meddelanden.

Logga in på ditt OneSignal-konto och gå till din App Settings-sida. Bläddra ner till webbplattformar och klicka på konfigurera knappen bredvid Apple Safari.

Detta kommer att leda till en dialogruta där du kommer att bli ombedd att ange ditt webbplatsnamn och webbplatsadress.

Då måste du markera rutan bredvid 'Jag skulle vilja ladda upp mina egna anmälningsikoner' alternativ.

Du får nu se ett alternativ för att ladda upp olika ikonstorlekar. Dessa är kvadratiska bilder, använd Photoshop eller något bildredigeringsprogram för att skapa ikoner i exakta storlekar.

Klicka på välj filknappar för att ladda upp alla dina ikoner.

Klicka på Spara-knappen och stäng sedan dialogrutan.

Uppdatera sidan med appinställningar och bläddra ner till webbplattformar. Den här gången kommer du att se "Web ID" under Apple Safari.

Du måste kopiera detta webb-ID och klistra in det i fliken Konfiguration i OneSignal-plugin på din webbplats.

Det är allt, du har lyckats konfigurera OneSignal webb push notifieringar för din WordPress-webbplats.

Steg 5: Testa Web Push-meddelanden på din WordPress-webbplats

Som standard lägger OneSignal-plugin till en prenumerationsikon på din WordPress-webbplats. Besök din webbplats i en webbläsare som stöds och klicka sedan på prenumerera-knappen.

Du kommer att se standardmeddelandet "tack för att du prenumererar".

Logga in nu på OneSignal-konto. Klicka på ditt appnamn och sedan på Appinställningar.

Bläddra ner till webplattformen och klicka på konfigurera-knappen bredvid Google Chrome och Firefox.

Du kommer att se plattformskonfigurationsskärmen som du fyllde i tidigare. Klicka bara på Spara-knappen och klicka sedan på Fortsätt.

Du kommer att bli ombedd att välja mål-SDK. Du måste välja WordPress och klicka sedan på Nästa.

Eftersom du bara har en abonnent för tillfället fylls ditt abonnent-ID automatiskt.

Klicka på nästa knapp, och du kommer att nå "Testinställningar" steg.

Klicka på "Skicka testmeddelande" knapp.

One Signal skickar nu en web push notification.

Meddelandena kan skilja sig beroende på vilken webbläsare du brukade prenumerera på. När meddelandet visas på din datorskärm måste du klicka på det.

Det tar dig till bekräftelsesskärmen och visar att du har lyckats konfigurera OneSignal web push notifications för din webbplats.

Återgå till konfigurationsskärmen på OneSignals webbplats och klicka på "Kontrollera meddelandestatus' knapp.

Du kommer nu att se ett nytt framgångsmeddelande som indikerar att du har lagt till web push-meddelanden på din WordPress-webbplats.

Så här skickar du Web Push Notifications i WordPress med OneSignal

OneSignal web push push-plugin på din WordPress-webbplats skickar automatiskt en anmälan till alla abonnenter när du publicerar ett nytt inlägg.

Du kan också manuellt skicka meddelanden från din OneSignal App Dashboard. Logga in på ditt OneSignal-konto och klicka på ditt appnamn.

Från menyn till vänster, klicka på knappen "Ny meddelande".

Detta tar dig till den nya meddelandeskärmen. Du kan ange en titel och något innehåll för din anmälan.

Du kan också klicka på Alternativ, Segment, Planera / Skicka senare för att ytterligare anpassa din webbpulsmeddelande.

Du kan till exempel länka den till en viss sida på din webbplats, skicka den till ett visst segment av dina användare, eller schemalägga det för att skickas vid en viss tidpunkt.

Vi hoppas att den här artikeln har hjälpt dig att lägga till web push notification på din WordPress-webbplats. Du kanske också vill se vår lista över de bästa medlemskapsprogrammen för WordPress.

Om du gillade den här artikeln kan du prenumerera på vår YouTube-kanal för WordPress-videoinstruktioner. Du kan också hitta oss på Twitter och Facebook.