Kuinka lisätä mukautettuja päätepisteitä tilini -sivulle WooCommercessa

Tässä viestissä käydään läpi, kuinka voit lisätä mukautettuja päätepisteitä WooCommercen "Oma tili" -sivulle. Voimme tehdä sen saataville kahdella tavalla; joko omana mukautettuna välilehtenä tai painikkeena jokaiselle tilaukselle "Tilaukset" -välilehdellä.

WooCommercen "Oma tili" -sivulla käytetään WordPressin sisäänrakennettua päätepisteiden toimintoa, jonka avulla on helppo säätää tai lisätä omia päätepisteitä. Jos et ole perehtynyt päätepisteisiin, suosittelen lukemaan viestini, jossa käsitellään yksityiskohtaisesti mukautettujen päätepisteiden lisäämistä WordPressiin.

Se, miten saat mukautetun päätepisteesi käyttäjän saataville "Oma tili" -sivulta, riippuu täysin verkkokauppasi tarpeista. Jos haluat vain yleisen sivun lisätiedoille, voit lisätä tämän sivun omaksi välilehdeksi. Jos kuitenkin haluat, että päätepisteesi liittyy jokaiseen tilaukseen, sinun on lisättävä päätepiste jokaiselle tilausriville "Tilaukset" -välilehdellä. Tässä viestissä tarkastellaan molempia tapoja.

Mukautetun välilehden ja päätepisteen lisääminen "Omaan tiliin"

Oletetaan esimerkiksi, että verkkokauppamme myy ohjelmistoja ja tarvitsemme paikan, jossa voimme näyttää asiakkaidemme lisenssiavaimet "Oma tili" -sivulla. Lisäämme mukautetun välilehden "Lisenssiavaimet", jonka pitäisi tulostaa kaikki kyseiselle käyttäjälle rekisteröidyt kelvolliset lisenssiavaimet.

Mukautetun päätepisteen lisääminen

Teemaamme functions.phptai laajennuskoodiin lisäämme ensin mukautetun päätepisteemme käyttämällä add_rewrite_endpoint(). Ensimmäisenä perusteena tälle tarjoamme ainutlaatuisen avaimen. Alla olevassa esimerkissä olen kutsunut päätepistettä " license-keys".

add_action('init', function() {
    add_rewrite_endpoint('license-keys', EP_ROOT | EP_PAGES);
});

Muista, että WordPress lisää automaattisesti avaimemme kyselyvarseihin käyttäessään add_rewrite_endpoint(), joten sinun ei tarvitse suodattaa query_vars.

Jos kohtaat "404 ei löydy" -virheitä, sinun on päivitettävä pysyvät linkit. Voit tehdä tämän siirtymällä kohtaan Asetukset > Pysyvät linkit ja napsauttamalla Tallenna. Aina kun teemme muutoksia pysyviin linkkeihin tai päätepisteisiin, meidän on tehtävä tämä.

Mukautetun välilehden lisääminen

Seuraava vaihe on välilehden lisääminen "Oma tili" -sivun välilehdille. Teemme tämän suodattimen kanssa woocommerce_account_menu_items. Suodattimen tuottama taulukko sisältää kaikki sarkainnäppäimet ja niitä vastaavat tunnisteet.

Voit yksinkertaisesti lisätä välilehden taulukon loppuun, mutta jos haluat enemmän hallita sitä, missä välilehden pitäisi näkyä, sinun on manipuloitava taulukkoa PHP-funktioilla. Yllä olevassa esimerkissä haluan sen loppuun, mutta ennen "Kirjaudu ulos" -välilehteä. Joten poistan "Kirjaudu ulos" -välilehden ulos, lisään välilehden ja laitan sitten "Kirjaudu ulos" -välilehden takaisin.

add_filter('woocommerce_account_menu_items', function($items) {
    $logout = $items['customer-logout'];
    unset($items['customer-logout']);
    $items['license-keys'] = __('License keys', 'txtdomain');
    $items['customer-logout'] = $logout;
    return $items;
});

Jos päivität Oma tili -sivusi nyt, sinun pitäisi nähdä välilehti ennen "Kirjaudu ulos". Napsauttamalla sitä pääset URL-osoitteeseen " <example.com>/my-account/license-keys/". Et kuitenkaan näe mitään muutosta, kun napsautat välilehteä. Tämä johtuu siitä, että emme ole määrittäneet, mitä tulostetaan. Se on seuraava askelemme.

Muokatun välilehden sisällön renderöiminen

WooCommerce tarjoaa koukun woocommerce_account_<endpoint key>_endpointsisällön tulostamiseen "Oma tilille", jossa korvaat sen mukautetulla päätepisteavaimella. Esimerkissämme oikea koukku olisi woocommerce_account_license-keys_endpoint.

add_action('woocommerce_account_license-keys_endpoint', function() {
    _e('Your license keys', 'txtdomain');
});

Mitä tulee välilehden todelliseen tuottoon, tämä on täysin sinun päätettävissäsi. Voit tehdä kyselyn, hakea tietoja ja sitten tulostaa sen. On kuitenkin suositeltavaa käyttää malleja HTML:n tulostamiseen sen sijaan, että koko HTML tulostettaisiin suoraan funktiossamme. WooCommerce tarjoaa erinomaiset toiminnot malleille, joten käytämme sitä.

