AnchorLabs su WordPress: integrazione completa con tema, plugin di caching e page builder

WordPress è ancora il CMS dominante nell'editoria italiana. L'integrazione di AnchorLabs qui deve essere semplice, ripetibile e soprattutto coerente con il prodotto reale: un solo snippet, il file index.iife.js, configurazione tramite attributi data-pt-*, nessun window.AnchorLabsConfig, nessun doppio blocco script.

Questa guida copre l'installazione standard su WordPress, i selettori corretti per i temi più usati, la compatibilità con i plugin di caching e i casi tipici di Gutenberg, Elementor e altri page builder.

Prerequisiti

Prima di iniziare ti servono:

• Accesso admin a WordPress
• Un punto in cui inserire lo snippet: plugin di header/footer injection, child theme o GTM
• Il tuo tag Amazon Associates
• Il selettore del corpo articolo, se vuoi limitare la scansione a una zona precisa invece del fallback su body

Step 1: le tre vie per inserire lo snippet

Via 1: plugin di header/footer injection

È la strada più rapida. Plugin consigliati:

• WPCode
• Header Footer Code Manager
• Insert Headers and Footers by WPBeginner

Una volta installato il plugin, aggiungi nel footer questo snippet:

<script
  async
  src="https://anchor.widgetbay.3labs.it/index.iife.js"
  data-pt-auto-init="true"
  data-pt-selectors=".entry-content"
  data-pt-amazon-tag="tuotag-21"
  data-pt-max-total-matches="24"
  data-pt-max-matches-per-keyword="1"
  data-pt-max-matches-per-paragraph="2"
></script>

Su WordPress conviene quasi sempre impostare data-pt-selectors, perché body includerebbe anche menu, sidebar, related posts e moduli che non vuoi scansionare.

Via 2: child theme e wp_footer

Se lavori già con un child theme, inserisci lo script in functions.php:

<?php
add_action('wp_footer', function () {
  ?>
  <script
    async
    src="https://anchor.widgetbay.3labs.it/index.iife.js"
    data-pt-auto-init="true"
    data-pt-selectors=".entry-content"
    data-pt-amazon-tag="<?php echo esc_attr('tuotag-21'); ?>"
    data-pt-max-total-matches="24"
    data-pt-max-matches-per-keyword="1"
    data-pt-max-matches-per-paragraph="2"
  ></script>
  <?php
});

Questa via è pulita e non dipende da plugin aggiuntivi, ma richiede un minimo di disciplina sul tema.

Via 3: Google Tag Manager

Se il sito usa già GTM, puoi inserire lo stesso snippet in un tag Custom HTML e attivarlo sulle pagine articolo. Anche qui resta valido lo stesso formato: un solo script con attributi data-pt-*.

Step 2: il selettore giusto per il tuo tema

In WordPress il punto critico è quasi sempre data-pt-selectors. Se sbagli il wrapper articolo, il runtime parte ma non trova il contenuto giusto.

Ecco i selettori più comuni:

Tema	Selettore consigliato
WordPress core / classic themes	.entry-content
Twenty Twenty-Four / block theme	.wp-block-post-content
GeneratePress	.entry-content
Astra	.entry-content
Newspaper di tagDiv	.td-post-content,.tdb-block-inner
Jannah	.entry-content
Soledad	.entry,.post-entry
Bimber	.post-content
Hueman Pro	.entry-content

Se hai template diversi per diversi articoli, puoi usare più selettori nella stessa stringa CSV:

data-pt-selectors=".entry-content,.post-body,.longform-article"

Se usi un tema custom, apri un articolo, ispeziona il DOM e cerca il contenitore reale del corpo testo. Il selettore deve puntare a quel wrapper, non a body.

Step 3: verifica che i tooltip compaiano

Dopo aver salvato lo snippet e svuotato la cache, apri un articolo del tuo sito e fai questi controlli:

1. index.iife.js deve caricare con status 200
2. nel DOM devono comparire gli elementi decorati dal runtime
3. all'hover o al tap deve apparire un tooltip floating
4. il click deve aprire il link previsto

Se non succede nulla, la causa più comune è il selettore. Prova a verificare in console:

document.querySelectorAll(".entry-content")

