Inizia

Collega ideal.shop a Clerk.io tramite la sua integrazione integrata, poi configura Search e Recommendations per il tuo tema. L’integrazione installa Clerk.js e il tracciamento delle vendite quando il tracciamento è abilitato.

Abilita integrazione #

Collega lo Store Clerk.io corrispondente prima di configurare gli Elements sul tuo storefront.

1. In ideal.shop, vai su Indstillinger > Integrationer e apri Clerk.io.
2. In my.clerk.io, apri il tuo Store e vai su Developers > API Keys.
3. Copia la public API key in Public API key in ideal.shop.
4. Copia la legacy private API key in Private API key.
5. Abilita Aktivér tracking e Feed offentligt.
6. Fai clic su Gem.

Controlla la presenza di codice Clerk.js e di tracciamento delle vendite prima di aggiungere qualsiasi cosa manualmente. Abilitare l’integrazione nativa insieme a un’installazione separata può causare richieste o eventi di vendita duplicati.

Configura prodotti #

Importa prima i dati in modo che i tuoi Designs, filtri e il contesto delle pagine usino dati reali dal webshop.

1. Segui Sync Data per l’importazione storica, i limiti di feed in corso e i controlli sui dati.
2. Configura Recommendations con page ID verificati e posizionamenti mirati.
3. Configura Search per gli input desktop e mobile.
4. Tieni gli Elements in In preview durante i test.

I selettori, gli ID dei moduli, i layout e le funzioni JavaScript native variano tra i temi. Gli esempi di Fodmagasinet in queste guide mostrano come investigare un tema; verifica ogni valore sul tuo webshop.

Navigazione dinamica #

Alcuni temi sostituiscono il contenuto della pagina senza un ricaricamento completo. Clerk.io deve rilevare il contenuto sostituito e utilizzare i suoi ID correnti.

In my.clerk.io, controlla Settings > Features > SPA Auto Detect Changes. Questo permette a Clerk.js di rilevare i contenuti caricati dinamicamente. Esegui dei test di navigazione dopo aver abilitato questa funzione: la sola abilitazione non garantisce che ogni aggiornamento del tema funzioni.

Verifica la navigazione tra prodotti, la paginazione delle categorie, gli aggiornamenti del carrello e Avanti/Indietro. Se le Recommendations spariscono o usano l’ID della pagina precedente, segui la navigation FAQ.

Verifica configurazione #

Utilizza questa checklist prima di passare gli Elements da Preview a Live. Segui le migliori pratiche generali per Recommendations e Search nella scelta delle esperienze.

• Apri le pagine desiderate con ?clerk_content_mode=preview (o &clerk_content_mode=preview se è già presente una query). Verifica nuovamente la modalità dopo la paginazione o la navigazione nativa.
• Controlla i layout desktop e mobile: larghezza nativa della pagina, card leggibili, prezzi chiari, immagini nitide, frecce dello slider funzionanti e nessuna barra di scorrimento orizzontale.
• Visita due prodotti diversi, categorie e articoli. Conferma che ogni Element invii il current imported ID.
• Aggiungi, rimuovi e modifica le quantità del carrello in un carrello di test concordato. Conferma che le Recommendations utilizzino gli attuali product ID e gestiscano un carrello vuoto.
• Testa l’acquisto di prodotti semplici, la scelta delle varianti obbligatorie, prodotti non disponibili e i messaggi di errore. Ripristina il carrello di test in seguito.
• Apri, digita, chiudi e riapri Search. Prova Escape, selezione tramite tasti freccia, Enter e i controlli da mobile. La chiusura di Search deve preservare la pagina sottostante e la posizione di scorrimento.
• Ripeti la navigazione e Avanti/Indietro dopo aver utilizzato Search. Controlla la presenza di Elements mancanti, risultati non aggiornati, posizionamenti doppi o richieste duplicate dallo stesso Element.
• Conferma che Clerk.js venga caricato tramite l’integrazione nativa e che solo una installazione inizializzi lo Store. Ispeziona le richieste Network del browser e gli errori della console.
• Verifica il tracciamento delle vendite su un ordine di test concordato o un ordine completato esistente con prova di tracking. Controlla l’order ID, i product ID, le quantità, i prezzi e un singolo evento di vendita. Un data sync riuscito da solo non verifica il tracciamento frontend.
• Apri esplicitamente ?clerk_content_mode=live per uscire da Preview. La sola rimozione del parametro Preview potrebbe mantenere attivo Preview. Conferma l’esperienza Live desiderata.

Tieni le correzioni temporanee fuori dall’installazione standard. Consulta la FAQ per casi limite su feed, temi e navigazione.