Slik legger du til Web Push Notification til WordPress-siden din

Har du lagt merke til nettpuffvarslene som brukes på populære nettsteder som Facebook? Nylig spurte en av våre lesere om det var mulig å legge til web push notifications i WordPress. Selvfølgelig er det det. I denne artikkelen vil vi vise deg hvordan du legger til webpublisering til ditt WordPress-nettsted.

Hvorfor Legg Web Push Notifications til ditt WordPress Site?

Web push meldinger er klikkbare meldinger som vises på toppen av brukerens skrivebord. De kan vises selv når brukerens nettleser ikke er åpen.

Bortsett fra skrivebordet, jobber Web push meldinger også på mobile nettlesere.

Populære nettsteder, inkludert Facebook, Pinterest, LinkedIn, og mange andre bruker allerede web push notifications. Det viser seg å være mer engasjerende enn SMS, e-postmarkedsføring og andre sosiale medier. Ifølge en undersøkelse har push notifikasjoner en 50% åpen sats på mobile enheter.

Dette betyr mer engasjert publikum for ditt WordPress-nettsted og betydelig økning i dine samlede sidevisninger og tilbake besøkende.

Når det er sagt, la oss ta en titt på hvordan du legger til web push notifications til et WordPress-nettsted.

Sette opp Web Push Notifications i WordPress med OneSignal

OneSignal er en gratis tjeneste som gir deg mulighet til å legge til push-varsler til alle nettsteder, webapper eller mobilapper.

Første du må gjøre er å installere og aktivere OneSignal-plugin. For mer informasjon, se vår trinnvise veiledning om hvordan du installerer et WordPress-plugin.

Ved aktivering vil pluginet legge til et nytt menyelement som er merket OneSignal i WordPress admin bar. Ved å klikke på det, tar du deg til innstillingssiden for plugin.

Innstillingssiden er delt inn i Oppsett og Konfigurasjon-faner. Oppsettfanen er faktisk detaljert dokumentasjon for hvordan du konfigurerer OneSignal-push-varsler i WordPress. Den har de samme trinnene som vi vil vise deg i denne opplæringen.

For å sette opp OneSignal må du legge til forskjellige API-nøkler og program-IDer i plugininnstillingene.

La oss komme i gang.

Trinn 1: Opprett Google Keys

Først må du gå til nettstedet for Googles tjenesterveiviser.

Bare gi et navn til appen din og legg til et Android-pakkenavn. OneSignal bruker ikke Android pakke navn, men det er et obligatorisk felt.

Velg deretter ditt land og din region, og klikk deretter på "Velg og konfigurere tjenester" -knappen.

Dette fører deg til neste skjerm hvor du blir bedt om å velge Google-tjenester du vil bruke sammen med appen din. Du må klikke på "Aktiver Google Cloud Messaging" -knappen.

Du vil nå se server-API-nøkkelen og Sender-ID.

Du må kopiere avsender-ID-en og lime den inn i WordPress-pluginets Konfigurasjon-faneblad under Google Project Number-feltet.

Du må også kopiere server-API-nøkkelen og lime den inn i en tekstfil på datamaskinen din. Du trenger denne API-nøkkelen senere i denne opplæringen.

Trinn 2: Konfigurer Chrome og Firefox Push Notifications

Vi vil nå sette opp push notifikasjoner på Chrome og Firefox. Først må du besøke OneSignals nettsted og opprette din gratis konto.

Når du har opprettet kontoen din, må du logge inn og klikke på "Legg til ny app" -knapp.

Du blir bedt om å skrive inn et navn for appen din. Du kan bruke hvilket som helst navn du vil, og klikk deretter på "Opprett" -knappen for å fortsette.

På neste side blir du bedt om å velge en plattform for å konfigurere. Du må velge 'Website Push' og deretter klikke på neste knapp for å fortsette.

Deretter blir du bedt om å velge nettleserplattform. Du vil se Google Chrome og Mozilla Firefox i en boks og Safari i en annen boks.

Du må klikke på Google Chrome og Mozilla Firefox-boksen. Vi vil vise deg hvordan du konfigurerer Safari, senere i denne artikkelen.

Klikk på neste knapp for å fortsette.

I neste trinn vil du bli bedt om å skrive inn din WordPress-webadresse, Google Server API-nøkkel og URL for standardvarslingsikonbildet ditt.

Hvis nettstedet ditt ikke støtter SSL / HTTPS, må du merke av i boksen ved siden av 'Mitt nettsted er ikke fullt HTTPS' alternativ. Du kan også sette opp SSL på nettstedet ditt hvis du vil, men det er ikke nødvendig.

Google Chrome støtter ikke nettpustvarsler for ikke-ssl- eller http-nettsteder. OneSignal løser dette problemet ved å abonnere brukere til et underdomene på sitt eget https-domene.

Kontrollere 'Mitt nettsted er ikke fullt HTTPS' alternativet vil vise HTTP tilbakebetaling alternativer. Du må velge et underdomene for appen din og angi Google Project Number eller Sender ID du genererte i første trinn.

