# Iniettore di codice Header/Footer (CSS/JS) — Guida completa

> Panoramica L'Iniettore di codice Header/Footer permette di aggiungere codice CSS, JavaScript o HTML al tuo negozio PrestaShop senza modificare alcun file del tema. Tutto si gestisce dal back-office sotto forma…

- Pagina: <https://www.datafirefly.com/it/documentation/dfcodeinjector/>
- Lingua: it
- Aggiornato il: 2026-06-27
- Altre lingue: [fr](https://www.datafirefly.com/documentation/dfcodeinjector/index.md), [en](https://www.datafirefly.com/en/documentation/dfcodeinjector/index.md), [es](https://www.datafirefly.com/es/documentation/dfcodeinjector/index.md), [de](https://www.datafirefly.com/de/documentation/dfcodeinjector/index.md), [pl](https://www.datafirefly.com/pl/documentation/dfcodeinjector/index.md), [pt](https://www.datafirefly.com/pt/documentation/dfcodeinjector/index.md), [nl](https://www.datafirefly.com/nl/documentation/dfcodeinjector/index.md)
- Indice: <https://www.datafirefly.com/it/documentation/llms.txt>

## Panoramica

L'**Iniettore di codice Header/Footer** permette di aggiungere codice CSS, JavaScript o HTML al tuo negozio PrestaShop senza modificare alcun file del tema. Tutto si gestisce dal back-office sotto forma di _snippet_: ogni blocco di codice ha la sua posizione, il suo targeting di pagine, il suo ordine di iniezione e il suo stato attivo o inattivo.

Casi d'uso tipici: Google Tag Manager, Google Analytics, Meta Pixel, tag di verifica (Search Console, Pinterest...), stili CSS personalizzati, script di chat o banner di consenso ai cookie.

## Installazione

1. Scarica l'archivio `dfcodeinjector.zip` dal tuo account DataFirefly.
2. Nel back-office, apri **Moduli > Gestore moduli**, fai clic su **Carica un modulo** e rilascia l'archivio.
3. Fai clic su **Configura** per aprire il gestore di snippet.

Compatibile con PrestaShop 8.0 a 9.x, PHP 8.1 e superiore, multinegozio. Nessuna dipendenza esterna.

## Creare uno snippet

Dal gestore, fai clic su **Aggiungi uno snippet** e compila i campi seguenti.

### Campi del modulo

- **Nome** — identificatore interno dello snippet (es. «Google Tag Manager»).
- **Posizione** — dove viene iniettato il codice (vedi sotto).
- **Codice** — incolla il tuo codice completo, tag inclusi. Viene iniettato così com'è, senza trasformazione né purificazione.
- **Pagine mirate** — lascia vuoto per tutte le pagine, o seleziona pagine specifiche.
- **Ordine di visualizzazione** — gli snippet di una stessa posizione vengono iniettati in ordine crescente.
- **Attivo** — attiva o disattiva lo snippet senza eliminarlo.

### Le tre posizioni

- **Header (tag head)** — per stili, tag meta e tag di verifica. Iniettato tramite l'hook `displayHeader`.
- **Inizio del body** — subito dopo l'apertura del body, per i contenitori di markup (es. la parte noscript di GTM). Hook `displayAfterBodyOpeningTag`.
- **Fine del body** — subito prima della chiusura del body, per gli script di performance e tracciamento. Hook `displayBeforeBodyClosingTag`.

### Targeting per pagina

Ogni snippet può essere mostrato ovunque (campo vuoto) o limitato a determinate pagine: home, scheda prodotto, categoria, CMS, ricerca, carrello, processo d'ordine, ecc. Il modulo confronta la pagina corrente con il controller front (`php_self`); se è impostato un elenco e la pagina non vi compare, lo snippet non viene iniettato.

## Esempi

### Google Tag Manager

GTM si installa in due parti. Crea due snippet:

1. Snippet «GTM head» — posizione **Header**, incolla il primo script fornito da Google:

```
<!-- Google Tag Manager -->
<script>(function(w,d,s,l,i){ ... })(window,document,'script','dataLayer','GTM-XXXXXX');</script>
<!-- End Google Tag Manager -->
```

1. Snippet «GTM body» — posizione **Inizio del body**, incolla la parte noscript fornita da Google.

### CSS personalizzato

Posizione **Header**, racchiudi il tuo CSS in un tag style:

```
<style>
.header-banner { background:#0f172a; color:#fff; }
</style>
```

### Tag di verifica

Per Search Console o un social network, posizione **Header**:

```
<meta name="google-site-verification" content="IL_TUO_CODICE" />
```

## Multinegozio

In contesto multinegozio, ogni snippet può essere globale (tutti i negozi) o riservato a un negozio specifico tramite il campo **Negozio**. In modalità mononegozio, questo campo è nascosto e lo snippet si applica al negozio corrente.

## Compatibilità dei temi

L'iniezione nel **tag head** funziona con tutti i temi. Le posizioni **inizio** e **fine del body** si basano sugli hook `displayAfterBodyOpeningTag` e `displayBeforeBodyClosingTag`, presenti nel tema Classic di PrestaShop. Su un tema personalizzato, verifica che questi hook vengano richiamati nei template.

## Risoluzione dei problemi

- **Il codice non appare** — verifica che lo snippet sia attivo, che la posizione sia corretta e che la pagina corrente faccia parte delle pagine mirate (o che il campo sia vuoto).
- **Niente a inizio o fine body** — il tuo tema probabilmente non richiama gli hook corrispondenti; usa la posizione Header o aggiungi questi hook al tema.
- **Conflitto di ordine** — regola il campo Ordine di visualizzazione per controllare la sequenza di iniezione.

Poiché il codice viene iniettato senza purificazione, controlla la tua sintassi (tag chiusi correttamente) prima di attivare uno snippet su un negozio in produzione.