Come creare uno shortcode della pagina di logout di WooCommerce

Pubblicato: 2020-08-22

WooCommerce Crea uno shortcode della pagina di logout Vuoi creare uno shortcode della pagina di logout di WooCommerce che puoi utilizzare ovunque sul tuo sito WooCommerce? Se stai cercando un rapido esempio che funzioni effettivamente con lo shortcode della pagina di logout di WooCommerce , questo esempio ti renderà più facile capire come farlo.

L'uso degli shortcode rende più facile per i proprietari di negozi WooCommerce personalizzare rapidamente i propri siti senza codificare o con competenze di codifica minime.

Oggi condividerò con te un modo rapido, facile e brillante per creare uno shortcode della pagina di logout di WooCommerce e distribuirlo ovunque sul tuo sito e con un solo clic i tuoi utenti saranno disconnessi.

Come al solito, illustrerò passo dopo passo come funziona il mio codice per semplificare l'aggiunta del codice al tema del tuo negozio. Se sei un nuovo sviluppatore WordPress o uno sviluppatore WooCommerce principiante

Endpoint di disconnessione WooCommerce

Per impostazione predefinita WooCommerce fornisce agli utenti un endpoint predefinito per il logout che può essere utilizzato per creare URL di logout e puoi accedervi nelle impostazioni di WooCommerce come condiviso nell'immagine seguente:

Endpoint di disconnessione WooCommerce

Puoi personalizzare questo endpoint in base alle tue preferenze come spiegato in questo articolo – Personalizzazione degli endpoint WooCommerce.

Oltre all'endpoint di logout di WooCommerce, ci sono molti altri endpoint che puoi utilizzare per personalizzare i tuoi URL WooCommerce e includono gli endpoint della pagina Checkout e della pagina Il mio account:

Punti finali di pagamento

I seguenti endpoint vengono utilizzati per le funzionalità relative al checkout e vengono aggiunti all'URL della pagina /checkout:

Pagina di pagamento – /order-pay/{ORDER_ID}
Ordine ricevuto (grazie) – /order-received/
Aggiungi metodo di pagamento – /add-payment-method/
Elimina metodo di pagamento – /delete-payment-method/
Imposta il metodo di pagamento predefinito – /set-default-payment-method/

Punti finali dell'account

I seguenti endpoint vengono utilizzati per le funzionalità relative all'account e vengono aggiunti all'URL della pagina /my-account:

Ordini – /orders/
Visualizza ordine – /view-order/{ORDER_ID}
Download – /downloads/
Modifica account (e cambia password) – /edit-account/
Indirizzi – /edit-address/
Metodi di pagamento – /payment-methods/
Password persa – /lost-password/
Logout – /customer-logout/

Crea uno shortcode della pagina di logout di WooCommerce

Utilizzeremo l'endpoint di disconnessione di WooCommerce per disconnettere l'utente e aggiungere il codice al pulsante shortcode.

L'endpoint di disconnessione di WooCommerce è – /customer-logout/ aggiungeremo un URL attribute =true per creare l'URL di disconnessione che utilizzeremo nel pulsante di disconnessione.

La struttura dell'URL completa dovrebbe essere la seguente site_url/?logout-endpoint=true

Crea uno shortcode per il logout di WooCommerce

Se non hai mai creato uno shortcode WordPress o WooCommerce, ho un'ottima guida che ho scritto per aiutarti a imparare come creare uno shortcode WordPress. - Controllalo qui.

Creiamo ora lo shortcode della pagina di logout di WooCommerce passo dopo passo:

Passaggio 1 : crea le funzioni di hook e callback dell'azione per lo shortcode della pagina di logout – ad esempio puoi crearlo come segue : add_shortcode( 'wc_logout_shortcode', 'njengah_wc_logout_shortcode' ); . La funzione di callback può anche essere creata come segue: function njengah_wc_logout_shortcode(){ }
Passaggio 2: controlla se l'utente ha effettuato l'accesso utilizzando il codice che ho condiviso in questo tutorial su – come verificare se l'utente è connesso a WordPress: if (is_user_logged_in())
Passaggio 3: crea la variabile URL di logout e puoi creare dall'endpoint WooCommerce come segue: $wc_shortcode_logout_url = site_url() . '/?customer-logout=true'; $wc_shortcode_logout_url = site_url() . '/?customer-logout=true';
Passaggio 4: crea il codice del pulsante e aggiungi una classe in modo da poterlo modellare rapidamente per adattarlo alla combinazione di colori del tuo tema WooCommerce. <button class="wc_logout_shortcode_btn"><a href="<?php echo $wc_shortcode_logout_url; ?>">Log Out</a></button>
Passaggio 5: metti insieme questo codice e aggiungi il codice al tuo tema tramite il file functions.php oppure puoi includere il codice nello sviluppo del tuo plug-in WooCommerce personalizzato.
Passaggio 6: prova lo shortcode [wc_logout_shortcode] ovunque su una pagina o un post o anche un widget WordPress che supporti gli shortcode e dovresti vedere il pulsante di disconnessione di WooCommerce visualizzato dove aggiungi lo shortcode.

Quello che segue è lo snippet di codice completo che puoi aggiungere a functions.php per creare lo shortcode della pagina di logout di WooCommerce:

 /**
 * Aggiungi un pulsante shortcode della pagina di logout di WooCommerce
 */

// Hook azione shortcode 

add_shortcode( 'wc_logout_shortcode', 'njengah_wc_logout_shortcode');

// Richiama 

funzione njengah_wc_logout_shortcode(){
	
    ob_start();
    // Controlla se l'utente ha effettuato l'accesso 
    se (is_user_logged_in()){ 
          // Crea la variabile URL 
	   $wc_shortcode_logout_url = site_url() . '/?customer-logout=true';?>
	    <button class="wc_logout_shortcode_btn"><a href="<?php echo $wc_shortcode_logout_url; ?>">Esci</a></button> 
        <?php 
	}

    restituisci ob_get_clean();
}

Ora puoi testare lo shortcode aggiungendolo a una nuova pagina o pubblicalo come mostrato nell'immagine qui sotto e dovresti vedere il pulsante visualizzato sul frontend.

shortcode della pagina di logout di woocommerce

Prova il pulsante Shortcode Logout WooCommerce sulla pagina

Infine, sul frontend dovresti testare il pulsante di logout e vedere se funziona come mostrato nell'immagine qui sotto. Se hai seguito tutti i passaggi, lo shortcode per la disconnessione di WooCommerce dovrebbe funzionare come mostrato nel mio esempio di seguito:

esempio di shortcode per la disconnessione di woocommerce

Conclusione

In questo post, ho condiviso con te come creare uno shortcode per la funzionalità di logout di WooCommerce. Se vuoi uscire senza che venga visualizzato un messaggio di conferma, ho scritto una buona guida su come rimuovere il messaggio di conferma della disconnessione di WooCommerce.

In un breve riassunto, per creare uno shortcode per la disconnessione di WooCommerce, è necessario sfruttare l'endpoint di disconnessione di WooCommerce predefinito. Puoi anche modificare questo URL dell'endpoint in qualsiasi variabile desideri e aggiungerlo al tuo codice e funzionerà!

Come creare uno shortcode della pagina di logout di WooCommerce

Endpoint di disconnessione WooCommerce

Punti finali di pagamento

Punti finali dell'account

Crea uno shortcode della pagina di logout di WooCommerce

Crea uno shortcode per il logout di WooCommerce

Prova il pulsante Shortcode Logout WooCommerce sulla pagina

Conclusione

Articoli simili