Klikk på Lagre-knappen for å fortsette. Nå kan du gå ut av denne dialogboksen. Du får beskjed om at oppsettet ditt ikke er ferdig ennå, og kan gjenopptas senere. Klikk Ja for å lukke dialogboksen.

Trinn 3: Få OneSignal Keys

Du må nå få OneSignal Keys til nettstedet ditt. Fra App-dashbordet klikker du på App Settings.

Dette tar deg til din appinnstillingsside. Du må klikke på kategorien Nøkler og IDer.

Dette vil vise din OneSignal App ID og Rest API Key.

Du må kopiere og lime dem i OneSignal WordPress plugin-konfigurasjonsfanen på nettstedet ditt.

Trinn 4: Konfigurere Safari Web Push Notifications

Husk at vi hoppet over Safari-nettpratvarslingsinnstillingene. Nå vil vi vise deg hvordan du konfigurerer Safari web push notifications.

Logg inn på OneSignal-kontoen din og gå til App-innstillinger-siden din. Rull ned til webplattformer, og klikk på konfigurasjonsknappen ved siden av Apple Safari.

Dette vil hente en dialogboks der du blir bedt om å skrive inn ditt nettstednavn og nettstedadressen.

Deretter må du merke av i boksen ved siden av 'Jeg vil gjerne laste opp mine egne varslingsikoner' alternativ.

Du vil nå se et alternativ for å laste opp forskjellige ikonstørrelser. Dette er firkantede bilder, bruk Photoshop eller et bilderedigeringsprogram for å lage ikoner i de eksakte størrelsene.

Klikk på velg filknapper for å laste opp alle ikonene dine.

Klikk på Lagre-knappen og lukk dialogboksen.

Oppdater siden for appinnstillinger og bla ned til webplattformer. Denne gangen vil du se "Web-ID" under Apple Safari.

Du må kopiere denne web-IDen og lime den inn i kategorien Konfigurasjon av OneSignal-plugin på nettstedet ditt.

Det er alt, du har vellykket installert OneSignal web push notifications for ditt WordPress-nettsted.

Trinn 5: Testing Web Push Notifications på WordPress-siden din

Som standard vil OneSignal-plugin legge til et abonnementsikon på ditt WordPress-nettsted. Besøk nettstedet ditt i en støttet nettleser, og klikk deretter på abonnementsknappen.

Du vil se standardmeldingen "takk for at du abonnerer".

Logg deg nå på OneSignal-konto. Klikk på appnavnet ditt, og deretter på App Settings.

Rull ned til webplatformene, og klikk på konfigurasjonsknappen ved siden av Google Chrome og Firefox.

Du vil se plattformskonfigurasjonsskjermen som du har fylt inn tidligere. Bare klikk på Lagre-knappen og klikk deretter Fortsett.

Du blir bedt om å velge mål-SDK. Du må velge WordPress og deretter klikke på Neste.

Siden du bare har en abonnent for øyeblikket, blir abonnent-IDen din automatisk fylt ut.

Klikk på neste knapp, og du kommer til 'Testinnstillinger' skritt.

Klikk på 'Send testvarsling' knapp.

One Signal vil nå sende en web push melding.

Utseendet på varslene kan variere avhengig av hvilken nettleser du brukte til å abonnere. Når meldingen vises på skjermen, må du klikke på den.

Det vil ta deg til bekreftelsesskjermbildet, som viser at du har opprettet OneSignal web push notifications for nettstedet ditt.

Gå tilbake til konfigurasjonsskjermbildet på OneSignals nettsted og klikk på 'Kontroller varslingsstatus'-knappen.

Du vil nå se en annen suksessmelding som indikerer at du har lagt til web push-varsler til ditt WordPress-nettsted.

Hvordan sende Web Push Notifications i WordPress med OneSignal

OneSignal web push push notifieringsplugin på WordPress-nettstedet ditt vil automatisk sende et varsel til alle abonnenter når du publiserer et nytt innlegg.

Du kan også sende meldinger manuelt fra OneSignal App Dashboard. Logg inn på OneSignal-kontoen din og klikk på appnavnet ditt.

Fra menyen til venstre, klikk på "Ny melding" -knappen.

Dette fører deg til det nye meldingsskjermbildet. Du kan skrive inn en tittel og noe innhold for varselet ditt.

Du kan også klikke på Alternativer, Segment, Planlegg / Send senere for å tilpasse nettpubliseringen din ytterligere.

For eksempel kan du koble den til en bestemt side på nettstedet ditt, sende den til et bestemt segment av brukerne, eller planlegge at det skal sendes på et bestemt tidspunkt.

Vi håper denne artikkelen hjalp deg med å legge til webpublisering av WordPress-nettstedet ditt. Du vil kanskje også se vår liste over de beste medlemskapspluggene for WordPress.

Hvis du likte denne artikkelen, vennligst abonner på vår YouTube Channel for WordPress-videoopplæringsprogrammer. Du kan også finne oss på Twitter og Facebook.