Come visualizzare prodotti correlati utilizzando l’API REST di WooCommerceCommerce

Quando si tratta di negozi online, è ovvio mostrare i prodotti correlati nella pagina dei dettagli del singolo prodotto. Aiuta i tuoi clienti a mostrare prodotti simili che forse desiderano acquistare. Aumenta anche il coinvolgimento degli utenti sul tuo sito web. Man mano che i clienti trascorrono più tempo nel tuo negozio, aumentano le possibilità che acquistino i tuoi prodotti. In questo articolo, ti mostro come mostrare i prodotti correlati utilizzando l’API REST di WooCommerce.

In questo tutorial, recupererò tutti i prodotti relativi al prodotto corrente e poi lo visualizzerò. Inoltre collego ogni prodotto alla sua pagina di dettaglio.

L’esempio spiegato in questo articolo può essere applicato anche al sito Web WooCommerce. Si può utilizzare questa tecnica e visualizzare i prodotti correlati senza utilizzare alcun plug-in. Ti darà un maggiore controllo sul design e sul markup per la tua pagina prodotto.

Ottieni la tua chiave del consumatore e il segreto del consumatore

Quando decidi di iniziare con l’API REST di WooCommerce, devi prima ottenere la chiave del consumatore e il segreto del consumatore. Queste chiavi sono l’identificazione per il negozio e sono necessarie durante la chiamata all’API WooCommerce. Puoi leggere di più a riguardo sulla loro documentazione.

Innanzitutto, installa il plug-in WooCommerce sul tuo sito web. Quindi vai alla pagina WooCommerce->Impostazioni. Fare clic sulla scheda Avanzate e quindi sul collegamento API REST.

In questa pagina fai clic sul pulsante "Crea una chiave API".

Inserisci la descrizione, scegli l’autorizzazione "Leggi" e premi il pulsante Genera chiave API. Puoi anche scegliere il permesso ‘Lettura/Scrittura’. Dipende dalla tua esigenza. Se hai solo bisogno di leggere i dati da WooCommerce, scegli l’opzione "Leggi". E se vuoi eseguire sia operazioni di lettura che di scrittura, l’opzione più ovvia è "Leggi/Scrivi". Qui ci rivolgiamo solo a prodotti correlati, quindi l’autorizzazione "Lettura" è sufficiente.

Copia la chiave del consumatore e il segreto del consumatore che saranno richiesti durante le chiamate API.

API REST di WooCommerce per ottenere prodotti correlati

Una volta che sei pronto con la chiave del consumatore e il segreto del consumatore, possiamo iniziare con il codice che fornisce una chiamata API all’endpoint WooCommerce. Poiché dobbiamo prima recuperare i prodotti correlati, dobbiamo ottenere i dati di un singolo prodotto tramite l’API. Questo perché normalmente mostriamo i nostri prodotti simili nella pagina del singolo prodotto.

Poiché abbiamo bisogno di inviare richieste HTTP, installa la libreria Guzzle usando il comando seguente.

composer require guzzlehttp/guzzle

Guzzle è un client HTTP PHP che semplifica l’invio di richieste HTTP e banale l’integrazione con i servizi web.

Infine, scriviamo un codice per ottenere un singolo prodotto e quindi i relativi prodotti. Quando WooCommerce restituisce i dati del prodotto, in risposta contiene anche la chiave "related_ids" insieme ai valori. Questi valori non sono altro che ID prodotti correlati. Quindi, nel contesto di questo, il nostro codice PHP sarà il seguente.

<?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();
}

Sostituisci il segnaposto ‘PRODUCT_ID_HERE’ con il valore effettivo. Nel codice sopra, sto passando il parametro ‘includes’ come un array con related_ids. WooCommerce quindi in risposta ci fornisce tutti i dettagli sui prodotti. Quindi lo esaminiamo e visualizziamo il titolo del prodotto e il suo collegamento. L’utente può anche stampare gli altri dati della risposta.

articoli Correlati

• Una guida rapida sull’API REST di WooCommerce
• Come personalizzare la ricerca di prodotti WooCommerce sul tuo sito WordPress