Se non ottieni nodi, il wrapper è sbagliato.

Step 4: compatibilità con i plugin di caching

I plugin di caching non rompono AnchorLabs in sé: lo rompono quando riscrivono troppo il caricamento dello script.

WP Rocket

In Settings → WP Rocket → File Optimization:

• escludi anchor.widgetbay.3labs.it/index.iife.js da minify e combine
• escludilo da Delay JavaScript execution
• non trattarlo come script critico da riscrivere

W3 Total Cache

In Performance → Minify → JS aggiungi l'URL dello script alla lista delle esclusioni.

LiteSpeed Cache

In Page Optimization → JS Settings escludi anchor.widgetbay.3labs.it da combine, delay e minify.

Autoptimize

Mantieni pure l'aggregazione generale, ma aggiungi index.iife.js alle esclusioni.

Cloudflare Rocket Loader

Se Rocket Loader è attivo, può alterare il comportamento previsto dello script. Disattivalo per le pagine articolo o aggiungi data-cfasync="false" se il tuo setup lo richiede.

Step 5: compatibilità con Gutenberg e page builder

Gutenberg

Funziona bene con:

• .entry-content
• .wp-block-post-content

La scelta dipende dal tema.

Elementor

Il wrapper tipico del corpo articolo è spesso:

• .elementor-widget-theme-post-content
• .elementor-widget-container

In questi casi puoi usare:

data-pt-selectors=".entry-content,.elementor-widget-theme-post-content"

Se il body articolo è lazy-loaded, verifica che il contenuto sia già nel DOM quando la pagina completa il caricamento. Se non lo è, disattiva il lazy load sul widget del corpo articolo.

WPBakery

Spesso il contenuto è in .wpb_wrapper dentro .wpb_text_column. Un selettore tipico è:

data-pt-selectors=".entry-content .wpb_wrapper"

Divi

Nelle pagine builder il wrapper frequente è .et_pb_post_content.

Perché AnchorLabs ha senso su WordPress

I plugin affiliate classici per WordPress funzionano quasi tutti con shortcode o blocchi inseriti a mano. Quel modello va bene quando vuoi box prodotto curati in pochi articoli. Non va bene quando hai migliaia di contenuti già pubblicati e vuoi monetizzare il testo esistente senza tornare indietro articolo per articolo.

AnchorLabs lavora proprio in quel punto: carica uno snippet, scansiona il corpo articolo e inserisce tooltip contestuali senza riscrivere il markup persistente del post. È il motivo per cui il setup corretto su WordPress deve restare semplice: uno snippet, un selettore, tre limiti di densità.

Verifica Core Web Vitals post-integrazione

Dopo il deploy, misura LCP, CLS e INP su un articolo rappresentativo.

1. confronta la pagina prima e dopo
2. controlla in DevTools che index.iife.js non introduca long task rilevanti
3. verifica che i tooltip non provochino layout shift

Per approfondire il tema performance, vedi Affiliate link e Core Web Vitals.

Troubleshooting tipico su WordPress

Problema 1: non compare nulla La causa più comune è il selettore sbagliato. Controlla prima data-pt-selectors.

Problema 2: dopo l'aggiornamento del plugin di cache lo script sparisce Qualche ottimizzazione si è riattivata. Rimetti index.iife.js tra le esclusioni.

Problema 3: il tooltip compare ma il click non si apre bene Controlla che plugin di ottimizzazione o sicurezza non stiano alterando i link o il JS del tooltip.

Problema 4: errore CSP in console Aggiungi https://anchor.widgetbay.3labs.it a script-src e connect-src.

Problema 5: il caricamento viene ritardato di alcuni secondi Il sito sta applicando delay loading aggressivo anche ad AnchorLabs. Toglilo dalla lista degli script ritardati.

Da dove iniziare oggi

Su WordPress la via più pratica è:

1. installa WPCode
2. incolla lo snippet con data-pt-selectors=".entry-content"
3. imposta data-pt-amazon-tag
4. aggiungi i tre limiti di densità
5. svuota cache e verifica un articolo

Se poi vuoi il quadro completo della revenue per articolo, il passo successivo è Come tracciare la revenue per articolo.