Come incorporare un flipbook nel tuo negozio Shopify

Le immagini statiche dei prodotti raccontano solo una parte della storia. Se gestisci un negozio Shopify e vuoi mostrare cataloghi prodotti, lookbook, guide alle taglie o riviste del brand in un formato più coinvolgente, incorporare un flipbook interattivo è uno dei modi più efficaci per farlo. I visitatori possono sfogliare le pagine proprio come un vero libro — direttamente nel tuo negozio, senza lasciare la pagina.

Questa guida ti accompagna nell'incorporamento di un flipbook FlipLink in Shopify, dalla generazione del codice di incorporamento al posizionamento nelle pagine prodotto e nelle landing page personalizzate.

Perché usare i flipbook su Shopify

Shopify ti offre strumenti potenti per vendere prodotti, ma le sue opzioni native per i contenuti sono limitate quando si tratta di contenuti visivi multipagina. Ecco dove i flipbook colmano il vuoto:

• Cataloghi prodotti — Permetti ai clienti di sfogliare il tuo catalogo completo con animazioni di sfogliamento invece di scorrere griglie statiche
• Lookbook — Brand di moda, arredamento e lifestyle possono presentare le collezioni stagionali come lookbook digitali immersivi
• Guide alle taglie — Sostituisci i download PDF scomodi con una guida alle taglie interattiva e incorporata che i clienti possono sfogliare nella pagina prodotto
• Riviste del brand — Condividi storie del brand, contenuti dietro le quinte o articoli editoriali direttamente nel tuo negozio
• Listini prezzi all'ingrosso — Offri ai buyer B2B un modo elegante per consultare i prezzi senza un portale separato

I flipbook mantengono i visitatori coinvolti più a lungo, riducono il bounce rate e presentano i tuoi prodotti in un formato che trasmette qualità premium.

Passo 1: Crea il tuo flipbook

Prima di poter incorporare qualsiasi cosa, hai bisogno di un flipbook. Se non ne hai ancora creato uno:

1. Registrati su go.fliplink.me
2. Carica il tuo PDF — un catalogo prodotti, lookbook o qualsiasi documento multipagina
3. FlipLink lo converte automaticamente in un flipbook interattivo con animazioni realistiche di sfogliamento 3D
4. Personalizza l'aspetto, aggiungi pulsanti CTA che rimandano ai tuoi prodotti Shopify e configura le impostazioni di condivisione

Una volta pubblicato il tuo flipbook, sei pronto a copiare il codice di incorporamento.

Passo 2: Ottieni il codice di incorporamento

FlipLink fornisce un codice iframe standard per ogni flipbook pubblicato:

1. Apri il tuo flipbook nella dashboard di FlipLink
2. Clicca il pulsante Condividi
3. Seleziona la scheda Incorpora
4. Copia il codice iframe

Il codice di incorporamento appare così:

<iframe
  src="https://go.fliplink.me/view/your-flipbook-id"
  width="100%"
  height="600"
  frameborder="0"
  allowfullscreen
></iframe>

Puoi regolare il valore height in base al layout del tuo tema Shopify. Per la maggior parte dei temi, un'altezza tra 500 e 700 pixel funziona bene.

Per un approfondimento sulle opzioni di incorporamento iframe, consulta la nostra guida su come incorporare un flipbook con iframe.

Passo 3: Incorpora in una pagina prodotto Shopify

Aggiungere un flipbook a una pagina prodotto specifica è un ottimo modo per sostituire o integrare una guida alle taglie statica o una scheda tecnica.

Usando il Theme Editor di Shopify

1. Vai su Negozio online → Temi nell'admin di Shopify
2. Clicca Personalizza sul tuo tema attivo
3. Naviga al template della pagina prodotto
4. Aggiungi una nuova sezione — scegli Custom Liquid (o Custom HTML a seconda del tuo tema)
5. Incolla il codice iframe nel campo codice
6. Posiziona la sezione dove vuoi che appaia il flipbook (sotto la descrizione del prodotto è una scelta comune)
7. Clicca Salva

Usando i metafield per l'incorporamento dinamico

Se vuoi flipbook diversi su pagine prodotto diverse, usa i metafield di Shopify:

1. Crea un metafield prodotto chiamato flipbook_url (tipo: URL)
2. Per ogni prodotto, incolla l'URL di incorporamento del flipbook nel metafield
3. Nella tua sezione Custom Liquid, usa:

{% if product.metafields.custom.flipbook_url %}
<div class="flipbook-embed">
  <iframe
    src="{{ product.metafields.custom.flipbook_url }}"
    width="100%"
    height="600"
    frameborder="0"
    allowfullscreen
  ></iframe>
</div>
{% endif %}

Questo approccio mantiene il tuo tema pulito e ti permette di gestire i flipbook per prodotto senza modificare il codice del tema ogni volta.

Passo 4: Incorpora in una pagina personalizzata Shopify

Per pagine autonome come una landing page del catalogo o una sezione rivista del brand:

1. Vai su Negozio online → Pagine nell'admin di Shopify
2. Crea una nuova pagina o modificane una esistente
3. Nell'editor della pagina, clicca il pulsante Mostra HTML (l'icona <>)
4. Incolla il codice iframe direttamente nell'HTML
5. Torna all'editor visuale per confermare che appaia correttamente
6. Salva la pagina

Puoi anche usare il theme editor per aggiungere una sezione Custom Liquid a qualsiasi template di pagina, dandoti più controllo sul posizionamento e lo stile.

Passo 5: Rendilo responsive

