Notifiche di WordPress rese facili

Pubblicato: 2022-03-10
Riepilogo rapido ↬ Stai cercando un modo per creare un sistema di notifica quando usi WordPress? Scopri il plug-in "Notifica", una soluzione all-in-one per qualsiasi sistema di notifica WordPress personalizzato.

WordPress non offre alcun tipo di sistema di notifica. Tutto ciò che puoi usare è la funzione wp_mail() , ma tutte le impostazioni devono essere codificate, oppure devi creare una schermata delle impostazioni separata per consentire all'utente di modificare le opzioni. Ci vogliono molte ore per scrivere un sistema che sia affidabile, configurabile e facile da usare. Ma non più. Ti mostrerò come creare il tuo sistema di notifica in pochi minuti con il plug-in di notifica gratuito. Per notifica, intendo qualsiasi tipo di notifica . La maggior parte delle volte si tratterà di e-mail, ma con il plug-in che utilizzeremo, puoi anche inviare webhook e altri tipi di notifiche.

Durante la creazione di un progetto per uno dei miei clienti, ho riscontrato questo problema che ho descritto. Il requisito era avere più avvisi e-mail personalizzati con contenuto configurabile. Invece di codificare ogni singolo avviso, ho deciso di creare un sistema. Volevo che fosse molto flessibile e l'obiettivo era di essere in grado di programmare nuovi scenari il più rapidamente possibile.

Il codice che ho scritto è stato l'inizio di un grande viaggio di sviluppo. Si è scoperto che il sistema che ho creato era abbastanza flessibile da poter funzionare come un pacchetto separato. È così che è nato il plugin di notifica.

Supponiamo di voler inviare un'e-mail su un profilo utente aggiornato da uno dei membri del tuo sito web. WordPress non fornisce questa funzionalità, ma con il plug-in di notifica puoi creare un'e-mail di questo tipo in pochi minuti. Oppure supponi di voler sincronizzare i tuoi prodotti WooCommerce con software di terze parti inviando un webhook a un URL separato ogni volta che viene pubblicato un nuovo prodotto. Anche questo è facile da fare con il plugin.

Lezioni apprese durante lo sviluppo di plugin per WordPress

Un buon supporto e sviluppo di plugin portano a più download. Più download significano più soldi e una migliore reputazione. Scopri come sviluppare prodotti di buona qualità con sette regole d'oro. Leggi un articolo correlato →

In questo articolo imparerai come integrare il plugin nella tua applicazione e come creare un sistema di notifica WordPress avanzato più velocemente e facilmente che mai.

In questo articolo tratteremo:

  1. come installare il plugin,
  2. l'idea alla base del plugin e della sua architettura,
  3. creare uno scenario personalizzato per le notifiche,
  4. creazione dell'azione (passaggio 1 del processo),
  5. creazione del trigger (passaggio 2 del processo),
  6. creando il tipo di notifica personalizzato,
  7. come abilitare la modalità white label e raggruppare il plugin nel tuo pacchetto.
Altro dopo il salto! Continua a leggere sotto ↓

Installazione del plugin

Per creare i tuoi scenari, avrai bisogno del plug-in di notifica. Installalo semplicemente dal repository di WordPress.org nella dashboard di WordPress o scaricalo dal repository GitHub.

Anteprima ampia

Più avanti nell'articolo imparerai come nascondere questo plugin ai tuoi clienti e farlo funzionare come parte integrante del tuo plugin o tema.

L'idea del plugin

Prima di entrare nel tuo editor di codice, devi sapere come appare l'architettura del plugin. Il plugin contiene molti vari componenti, ma il suo nucleo sono in realtà alcune classi astratte.

I componenti principali sono:

  • La notifica
    Potrebbe trattarsi di un'e-mail, un webhook, una notifica push o un SMS.
  • Il grilletto
    Questo è ciò che invia la notifica. È effettivamente l'azione di WordPress.
  • Il tag di unione
    Questa è una piccola parte del contenuto dinamico, come {post_title} .

Per darti un'idea migliore di come funziona tutto insieme, puoi guardare questo breve video:

Il nucleo del plug-in di notifica è in realtà solo un'API. Tutti i trigger predefiniti, come Post pubblicato e Utente registrato , sono elementi basati su quell'API.

Poiché il plug-in è stato creato per gli sviluppatori, aggiungere i propri trigger è molto semplice. Tutto ciò che serve è un'azione WordPress, che è solo una singola riga di codice e una dichiarazione di classe.

Scenario personalizzato

Progettiamo uno scenario semplice. Aggiungeremo un'area di testo e un pulsante in fondo a ogni post, consentendo la segnalazione di bug nell'articolo. Quindi, attiveremo la notifica al momento dell'invio del modulo.