Käyttämällä wc_get_template()voimme tarjota mukautetun mallin (sen ei tarvitse olla yksi WooCommercen malleista). Toisena argumenttina voimme määritellä muuttujat, jotka välitetään mallitiedostoon. WooCommercen vakiintuneen rakenteen mukaisesti luomme mukautetun WooCommerce-mallin, jonka me call license-keys.phpkansioon <theme>/woocommerce/myaccount/.

Mene eteenpäin ja luo tyhjä tiedosto <theme>/woocommerce/myaccount/license-keys.php. Tämän sisällä voit määrittää mukautetun välilehden tulosteen. Meillä on myös pääsy kaikkiin muuttujiin, jotka välitimme taulukossa wc_get_template(). Joten meidän tapauksessamme $licensesmuuttuja on saatavilla ja täytetään tiedoilla, jotka välitimme päätepistefunktiostamme. Voit välittää niin monta muuttujaa kuin tarvitset.

Päätepisteen ja mukautetun painikkeen lisääminen jokaiseen tilaukseen "Oma tili" -sivulla

Jatketaan samalla esimerkillä yllä; olettaen, että verkkokauppasi myy ohjelmistoja ja sinun on näytettävä asiakkaan lisenssiavaimet jossain. Mutta sen sijaan, että lisäisit mukautetun välilehden näyttämään ne kaikki, ehkä haluat mieluummin näyttää tiettyyn tilaukseen liitetyt lisenssiavaimet? Voisimme lisätä mukautetun painikkeen "Näytä"-kohdan viereen Oma tili -sivun tilauskatsauksessa:

Aloitetaan tekemällä sama kuin edellä: rekisteröidään mukautettu päätepiste:

Rekisteröi mukautettu päätepiste

add_action('init', function() {
    add_rewrite_endpoint('license-keys', EP_ROOT | EP_PAGES);
});

Älä unohda huuhdella pysyvät linkit (siirry kohtaan Asetukset > Pysyvät linkit ja paina Tallenna-painiketta)!

Lisää mukautettu toiminto (ja painike)

Seuraava vaihe on painikkeen lisääminen suodattimen avulla woocommerce_my_account_my_orders_actions. Toisena argumenttina tälle suodattimelle saat tilausobjektin. Se on erittäin hyödyllistä; Haluamme tarkistaa, että tilaus on valmis ja maksettu, jotta emme näytä maksamattomien tai peruutettujen tilausten lisenssiavaimia. Tilausobjektin avulla saamme myös tilaustunnuksen, joka on todennäköisimmin välttämätön tilauksen tuotteiden lisenssiavainten kyselyyn. Alla olevasta koodista tarkistan vain, onko tilauksen tila valmis vai ei. Sinun on luultavasti lisättävä oma koodisi tarkistaaksesi, onko tilausta kohti näytettävää lisenssiavaimia.

Jotta voimme lisätä mukautetun toiminnon, meidän on annettava yksilöllinen avain ja taulukko, jossa on itsestään selviä arvoja kohteille " url" ja " name". Mitä tulee URL-osoitteeseen, käytämme WordPressin toimintoa päätepisteen URL-osoitteen palauttamiseen: wc_get_endpoint_url(). Koska meidän on välitettävä myös tilaustunnus, asetamme tilaustunnuksen tämän funktion toiseksi argumentiksi, mikä johtaa seuraavan URL-osoitteen: <example.com>/my-account/license-keys/<order ID>/.

Tämän pitäisi lisätä uusi painike jokaiselle valmiille tilaukselle:

Nyt tarvitsemme vain mallin, joka näytetään päätepisteelle license-keys.

Loppupisteen renderöiminen

Päätepisteiden toimintatapa WordPressissä on se, että päätepisteen jälkeen tuleva on kyseisen kyselymuuttujan arvo. tai toisin sanoen; kun käymme esimerkiksi URL-osoitteessa, <example.com>/my-account/license-keys/204/jota voimme käyttää get_query_var('license-keys')tilaustunnuksen saamiseen; 204.

Muokatun päätepisteemme sisällön tuottamiseksi kiinnitämme siihen, woocommerce_account_<endpoint key>_endpointmikä meidän tapauksessamme olisi woocommerce_account_license-keys_endpoint. Tämän toiminnon sisällä voimme get_query_var()hankkia tilaustunnuksen ja tällä kyselyllä tilauksen mille tahansa lisenssiavaimelle.

Muokatun mallisi " myaccount/license-keys.php" todellinen HTML-tulostus riippuu täysin tarpeistasi. Oletettavasti olisit käyttänyt tilaustunnusta kerätäksesi lisenssiavaimet johonkin taulukkoon ja välittänyt sen malliin mukavan tulosteen saamiseksi. Yllä olevassa koodissa välitän myös tilaustunnuksen, jotta se on käytettävissä $order_idmallin sisällä (esim. mukavan otsikon tulostamiseen "Tilauksen #204 lisenssiavaimet").