I temi Shopify variano molto e vuoi che il tuo flipbook appaia bene sia su desktop che su mobile. Avvolgi l'iframe in un contenitore responsive:

<div style="position: relative; width: 100%; padding-bottom: 75%; height: 0; overflow: hidden;">
  <iframe
    src="https://go.fliplink.me/view/your-flipbook-id"
    style="position: absolute; top: 0; left: 0; width: 100%; height: 100%;"
    frameborder="0"
    allowfullscreen
  ></iframe>
</div>

Il padding-bottom: 75% crea un rapporto 4:3. Regola questo valore per adattarlo alle dimensioni delle pagine del tuo flipbook:

• Rapporto 4:3 (orizzontale): padding-bottom: 75%
• Rapporto 16:9 (panoramico): padding-bottom: 56.25%
• Rapporto 3:4 (verticale): padding-bottom: 133%

Questo assicura che il flipbook si ridimensioni correttamente su tutte le dimensioni di schermo senza scrollbar scomode o contenuti tagliati.

Passo 6: Aggiungi pulsanti CTA che rimandano ai prodotti

Una delle funzionalità più potenti per i negozi Shopify è aggiungere pulsanti CTA all'interno del tuo flipbook che rimandano direttamente alle pagine prodotto. Questo trasforma il tuo catalogo da un'esperienza di visualizzazione passiva in uno strumento di acquisto attivo.

Nell'editor di FlipLink:

1. Apri il tuo flipbook per la modifica
2. Seleziona una pagina dove vuoi aggiungere una call-to-action
3. Aggiungi un pulsante CTA con testo come "Acquista ora" o "Visualizza prodotto"
4. Imposta il link all'URL del prodotto Shopify (es. https://tuonegozio.myshopify.com/products/nome-prodotto)
5. Ripeti per ogni prodotto presentato nel catalogo

Quando i clienti sfogliano il tuo flipbook incorporato e vedono qualcosa che gli piace, un clic li porta direttamente alla pagina prodotto per aggiungerlo al carrello. Questo accorcia drasticamente il percorso dalla scoperta all'acquisto.

Passo 7: Configura il whitelisting del dominio

Se vuoi limitare dove il tuo flipbook può essere incorporato — ad esempio, solo nel tuo negozio Shopify e da nessun'altra parte — usa il whitelisting del dominio.

1. Nella tua dashboard FlipLink, apri le impostazioni del flipbook
2. Naviga alla sezione whitelisting del dominio
3. Aggiungi il tuo dominio Shopify (es. tuonegozio.com e tuonegozio.myshopify.com)
4. Salva le impostazioni

Questo impedisce a concorrenti o siti non autorizzati di incorporare i contenuti del tuo flipbook. È particolarmente importante per cataloghi all'ingrosso o lookbook esclusivi che non vuoi siano accessibili pubblicamente al di fuori del tuo negozio.

Consigli per il successo del flipbook su Shopify

Ottimizza il tuo PDF prima del caricamento. Comprimi le immagini nel tuo PDF sorgente per mantenere dimensioni dei file gestibili. Flipbook più leggeri si caricano più velocemente, il che conta per gli acquirenti mobile su connessioni più lente.

Usa titoli di pagina descrittivi. L'indice di FlipLink si genera dalla struttura del tuo PDF. Capitoli ben organizzati aiutano i clienti a saltare rapidamente a categorie di prodotto specifiche.

Testa su diversi dispositivi. Visualizza in anteprima il tuo flipbook incorporato su desktop, tablet e mobile prima di pubblicare. I temi responsive di Shopify gestiscono la maggior parte dei casi, ma verifica che il wrapper responsive funzioni con il tuo tema specifico.

Traccia il coinvolgimento. Le analisi di FlipLink ti mostrano quali pagine ottengono più visualizzazioni e quanto tempo i visitatori trascorrono su ogni spread. Usa questi dati per capire quali prodotti o sezioni risuonano con il tuo pubblico e regola di conseguenza il layout del catalogo.

Mantieni i contenuti aggiornati. Aggiorna il tuo flipbook quando aggiungi nuovi prodotti o lanci promozioni stagionali. Il codice di incorporamento rimane lo stesso — aggiorna semplicemente il flipbook nella tua dashboard FlipLink e le modifiche appaiono istantaneamente nel tuo negozio Shopify. Non è necessario toccare di nuovo il codice del tema.

Collega i flipbook dalle campagne email. Oltre all'incorporamento nel tuo negozio, condividi link diretti ai tuoi cataloghi flipbook nelle email di marketing e nei post sui social media. Le opzioni di condivisione e distribuzione di FlipLink rendono facile guidare il traffico da più canali verso il tuo negozio Shopify.

Per saperne di più sull'incorporamento di PDF e flipbook sui siti web in generale, consulta la nostra guida su come incorporare un PDF in un sito web. Se stai costruendo un catalogo prodotti da zero, consulta come creare un catalogo prodotti digitale.

Inizia a incorporare flipbook nel tuo negozio Shopify

Incorporare un flipbook in Shopify richiede solo pochi minuti e trasforma il modo in cui i clienti interagiscono con i contenuti dei tuoi prodotti. Che si tratti di un lookbook stagionale, un catalogo prodotti completo o una semplice guida alle taglie, i flipbook interattivi creano un'esperienza di acquisto che le immagini statiche e i PDF semplicemente non possono eguagliare.

Crea il tuo flipbook gratuito e incorporalo nel tuo negozio Shopify oggi stesso. Consulta i nostri prezzi per vedere come FlipLink si adatta al tuo business.