{"id":233635,"date":"2023-02-18T16:05:00","date_gmt":"2023-02-18T13:05:00","guid":{"rendered":"https:\/\/wordpress.mediadoma.com\/?p=233635"},"modified":"2022-11-11T00:45:39","modified_gmt":"2022-11-10T21:45:39","slug":"come-aggiungere-endpoint-personalizzati-alla-pagina-il-mio-account-in-woocommerce","status":"publish","type":"post","link":"https:\/\/wordpress.mediadoma.com\/it\/come-aggiungere-endpoint-personalizzati-alla-pagina-il-mio-account-in-woocommerce\/","title":{"rendered":"Come aggiungere endpoint personalizzati alla pagina Il mio account in WooCommerce"},"content":{"rendered":"\n

Questo post spiega come aggiungere endpoint personalizzati alla pagina "Il mio account" di WooCommerce<\/a>. Possiamo renderlo accessibile in due modi: come scheda personalizzata o come pulsante per ciascun ordine nella scheda "Ordini".<\/p>\n

La pagina "Il mio account" di WooCommerce utilizza la funzionalit\u00e0 integrata di WordPress per gli endpoint che semplifica la regolazione o l’aggiunta dei propri endpoint. Se non hai dimestichezza con gli endpoint, ti consiglio di leggere il mio post che approfondisce come aggiungere endpoint personalizzati in WordPress<\/a>.<\/p>\n

Il modo in cui rendi accessibile il tuo endpoint personalizzato per l’utente da "Il mio account" dipende interamente dalle esigenze del tuo negozio online. Se desideri semplicemente una pagina generale per ulteriori informazioni, puoi aggiungere questa pagina come scheda a s\u00e9 stante. Se tuttavia desideri che il tuo endpoint sia correlato a ciascun ordine, devi aggiungere il tuo endpoint a ciascuna riga dell’ordine nella scheda "Ordini". In questo post esamineremo entrambi i metodi.<\/p>\n

Aggiunta di una scheda personalizzata e di un endpoint a "Il mio account"<\/h2>\n

Per esempio, supponiamo che il nostro negozio online venda software e abbiamo bisogno di un posto dove mostrare le chiavi di licenza dei nostri clienti nella loro pagina "Il mio account". Aggiungeremo una scheda personalizzata "Chiavi di licenza" che dovrebbe restituire tutte le chiavi di licenza valide registrate per quell’utente.<\/p>\n

Aggiunta di un endpoint personalizzato<\/h3>\n

Nel codice del nostro tema functions.php<\/code>o del plugin, aggiungiamo prima il nostro endpoint personalizzato utilizzando add_rewrite_endpoint()<\/code>. Come primo argomento a questo forniamo una chiave univoca. Nell’esempio seguente ho chiamato l’endpoint ‘ license-keys<\/code>‘.<\/p>\n

add_action('init', function() {\n    add_rewrite_endpoint('license-keys', EP_ROOT | EP_PAGES);\n});<\/code><\/pre>\n
Tieni presente che WordPress aggiunge automaticamente la nostra chiave per interrogare vars durante l’utilizzo add_rewrite_endpoint()<\/code>, quindi non \u00e8 necessario filtrare query_vars<\/code>.<\/p>\n
Se riscontri errori "404 non trovato", devi aggiornare i tuoi permalink. Puoi farlo andando su Impostazioni> Permalink e fai semplicemente clic su Salva. Ogni volta che apportiamo modifiche ai permalink o agli endpoint, dobbiamo farlo.<\/p>\n
Aggiunta di una scheda personalizzata<\/h3>\n
Il passaggio successivo consiste nell’aggiungere una scheda alle schede della pagina "Il mio account". Lo facciamo con il filtro woocommerce_account_menu_items<\/code>. L’array fornito dal filtro contiene tutti i tasti di tabulazione e la relativa etichetta.<\/p>\n
Puoi semplicemente aggiungere la tua scheda alla fine dell’array, ma se vuoi un maggiore controllo su dove dovrebbe apparire la tua scheda, devi manipolare l’array usando le funzioni PHP. Nell’esempio sopra lo voglio alla fine, ma prima della scheda "Esci". Quindi estraggo la scheda "Esci", inserisco la mia scheda e quindi rimetto la scheda "Esci" dopo.<\/p>\n
add_filter('woocommerce_account_menu_items', function($items) {\n    $logout = $items['customer-logout'];\n    unset($items['customer-logout']);\n    $items['license-keys'] = __('License keys', 'txtdomain');\n    $items['customer-logout'] = $logout;\n    return $items;\n});<\/code><\/pre>\n
Se aggiorni la pagina Il mio account ora, dovresti vedere la tua scheda apparire prima di "Esci". Cliccandoci sopra si accede all’URL ” <example.com>\/my-account\/license-keys\/<\/code>“. Tuttavia non vedrai nulla di cambiamento quando fai clic sulla scheda. Questo perch\u00e9 non abbiamo definito cosa produrre. Questo \u00e8 il nostro prossimo passo.<\/p>\n
Rendering del contenuto della scheda personalizzata<\/h3>\n
WooCommerce offre l’hook woocommerce_account_<endpoint key>_endpoint<\/code>per l’output di contenuti in "Il mio account", dove si sostituisce con la chiave dell’endpoint personalizzata. Nel nostro esempio l’hook corretto sarebbe woocommerce_account_license-keys_endpoint<\/code>.<\/p>\n
add_action('woocommerce_account_license-keys_endpoint', function() {\n    _e('Your license keys', 'txtdomain');\n});<\/code><\/pre>\n
Per quanto riguarda l’output effettivo della scheda, dipende interamente da te. Potresti fare una query, recuperare alcune informazioni e quindi emetterle. Tuttavia si consiglia di utilizzare i modelli per l’output dell’HTML invece di produrre l’output HTML completo direttamente all’interno della nostra funzione. WooCommerce offre ottime funzionalit\u00e0 per i modelli, quindi lo useremo.<\/p>\n
Utilizzando wc_get_template()<\/code>possiamo fornire un modello personalizzato (non \u00e8 necessario che sia uno dei modelli di WooCommerce). Come secondo argomento possiamo definire variabili che verranno passate al file template. Seguendo la struttura stabilita di WooCommerce, creiamo un modello WooCommerce personalizzato che abbiamo call license-keys.php<\/code>nella <theme>\/woocommerce\/myaccount\/<\/code>cartella.<\/p>\n
add_action('woocommerce_account_license-keys_endpoint', function() {\n    $licenses = [];  \/\/ Replace with function to return licenses for current logged in user\n    wc_get_template('myaccount\/license-keys.php', [\n        'licenses' => $licenses\n    ]);\n});<\/code><\/pre>\n
Vai avanti e crea un file vuoto <theme>\/woocommerce\/myaccount\/license-keys.php<\/code>. All’interno di questo \u00e8 dove definisci l’output della tua scheda personalizzata. Abbiamo anche accesso a tutte le variabili che abbiamo passato nell’array wc_get_template()<\/code>. Quindi nel nostro caso la $licenses<\/code>variabile sar\u00e0 disponibile e popolata con le informazioni che abbiamo passato dalla nostra funzione di endpoint. Puoi trasmettere tutte le variabili di cui hai bisogno.<\/p>\n
Aggiunta di un endpoint e di un pulsante personalizzato a ciascun ordine nella pagina "Il mio account".<\/h2>\n
Continuiamo con lo stesso esempio sopra; supponendo che il tuo negozio online venda software e tu debba mostrare le chiavi di licenza del cliente da qualche parte. Ma invece di aggiungere una scheda personalizzata per mostrarli tutti, forse preferisci mostrare le chiavi di licenza collegate a un ordine specifico? Potremmo aggiungere un pulsante personalizzato accanto a "Visualizza" nella panoramica degli ordini in Il mio account:<\/p>\n
\"Come<\/a><\/p>\n
Iniziamo facendo lo stesso che abbiamo fatto sopra: registrazione di un endpoint personalizzato:<\/p>\n
Registra un endpoint personalizzato<\/h3>\n
add_action('init', function() {\n    add_rewrite_endpoint('license-keys', EP_ROOT | EP_PAGES);\n});<\/code><\/pre>\n
Non dimenticare di svuotare i permalink (vai su Impostazioni > Permalink e premi il pulsante Salva)!<\/p>\n
Aggiungi un’azione personalizzata (e un pulsante)<\/h3>\n
Il passaggio successivo consiste nell’aggiungere il pulsante utilizzando il filtro woocommerce_my_account_my_orders_actions<\/code>. Come secondo argomento di questo filtro ottieni l’oggetto order. Questo \u00e8 molto utile; vogliamo controllare che l’ordine sia completato e pagato, in modo da non mostrare le chiavi di licenza per ordini non pagati o annullati. Con l’oggetto dell’ordine otteniamo anche l’ID dell’ordine che \u00e8 molto probabilmente necessario per interrogare le chiavi di licenza per i prodotti in quell’ordine. Nel codice qui sotto controllo semplicemente se lo stato dell’ordine \u00e8 completato o meno. Probabilmente dovrai aggiungere il tuo codice per verificare se ci sono o meno chiavi di licenza da mostrare per ordine.<\/p>\n
Per aggiungere un’azione personalizzata \u00e8 necessario fornire una chiave univoca e un array con valori autoesplicativi per ‘ url<\/code>‘ e ‘ name<\/code>‘. Per quanto riguarda l’URL, utilizziamo la funzione di WordPress per restituire l’URL dell’endpoint: wc_get_endpoint_url()<\/code>. Poich\u00e9 abbiamo bisogno di passare anche l’ID dell’ordine, impostiamo l’ID dell’ordine come secondo argomento per questa funzione, che risulta nel seguente URL: <example.com>\/my-account\/license-keys\/<order ID>\/<\/code>.<\/p>\n
add_filter('woocommerce_my_account_my_orders_actions', function($actions, $order) {\n    if ($order->get_status() == 'completed') {\n        $actions['view-license-keys'] = [\n            'url' => wc_get_endpoint_url('license-keys', $order->get_id()),\n            'name' => __('View license keys', 'txtdomain')\n        ];\n    }\n    return $actions;\n}, 10, 2);<\/code><\/pre>\n
Questo dovrebbe aggiungere un nuovo pulsante per ogni ordine completato:<\/p>\n
\"Come<\/a><\/p>\n
Ora tutto ci\u00f2 di cui abbiamo bisogno \u00e8 il modello da mostrare per l’endpoint license-keys<\/code>.<\/p>\n
Rendering dell’endpoint<\/h3>\n
Il modo in cui funzionano gli endpoint in WordPress \u00e8 che qualunque cosa venga dopo l’endpoint \u00e8 il valore di quella variabile di query; o in altre parole; quando visitiamo ad esempio l’URL <example.com>\/my-account\/license-keys\/204\/<\/code>che possiamo utilizzare get_query_var('license-keys')<\/code>per ottenere l’ID dell’ordine; 204.<\/p>\n
Per l’output del contenuto per il nostro endpoint personalizzato, ci colleghiamo a woocommerce_account_<endpoint key>_endpoint<\/code>quale nel nostro caso sarebbe woocommerce_account_license-keys_endpoint<\/code>. All’interno di quella funzione possiamo usare get_query_var()<\/code>per ottenere l’ID dell’ordine e con quella query l’ordine per eventuali chiavi di licenza.<\/p>\n
add_action('woocommerce_account_license-keys_endpoint', function() {\n    $order_id = get_query_var('license-keys');\n    $licenses = [];  \/\/ Function to return licenses for order ID\n\u00a0\n    wc_get_template('myaccount\/license-keys.php', [\n        'licenses' => $licenses,\n        'order_id' => $order_id\n    ]);\n});<\/code><\/pre>\n
L’output HTML effettivo del tuo modello personalizzato " myaccount\/license-keys.php<\/code>" dipende interamente dalle tue esigenze. Presumibilmente avresti utilizzato l’ID ordine per raccogliere le chiavi di licenza in un array e passarlo al modello per un buon output. Nel codice sopra sto anche passando l’ID dell’ordine in modo che sia accessibile come $order_id<\/code>all’interno del modello (ad esempio per l’output di un bel titolo "Chiavi di licenza per l’ordine n. 204").<\/p>\n
Fonte di registrazione:  awhitepixel.com<\/a><\/div><\/p>\n","protected":false},"excerpt":{"rendered":"
Questo post spiegher\u00e0 come aggiungere endpoint personalizzati a “Il mio account” di WooCommerce; sia come scheda propria, sia come pulsante per ciascun ordine nella scheda “Ordini”.<\/p>\n","protected":false},"author":1,"featured_media":223696,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":"","_wp_rev_ctl_limit":""},"categories":[1110,814,814,844,844,855,855,865,865],"tags":[1168],"class_list":["post-233635","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-n-a","category-plugin-2","category-tutorial","category-woocommerce-6","category-wordpress-6","tag-affiai-it"],"_links":{"self":[{"href":"https:\/\/wordpress.mediadoma.com\/it\/wp-json\/wp\/v2\/posts\/233635","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/wordpress.mediadoma.com\/it\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/wordpress.mediadoma.com\/it\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/it\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/it\/wp-json\/wp\/v2\/comments?post=233635"}],"version-history":[{"count":0,"href":"https:\/\/wordpress.mediadoma.com\/it\/wp-json\/wp\/v2\/posts\/233635\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/it\/wp-json\/wp\/v2\/media\/223696"}],"wp:attachment":[{"href":"https:\/\/wordpress.mediadoma.com\/it\/wp-json\/wp\/v2\/media?parent=233635"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/it\/wp-json\/wp\/v2\/categories?post=233635"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/it\/wp-json\/wp\/v2\/tags?post=233635"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}