...
✅ WEB- ja WordPress -uutiset, -teemat, -laajennukset. Täällä jaamme vinkkejä ja parhaita verkkosivustoratkaisuja.

Aiheeseen liittyvien tuotteiden näyttäminen WooCommerce REST -sovellusliittymän avulla

43

Verkkokaupoissa on ilmeistä näyttää aiheeseen liittyvät tuotteet yhdellä tuotetietosivulla. Se auttaa asiakkaitasi näyttämään samanlaisia ​​tuotteita, joita he ehkä haluavat ostaa. Se lisää myös käyttäjien sitoutumista verkkosivustollesi. Kun enemmän aikaa asiakkaat viettävät kaupassasi, on enemmän mahdollisuuksia ostaa tuotteita. Tässä artikkelissa näytän, kuinka aiheeseen liittyviä tuotteita voidaan näyttää WooCommerce REST -sovellusliittymän avulla.

Tässä opetusohjelmassa haen kaikki nykyiseen tuotteeseen liittyvät tuotteet ja näytän sen sitten. Linkitän myös jokaisen tuotteen sen tietosivulle.

Tässä artikkelissa selitetty esimerkki voi koskea myös WooCommerce-verkkosivustoa. Voidaan käyttää tätä tekniikkaa ja näyttää niihin liittyviä tuotteita ilman laajennuksia. Se antaa sinulle paremman hallinnan tuotesivusi suunnittelusta ja merkinnöistä.

Hanki kuluttaja-avain ja kuluttajasalaisuus

Kun päätät aloittaa WooCommerce REST -sovellusliittymällä, sinun on ensin hankittava kuluttaja-avain ja kuluttajasalaisuus. Nämä avaimet ovat myymälän tunniste ja välttämättömiä, kun he soittavat WooCommerce API: lle. Voit lukea siitä lisää heidän dokumentaatiostaan.

Asenna ensin WooCommerce-laajennus verkkosivustollesi. Siirry sitten WooCommerce-> Asetukset- sivulle. Napsauta Lisäasetukset-välilehteä ja sitten REST API -linkkiä.

Aiheeseen liittyvien tuotteiden näyttäminen WooCommerce REST -sovellusliittymän avulla

Napsauta tällä sivulla painiketta "Luo API-avain".

Aiheeseen liittyvien tuotteiden näyttäminen WooCommerce REST -sovellusliittymän avulla

Kirjoita kuvaus, valitse Luku-oikeus ja paina Luo API-avain -painiketta. Voit valita myös luku- / kirjoitusoikeuden. Se riippuu vaatimuksestasi. Jos sinun tarvitsee vain lukea tietoja WooCommercestä, valitse ‘Lue’ -vaihtoehto. Ja jos haluat tehdä sekä luku- että kirjoitusoperaatioita, ilmeinen vaihtoehto on ‘Lue / kirjoita’. Tässä kohdennamme vain vastaaviin tuotteisiin, joten lukuoikeus riittää.

Aiheeseen liittyvien tuotteiden näyttäminen WooCommerce REST -sovellusliittymän avulla

Kopioi kuluttaja-avain ja kuluttajasalaisuus, joita vaaditaan API-puheluita annettaessa.

Aiheeseen liittyvien tuotteiden näyttäminen WooCommerce REST -sovellusliittymän avulla

WooCommerce REST -sovellusliittymä aiheeseen liittyvien tuotteiden saamiseksi

Kun olet valmis kuluttaja-avaimesi ja kuluttajasalaisuutesi kanssa, voimme aloittaa koodilla, joka antaa API-kutsun WooCommerce-päätepisteelle. Koska meidän on ensin haettava aiheeseen liittyviä tuotteita, meidän on hankittava yhden tuotteen tiedot API: n kautta. Tämä johtuu siitä, että näytämme normaalisti samanlaisia ​​tuotteitamme yhdellä tuotesivulla.

Koska meidän on lähetettävä HTTP-pyyntöjä, asenna Guzzle-kirjasto alla olevan komennon avulla.

composer require guzzlehttp/guzzle

Guzzle on PHP HTTP -asiakas, joka helpottaa HTTP-pyyntöjen lähettämistä ja on triviaali integroida verkkopalveluihin.

Lopuksi kirjoitetaan koodi saadaksesi yhden tuotteen ja sitten siihen liittyvät tuotteet. Kun WooCommerce palauttaa tuotteen tiedot, se sisältää vastauksena myös ‘related_ids’ -avaimen arvojen kanssa. Nämä arvot ovat vain vastaavien tuotteiden tunnuksia. Joten tässä yhteydessä PHP-koodimme on seuraava.

<?php
require_once "vendor/autoload.php";
  
use GuzzleHttpClient;
 
define('WC_CONSUMER_KEY', 'PASTE_CONSUMER_KEY_HERE');
define('WC_CONSUMER_SECRET', 'PASTE_CONSUMER_SECRET_HERE');
  
$client = new Client([
    // Base URI is used with relative requests
    'base_uri' => 'YOUR_DOMAIN_BASE_URL',
]);
 
try {
    $response = $client->request('GET', '/wp-json/wc/v3/products/PRODUCT_ID_HERE', [
        'headers' => [
            "Authorization" => "Basic ". base64_encode(WC_CONSUMER_KEY.':'.WC_CONSUMER_SECRET)
        ],
        'verify' => false, //only needed if you are facing SSL certificate issue
    ]);
     
    $body = $response->getBody();
    $arr_body = json_decode($body);
 
    $response = $client->request('GET', '/wp-json/wc/v3/products', [
        'headers' => [
            "Authorization" => "Basic ". base64_encode(WC_CONSUMER_KEY.':'.WC_CONSUMER_SECRET)
        ],
        'query' => [
            'include' => $arr_body->related_ids,
        ],
        'verify' => false,
    ]);
     
    $body = $response->getBody();
    $arr_products = json_decode($body);
 
    if (!empty($arr_products)) {
        foreach ($arr_products as $product) {
            ?>
            <p>
                <a href="<?php echo $product->permalink; ?>"><?php echo $product->name; ?></a>
            </p>
            <?php
        }
    }
} catch (Exception $e) {
    echo $e->getMessage();
}

Korvaa paikkamerkki ‘PRODUCT_ID_HERE’ todellisella arvolla. Yllä olevassa koodissa välitän ‘include’ -parametrin matriisina related_ids-tunnuksilla. Sitten WooCommerce antaa meille vastauksena kaikki yksityiskohdat tuotteista. Sitten käymme sen läpi ja näytämme tuotteen nimen ja linkin. Käyttäjä voi myös tulostaa muut tiedot vastauksesta.

Aiheeseen liittyvät artikkelit

Tämä verkkosivusto käyttää evästeitä parantaakseen käyttökokemustasi. Oletamme, että olet kunnossa, mutta voit halutessasi kieltäytyä. Hyväksyä Lisätietoja