Come aggiungere la notifica push Web al tuo sito WordPress

Hai notato le notifiche push Web utilizzate su siti Web famosi come Facebook? Recentemente uno dei nostri lettori ha chiesto se fosse possibile aggiungere notifiche push web in WordPress. Ovviamente è. In questo articolo, ti mostreremo come aggiungere la notifica push web al tuo sito WordPress.

Perché aggiungere notifiche push Web al tuo sito WordPress?

Le notifiche push Web sono messaggi cliccabili visualizzati sul desktop dell'utente. Possono essere visualizzati anche quando il browser dell'utente non è aperto.

Oltre al desktop, le notifiche push Web funzionano anche sui browser mobili.

Siti popolari come Facebook, Pinterest, LinkedIn e molti altri stanno già utilizzando le notifiche push web. Si sta dimostrando più coinvolgente di SMS, e-mail marketing e altri social media. Secondo un sondaggio, le notifiche push hanno una percentuale di apertura del 50% sui dispositivi mobili.

Ciò significa un pubblico più impegnato per il tuo sito WordPress e un significativo incremento delle visualizzazioni di pagina complessive e dei visitatori di ritorno.

Detto questo, diamo un'occhiata a come aggiungere notifiche push web a un sito WordPress.

Configurazione di notifiche push Web in WordPress con OneSignal

OneSignal è un servizio gratuito che consente di aggiungere notifiche push a qualsiasi sito Web, Web o app mobili.

La prima cosa che devi fare è installare e attivare il plugin OneSignal. Per ulteriori dettagli, consulta la nostra guida passo passo su come installare un plug-in di WordPress.

All'attivazione, il plugin aggiungerà una nuova voce di menu denominata OneSignal nella barra di amministrazione di WordPress. Cliccando su di esso ti porterà alla pagina delle impostazioni del plugin.

La pagina delle impostazioni è suddivisa in schede Configurazione e Configurazione. La scheda di installazione è in realtà una documentazione dettagliata su come configurare le notifiche push OneSignal in WordPress. Ha gli stessi passaggi che ti mostreremo in questo tutorial.

Per configurare OneSignal, dovrai aggiungere chiavi API e ID applicazione diversi nelle impostazioni del plug-in.

Iniziamo.

Passaggio 1: crea Google Keys

Per prima cosa devi visitare il sito Web di Google Services Wizard.

Basta fornire un nome per la tua app e aggiungere un nome di pacchetto Android. OneSignal non utilizza il nome del pacchetto Android, ma è un campo obbligatorio.

Quindi, scegli il tuo paese e la tua regione, quindi fai clic sul pulsante "Scegli e configura servizi".

Questo ti porterà alla schermata successiva in cui ti verrà chiesto di selezionare i servizi Google che desideri utilizzare con la tua app. Devi fare clic sul pulsante "Abilita Google Cloud Messaging".

Ora vedrai la chiave API del server e l'ID mittente.

Devi copiare il tuo ID mittente e incollarlo nella scheda Configurazione del plugin di WordPress sotto il campo Numero progetto Google.

Devi anche copiare la tua chiave API del server e incollarla in un file di testo sul tuo computer. Avrai bisogno di questa chiave API più avanti in questo tutorial.

Passaggio 2: configurazione delle notifiche push di Chrome e Firefox

Ora configureremo le notifiche push su Chrome e Firefox. Per prima cosa devi visitare il sito OneSignal e creare il tuo account gratuito.

Una volta creato l'account, è necessario accedere e fare clic sul pulsante 'Aggiungi una nuova app'.

Ti verrà chiesto di inserire un nome per la tua app. È possibile utilizzare qualsiasi nome desiderato e quindi fare clic sul pulsante "Crea" per continuare.

Nella pagina successiva, ti verrà chiesto di selezionare una piattaforma da configurare. Devi selezionare "Push sito web" e quindi fare clic sul pulsante Avanti per continuare.

Dopo di che ti verrà chiesto di selezionare la piattaforma del browser. Vedrai Google Chrome e Mozilla Firefox in una scatola e Safari in un'altra casella.

Devi fare clic su Google Chrome e Mozilla Firefox box. Ti mostreremo come configurare Safari, più avanti in questo articolo.

Clicca sul pulsante successivo per continuare.

Nel passaggio successivo, ti verrà chiesto di inserire l'URL del tuo sito WordPress, la chiave dell'API di Google Server e l'URL per l'immagine dell'icona di notifica predefinita.

Se il tuo sito web non supporta SSL / HTTPS, devi selezionare la casella accanto a "Il mio sito non è completamente HTTPS" opzione. Puoi anche impostare SSL sul tuo sito web, se lo desideri, ma non è obbligatorio.

Google Chrome non supporta le notifiche push web per siti Web non-ssl o http. OneSignal risolve questo problema iscrivendo gli utenti a un sottodominio sul proprio dominio https.

verifica "Il mio sito non è completamente HTTPS" l'opzione mostrerà le opzioni di fallback HTTP. Dovrai scegliere un sottodominio per la tua app e inserire il numero di Google Project o l'ID mittente che hai generato nel primo passaggio.

