Aggiungere la tabella dei valori nutrizionali sui prodotti

La funzionalità di aggiunta della tabella dei valori nutrizionali ai prodotti del tuo ecommerce è una soluzione indispensabile per fornire informazioni dettagliate e trasparenti ai tuoi clienti. Oltre a migliorare la chiarezza e l’usabilità del tuo sito, questa funzionalità consente di soddisfare le normative in materia di etichettatura alimentare e di aumentare la fiducia nei tuoi prodotti. Seguendo questa guida dettagliata, potrai configurare con precisione i valori nutrizionali dei tuoi prodotti, garantendo un’esperienza utente professionale e accattivante.

Per iniziare, è necessario creare i campi personalizzati che ospiteranno i dati relativi ai valori nutrizionali. Ti indirizziamo a questa guida per creare nuovi campi personalizzati.

I campi da creare dovranno essere di tipo testuale con nomi simili a questi.

Valori energetici

Grassi

Carboidrati

Proteine

Sale

Fibre

Dovrai tenere ben in mente l'identificativo di ciascuna voce creata, perché ti servirà successivamente.

Compilazione dei Campi Personalizzati

Una volta creati i campi, vai alla sezione Prodotti nel pannello di controllo.

Scegli un prodotto da modificare e scorri verso il basso fino alla card Campi Aggiuntivi. Qui troverai i campi che hai creato e potrai compilarli con i dati relativi al prodotto specifico.

Creazione di un Template Personalizzato

Nella stessa pagina di modifica del prodotto, sulla sinistra, trova la card Template.

Clicca su Aggiungi Nuovo Modello e assegna un nome identificativo al template, ad esempio: Template con valori nutrizionali.

Dopo aver creato il template, si aprirà automaticamente un editor per la configurazione del modello.

Aggiunta della Tabella

Nell’editor, sulla sinistra, troverai Dettagli Prodotto e più in basso Blocco Specifiche > Riga Comprimibile.

Premi il pulsante Aggiungi per creare un nuovo campo.

Inserisci le seguenti informazioni:

Campo di testo: scrivi Valori nutrizionali.

Area di testo: clicca sull’icona <> per accedere all’editor HTML.

Inserisci il seguente codice HTML all’interno del campo. Ricorda di personalizzare i campi per far corrispondere gli identificativi ai nomi dei campi che hai creato.

<table class="table table-striped table-hover">

  <tbody>

    <tr>

      <th>VALORI MEDI</th>

      <th>PER 100 G</th>

    </tr>

  </tbody>

  <tbody>

    <tr>

      <td>Valore energetico</td>

      <td>%products.energia%</td>

    </tr>

    <tr>

      <td>Grassi totali</td>

      <td>%products.grassi%</td>

    </tr>

    <tr>

      <td>Carboidrati</td>

      <td>%products.carboidrati%</td>

    </tr>

    <tr>

      <td>Proteine</td>

      <td>%products.proteine%</td>

    </tr>

    <tr>

      <td>Sale</td>

      <td>%products.sale%</td>

    </tr>

    <tr>

      <td>Fibre</td>

      <td>%products.fibre%</td>

    </tr>

  </tbody>

</table>

Se non hai creato un campo (es. Sale), elimina la relativa riga dal codice.

Verifica che gli identificativi nei campi (%products.nomeCampo%) corrispondano esattamente ai nomi definiti nei campi personalizzati.

Dopo aver inserito il codice HTML:

Più in basso troverai un quadrato con un'icona, clicca su di essa per sostituirla con un’icona più appropriata che rappresenti i valori nutrizionali.

Premi Salva in alto a destra per confermare le modifiche al template.

D’ora in avanti, per tutti i prodotti che richiedono l’aggiunta dei valori nutrizionali, sarà sufficiente:

• Modificare il prodotto.
• Assegnare il template che hai appena creato.

Con questa guida, sarai in grado di configurare e personalizzare una tabella professionale per i valori nutrizionali dei tuoi prodotti, migliorando l’esperienza dei clienti e la gestione delle informazioni all’interno del tuo ecommerce.