Come creare una scheda personalizzata nella pagina prodotto del back office in PrestaShop

PrestaShop, con il suo framework potente e flessibile, consente agli sviluppatori di personalizzare vari aspetti della piattaforma per soddisfare requisiti aziendali specifici. Una di queste personalizzazioni è l’aggiunta di una scheda personalizzata nella pagina del prodotto del back office. In questo blog, illustreremo passo dopo passo il processo per ottenere questo risultato creando un modulo di esempio chiamato kbcustommodule.

Possiamo creare la scheda personalizzata nella pagina del prodotto nel back office in due modi:

  1. Utilizzo dei componenti Symfony.
  2. Utilizzo di displayAdminProductsExtra Hook

Metodo 1:

Questo tutorial è valido per PrestaShop versione 8.1 e successive, utilizzando i componenti Symfony.

Passaggio 1: crea il tuo modulo

kbcustommodule/ |– composer.json |– config/ | |– services.yml |– src/ | |– Form/ | | |– Modifier/ | | | |– ProductFormModifier.php | | |– Type/ | | | |– CustomTabType.php |– kbcustommodule.php Inizia creando una cartella denominata kbcustommodule nella directory modules della tua installazione PrestaShop. All’interno di questa cartella, crea il file kbcustommodule.php, che conterrà la classe principale per il tuo modulo. La classe del modulo inizializza il modulo e registra gli hook richiesti. Ecco un esempio del file kdcustommodule.php:

Esegui il comando composer dump-autoload nella directory principale del tuo modulo per abilitare il caricamento automatico dello spazio dei nomi.

Passaggio 2: definire i servizi

Crea un file services.yml nella directory config del tuo modulo (kbcustommodule/config/services.yml). Questo file definisce i servizi Symfony richiesti per la personalizzazione del form.

Passaggio 3: creare il tipo di modulo della scheda personalizzata

Crea una classe CustomTabType nella cartella src/Form/Type del tuo modulo. Questa classe definisce i campi che appariranno nella scheda personalizzata.

Passaggio 4: creare la classe ProductFormModifier

La classe ProductFormModifier definisce il modo in cui la scheda personalizzata si integra con il modulo del prodotto esistente.

Fase finale: installazione e test

  1. Installare il modulo tramite il back office oppure posizionarlo manualmente nella directory dei moduli e abilitarlo.
  2. Vai alla pagina del prodotto back office. Dovresti vedere una nuova scheda etichettata “Scheda personalizzata” con un campo etichettato “Campo personalizzato”.
  3. Testare la funzionalità aggiungendo dati al campo personalizzato e accertandosi che venga salvato correttamente.

Dopo aver installato con successo il modulo sopra. Otterrai il risultato seguente.

Integra Google Tag Manager con Prestashop

ACQUISTA ORA

Metodo 2:

Il gancio displayAdminProductsExtra consente di aggiungere contenuti o schede personalizzate alla pagina di modifica del prodotto nel Back Office. Questo metodo evita la complessità di definire i servizi Symfony ed è più semplice per gli sviluppatori che non hanno familiarità con Symfony.

Passaggio 1: creare il modulo

Inizia creando una struttura di modulo di base. Ad esempio: Kbcustommodule/ |– config/ |– translations/ |– views/ | |– templates/ | |– admin/ | |– products/ | |– custom_tab.tpl |– Kbcustommodule.php

Passaggio 2: definire la classe del modulo

Nel file Kbcustommodule.php, definisci il tuo modulo e registra il collegamento displayAdminProductsExtra.

 

Passaggio 3: creare il file modello

Nel file views/templates/admin/products/custom_tab.tpl, definisci l’HTML e il contenuto per la tua scheda personalizzata.

Passaggio 4: Salvare i dati

Per salvare i dati personalizzati, usa l’hook actionAdminControllerSetMedia insieme a JavaScript o PHP. In alternativa, puoi usare l’hook actionProductUpdate in PHP. Esempio in Kbcustommodule.php:

Passaggio 5: aggiungere il campo al database

Modifica il database per memorizzare i tuoi dati personalizzati. Ad esempio: ———————————————————————— ALTER TABLE ps_product ADD custom_field TEXT NULL; ———————————————————————— Dopo aver installato correttamente il modulo sopra. Otterrai il risultato seguente Per ulteriore assistenza, non esitare a contattarci o lasciare un commento qui sotto. Oppure puoi anche contattarci su Helpdesk di Knowband.