Fare clic sul pulsante Salva per continuare. Ora puoi uscire da questa finestra di dialogo. Verrà richiesto con un avviso che la configurazione non è ancora completa e può essere ripresa in seguito. Fare clic su Sì per chiudere la finestra di dialogo.

Passaggio 3: ottenere OneSignal Keys

Ora devi ottenere OneSignal Keys per il tuo sito web. Dalla dashboard dell'app fai clic su Impostazioni app.

Questo ti porterà alla pagina delle impostazioni dell'app. È necessario fare clic sulla scheda Chiavi e ID.

Questo mostrerà l'ID app OneSignal e la chiave API Rest.

È necessario copiarli e incollarli nella scheda di configurazione del plugin OneSignal WordPress sul tuo sito.

Passaggio 4: configurazione delle notifiche push di Safari Web

Ricorda che abbiamo ignorato le impostazioni di notifica push web di Safari. Ora ti mostreremo come configurare le notifiche push web di Safari.

Accedi al tuo account OneSignal e vai alla pagina delle impostazioni dell'app. Scorri verso il basso fino a piattaforme web e fai clic sul pulsante di configurazione accanto ad Apple Safari.

Verrà visualizzata una finestra di dialogo in cui ti verrà chiesto di inserire il nome del sito e l'URL del sito.

Quindi è necessario selezionare la casella accanto a 'Vorrei caricare le mie icone di notifica' opzione.

Ora vedrai un'opzione per caricare diverse dimensioni di icona. Queste sono immagini quadrate, utilizzare Photoshop o qualsiasi programma di modifica delle immagini per creare icone con le dimensioni esatte.

Clicca su scegliere i pulsanti del file per caricare tutte le tue icone.

Fare clic sul pulsante Salva e quindi chiudere la finestra di dialogo.

Aggiorna la pagina Impostazioni app e scorri verso il basso fino alla sezione Piattaforme web. Questa volta vedrai "Web ID" in Apple Safari.

Devi copiare questo ID web e incollarlo nella scheda Configurazione del plugin OneSignal sul tuo sito.

Questo è tutto, hai configurato con successo le notifiche push web OneSignal per il tuo sito WordPress.

Passaggio 5: test delle notifiche push Web sul tuo sito WordPress

Per impostazione predefinita, il plugin OneSignal aggiungerà un'icona di abbonamento al tuo sito WordPress. Visita il tuo sito Web in un browser supportato e quindi fai clic sul pulsante Iscriviti.

Vedrai il messaggio predefinito "grazie per l'iscrizione".

Ora accedi all'account OneSignal. Fai clic sul nome dell'app, quindi su Impostazioni app.

Scorri verso il basso fino alla sezione Piattaforme Web e fai clic sul pulsante Configura accanto a Google Chrome e Firefox.

Vedrai la schermata di configurazione della piattaforma che hai compilato in precedenza. Basta fare clic sul pulsante Salva e quindi fare clic su Continua.

Ti verrà chiesto di selezionare l'SDK di destinazione. È necessario selezionare WordPress e quindi fare clic su Avanti.

Dal momento che hai un solo abbonato al momento il tuo ID utente verrà riempito automaticamente.

Clicca sul pulsante successivo, e raggiungerai il "Impostazioni di prova" passo.

Clicca su "Invia notifica di prova" pulsante.

Un segnale invierà ora una notifica push web.

L'aspetto delle notifiche potrebbe variare in base al browser utilizzato per la sottoscrizione. Quando viene visualizzata la notifica sullo schermo del computer, è necessario fare clic su di esso.

Ti porterà alla schermata di conferma, a dimostrazione che hai configurato correttamente le notifiche push web OneSignal per il tuo sito web.

Torna alla schermata di configurazione sul sito web OneSignal e fai clic su 'Controlla lo stato delle notifiche'pulsante.

Ora vedrai un altro messaggio di successo che indica che hai aggiunto correttamente le notifiche push web al tuo sito WordPress.

Come inviare notifiche push Web in WordPress con OneSignal

Il plugin per le notifiche push web OneSignal sul tuo sito WordPress invierà automaticamente una notifica a tutti gli abbonati quando pubblichi un nuovo post.

Puoi anche inviare manualmente notifiche dalla dashboard dell'app OneSignal. Accedi al tuo account OneSignal e fai clic sul nome della tua app.

Dal menu alla tua sinistra, fai clic sul pulsante "Nuovo messaggio".

Questo ti porterà alla schermata del nuovo messaggio. È possibile inserire un titolo e alcuni contenuti per la notifica.

Puoi anche fare clic su Opzioni, Segmenta, Pianifica / Invia in seguito per personalizzare ulteriormente la tua notifica push web.

Ad esempio, puoi collegarlo a una particolare pagina del tuo sito, inviarlo a un particolare segmento dei tuoi utenti o programmarlo per essere inviato in un momento specifico.

Speriamo che questo articolo ti abbia aiutato ad aggiungere la notifica push web al tuo sito WordPress. Potresti anche voler vedere la nostra lista dei migliori plugin di appartenenza per WordPress.

Se questo articolo ti è piaciuto, ti preghiamo di iscriverti al nostro canale YouTube per le esercitazioni video di WordPress. Puoi anche trovarci su Twitter e Facebook.