Questo scenario è stato trattato in un altro articolo, "Invio di moduli senza ricaricare la pagina: implementazione AJAX in WordPress".

Per semplicità, rendiamolo un modulo statico, ma non ci sono problemi a inserire l'azione in un gestore AJAX, invece che nella funzione wp_mail() .

Creiamo il modulo.

Il modulo

 add_filter( 'the_content', 'report_a_bug_form' ); function report_a_bug_form( $content ) { // Display the form only on posts. if ( ! is_single() ) { return $content; } // Add the form to the bottom of the content. $content .= '<form action="' . admin_url( 'admin-post.php' ) . '" method="POST"> <input type="hidden" name="post_id" value="' . get_ID() . '"> <input type="hidden" name="action" value="report_a_bug"> <textarea name="message" placeholder="' . __( 'Describe what\'s wrong...', 'reportabug' ) . '"></textarea> <button>' . __( 'Report a bug', 'reportabug' ) . '</button> </div>'; return $content; }

Tieni presente che mancano molti componenti, come i nonce di WordPress, la gestione degli errori e la visualizzazione del risultato dell'azione, ma questi non sono l'argomento di questo articolo. Per capire meglio come gestire queste azioni, leggi l'articolo sopra menzionato.

Preparare l'azione

Per attivare la notifica, avremo bisogno di una sola azione. Questa non deve essere un'azione personalizzata come quella di seguito. Puoi utilizzare una qualsiasi delle azioni già registrate nel core di WordPress o in un altro plug-in.

Il gestore di moduli e l'azione

 add_action( 'admin_post_report_a_bug', 'report_a_bug_handler' ); add_action( 'admin_post_nopriv_report_a_bug', 'report_a_bug_handler' ); function report_a_bug_handler() { do_action( 'report_a_bug', $_POST['post_id'], $_POST['message'] ); // Redirect back to the article. wp_safe_redirect( get_permalink( $_POST['post_id'] ) ); exit; }

Puoi leggere di più su come utilizzare il file admin-post.php nel codice di WordPress.

Questo è tutto ciò di cui abbiamo bisogno per creare una notifica personalizzata e configurabile. Creiamo il trigger.

Registrazione del trigger personalizzato

Il trigger è solo una semplice classe che estende il trigger astratto. La classe astratta fa tutto il lavoro per te. Inserisce il trigger nell'elenco e gestisce le notifiche e i tag di unione.

Iniziamo con la dichiarazione trigger.

Definizione di trigger minimo

 class ReportBug extends \BracketSpace\Notification\Abstracts\Trigger { public function __construct() { // Add slug and the title. parent::__construct( 'reportabug', __( 'Bug report sent', 'reportabug' ) ); // Hook to the action. $this->add_action( 'report_a_bug', 10, 2 ); } public function merge_tags() {} }

Tutto quello che devi fare è chiamare il costruttore genitore e passare il trigger slug e il bel nome.

Quindi, possiamo agganciarci alla nostra azione personalizzata. Il metodo add_action è molto simile alla funzione add_action() ; quindi, il secondo parametro è la priorità e l'ultimo è il numero di argomenti. Manca solo il parametro callback perché la classe astratta lo fa per noi.

Avendo la classe, possiamo registrarla come nostro nuovo trigger.

 register_trigger( new ReportBug() );

Questo è ora un trigger completamente funzionante. Puoi selezionarlo dall'elenco durante la composizione di una nuova notifica.

(Grande anteprima)

Sebbene il trigger funzioni e possiamo già inviare la notifica che vogliamo, non è molto utile. Non abbiamo alcun modo per mostrare al destinatario quale post ha un bug e qual è il messaggio.

Questo sarebbe il momento, quindi, di registrare alcuni tag di unione e impostare il contesto del trigger con i parametri di azione che abbiamo: l'ID del post e il messaggio.

Per fare ciò, possiamo aggiungere un altro metodo alla classe trigger. Questo è il callback dell'azione, in cui possiamo catturare gli argomenti dell'azione.

Gestione degli argomenti di azione

 public function action( $post_ID, $message ) { // If the message is empty, don't send any notifications. if ( empty( $message ) ) { return false; } // Set the trigger properties. $this->post = get_post( $post_ID ); $this->message = $message; }

Nota il return false; dichiarazione. Se restituisci false da questo metodo, il trigger verrà interrotto e non verrà inviata alcuna notifica. Nel nostro caso, non vogliamo che una notifica venga inviata con un messaggio vuoto. Nel mondo reale, vorresti convalidarlo prima che il modulo venga inviato.

Quindi, impostiamo semplicemente le proprietà della classe trigger, l'oggetto post completo e il messaggio. Ora possiamo usarli per aggiungere alcuni tag di unione al nostro trigger. Possiamo semplicemente riempire il contenuto del metodo merge_tags che abbiamo dichiarato in precedenza.

Definizione dei tag di unione

 public function merge_tags() { $this->add_merge_tag( new \BracketSpace\Notification\Defaults\MergeTag\UrlTag( array( 'slug' => 'post_url', 'name' => __( 'Post URL', 'reportabug' ), 'resolver' => function( $trigger ) { return get_permalink( $trigger->post->ID ); }, ) ) ); $this->add_merge_tag( new \BracketSpace\Notification\Defaults\MergeTag\StringTag( array( 'slug' => 'post_title', 'name' => __( 'Post title', 'reportabug' ), 'resolver' => function( $trigger ) { return $trigger->post->post_title; }, ) ) ); $this->add_merge_tag( new \BracketSpace\Notification\Defaults\MergeTag\HtmlTag( array( 'slug' => 'message', 'name' => __( 'Message', 'reportabug' ), 'resolver' => function( $trigger ) { return nl2br( $trigger->message ); }, ) ) ); $this->add_merge_tag( new \BracketSpace\Notification\Defaults\MergeTag\EmailTag( array( 'slug' => 'post_author_email', 'name' => __( 'Post author email', 'reportabug' ), 'resolver' => function( $trigger ) { $author = get_userdata( $trigger->post->post_author ); return $author->user_email; }, ) ) ); }

Ciò aggiungerà quattro tag di unione, tutti pronti per l'uso durante la composizione di una notifica.

Il tag di unione è un'istanza di una classe speciale. Puoi vedere che ci sono molti tipi di questi tag e li stiamo usando a seconda del valore restituito dal risolutore. Puoi vedere tutti i tag di unione nel repository GitHub.

Tutti i tag di unione vengono aggiunti tramite il metodo add_merge_tag e richiedono l'array di configurazione con tre chiavi:

  • lumaca
    Il valore statico che verrà utilizzato nella notifica (ovvero {post_url} ).
  • nome
    L'etichetta tradotta per il tag di unione.
  • risolutore
    La funzione che sostituisce il tag di unione con il valore effettivo.

Il risolutore non deve essere per forza la chiusura, come nel nostro caso, ma utilizzarlo è conveniente. Puoi passare un nome di funzione come una stringa o un array se questo è un metodo in un'altra classe.

Nella funzione resolver è disponibile un solo argomento: l'istanza della classe trigger. Pertanto, possiamo accedere alle proprietà che abbiamo appena impostato nel metodo di action e restituire il valore di cui abbiamo bisogno.

E questo è tutto! I tag di unione non sono disponibili per l'uso con il nostro trigger e possiamo impostare tutte le notifiche della segnalazione di bug che desideriamo.

(Grande anteprima)

Creazione del tipo di notifica personalizzato

Il plug-in di notifica offre non solo trigger personalizzati, ma anche tipi di notifica personalizzati. Il plug-in viene fornito con due tipi, e-mail e webhook, ma ha una semplice API per registrare le tue notifiche.

Funziona in modo molto simile al trigger personalizzato: per registrarlo è necessaria anche una classe e una chiamata a una semplice funzione.

Sto mostrando solo un esempio; l'implementazione varierà a seconda del sistema che si desidera integrare. Potrebbe essere necessario includere una libreria di terze parti e chiamare la sua API o operare nel file system di WordPress, ma la guida seguente ti configurerà con il processo di base.

Iniziamo con una dichiarazione di classe:

 class CustomNotification extends \BracketSpace\Notification\Abstracts\Notification { public function __construct() { // Add slug and the title. parent::__construct( 'custom_notification', __( 'Custom Notification', 'textdomain' ) ); } public function form_fields() {} public function send( \BracketSpace\Notification\Interfaces\Triggerable $trigger ) {} }

Nel costruttore, devi chiamare il costruttore di classe del genitore e passare lo slug e il bel nome della notifica.

Il metodo form_fields viene utilizzato per creare un modulo di configurazione per le notifiche. (Ad esempio, la notifica e-mail dovrebbe avere un oggetto, un corpo, ecc.)

Il metodo send viene chiamato dal trigger ed è qui che puoi chiamare l'API di terze parti con cui desideri integrarti.

Successivamente, devi registrarlo con la funzione register_notification .

 register_trigger( new CustomNotification() );

Il modulo di notifica

Potrebbe esserci un caso in cui hai una notifica senza campi di configurazione. Va bene, ma molto probabilmente vorrai dare all'amministratore di WordPress un modo per configurare il contenuto della notifica con i tag di unione.

Ecco perché registreremo due campi, il titolo e il messaggio, nel metodo form_fields . Si presenta così:

 public function form_fields() { $this->add_form_field( new \BracketSpace\Notification\Defaults\Field\InputField( array( 'label' => __( 'Title', 'textdomain' ), 'name' => 'title', 'resolvable' => true, 'description' => __( 'You can use merge tags', 'textdomain' ), ) ) ); $this->add_form_field( new \BracketSpace\Notification\Defaults\Field\TextareaField( array( 'label' => __( 'Message', 'textdomain' ), 'name' => 'message', 'resolvable' => true, 'description' => __( 'You can use merge tags', 'textdomain' ), ) ) ); }

Come puoi vedere, ogni campo è un oggetto ed è registrato con il metodo add_form_field . Per l'elenco di tutti i tipi di campo disponibili, visita il repository GitHub.

Ogni campo ha l'etichetta traducibile, il nome univoco e un insieme di altre proprietà. È possibile definire se il campo deve essere risolto con i tag di unione con la chiave resolvable . Ciò significa che quando qualcuno utilizza il tag di unione {post_title} in questo campo, verrà modificato con il titolo effettivo del post. Puoi anche fornire il campo della description per una migliore esperienza utente.

A questo punto, il tipo di notifica personalizzato può essere utilizzato nell'interfaccia del plug-in con qualsiasi tipo di trigger disponibile.

(Grande anteprima)

Invio della notifica personalizzata

Per farlo funzionare davvero, dobbiamo usare il metodo send nella nostra dichiarazione di classe di notifica. Questo è il luogo in cui puoi scrivere una chiamata API o utilizzare il file system di WordPress o qualsiasi API di WordPress e fare tutto ciò che vuoi con i dati di notifica.

Ecco come puoi accedervi:

 public function send( \BracketSpace\Notification\Interfaces\Triggerable $trigger ) { $title = $this->data['title']; $message = $this->data['message']; // @todo Write the integration here. }

A questo punto, tutti i campi vengono risolti con i tag di unione, il che significa che le variabili sono pronte per essere spedite.

Ciò ti offre infinite possibilità di integrare WordPress con qualsiasi servizio, che si tratti del tuo provider SMS locale, di un'altra installazione di WordPress o di qualsiasi API esterna con cui desideri comunicare.

Etichettatura bianca e raggruppamento del plug-in

Non è l'ideale creare una dipendenza di un plug-in che può essere facilmente disattivato e disinstallato. Se stai creando un sistema che richiede davvero che il plug-in di notifica sia sempre disponibile, puoi raggruppare il plug-in nel tuo codice.

Se hai già utilizzato il plug-in Advanced Custom Fields, probabilmente hai familiarità con la procedura di raggruppamento. Copia semplicemente i file del plug-in sul tuo plug-in o tema e richiama il plug-in manualmente.

Il plug-in di notifica funziona in modo molto simile, ma invocare il plug-in è molto più semplice rispetto ai campi personalizzati avanzati.

Basta copiare i file del plug-in e richiedere un file per farlo funzionare.

 require_once( 'path/to/plugin/notification/load.php' );

Il plugin scoprirà la sua posizione e gli URL.

Ma raggruppare il plugin potrebbe non essere sufficiente. Forse devi nascondere completamente che stai utilizzando questa soluzione di terze parti. Questo è il motivo per cui il plug-in di notifica è dotato di una modalità white label, che puoi attivare in qualsiasi momento.

Inoltre è abilitato come chiamata singola a una funzione:

 notification_whitelabel( array( // Admin page hook under which the Notifications will be displayed. 'page_hook' => 'edit.php?post_type=page', // If display extensions page. 'extensions' => false, // If display settings page. 'settings' => false, // Limit settings access to user IDs. // This works only if settings are enabled. 'settings_access' => array( 123, 456 ), ) );

Per impostazione predefinita, la chiamata a questa funzione nasconderà tutti i trigger predefiniti.

L'utilizzo di entrambe le tecniche, etichettatura bianca e raggruppamento, nasconderà completamente qualsiasi riferimento all'origine del plug-in e la soluzione si comporterà come una parte completamente integrata del sistema.

Conclusione

Il plug-in di notifica è una soluzione all-in-one per qualsiasi sistema di notifica WordPress personalizzato. È estremamente facile da configurare e funziona immediatamente. Tutti i trigger registrati funzioneranno con qualsiasi tipo di notifica e, se hai requisiti avanzati, puoi risparmiare tempo utilizzando un'estensione esistente.

Se desideri saperne di più dettagli e tecniche avanzate, vai al sito Web della documentazione.

Sono sempre aperto a nuove idee, quindi se ne hai, puoi contattarmi qui nei commenti, tramite i problemi di GitHub o su Twitter.

Scarica il plugin dal repository e provalo!