Generatore di Iframe

Il modo più semplice per generare codici di incorporamento iframe reattivi e ottimizzati per la SEO per il tuo sito web.

Impostazioni

Dimensioni

Opzioni Base

Opzioni Avanzate

Anteprima

Inserisci un URL per vedere l'anteprima

Nota: Se l'anteprima non si carica, il sito web potrebbe vietare l'incorporamento (X-Frame-Options).

Codice Generato

html

Come Usare il Generatore di Iframe

Cos'è un Iframe?

Un iframe (Inline Frame) è un elemento HTML che ti consente di incorporare un altro documento all'interno del documento HTML corrente. È essenzialmente una finestra su un altro sito web, che ti permette di mostrare contenuti esterni come video, mappe o anche intere pagine web senza che gli utenti lascino il tuo sito.

I casi d'uso comuni includono:

  • Incorporare video di YouTube o altri lettori multimediali.
  • Mostrare Google Maps per le sedi aziendali.
  • Integrare widget di terze parti come feed di social media o moduli di pagamento.
  • Mostrare documenti esterni o PDF.

Come Generare Codice Iframe

Usare il nostro generatore di iframe gratuito è semplice e non richiede conoscenze di programmazione:

  1. Inserisci l'URL: Incolla l'indirizzo web (URL) del contenuto che desideri incorporare nel campo "URL Sorgente".
  2. Regola le Impostazioni: Personalizza larghezza, altezza, bordo e opzioni di scorrimento per adattarle al design del tuo sito web.
  3. Anteprima: Usa l'anteprima dal vivo per assicurarti che tutto appaia perfetto su desktop e dispositivi mobili.
  4. Copia Codice: Clicca sul pulsante "Copia" per ottenere il codice HTML generato e incollalo nel codice sorgente del tuo sito web.

Parametri Iframe Spiegati

Capire i parametri chiave ti aiuta a ottimizzare i tuoi embed:

  • Larghezza & Altezza: Definiscono le dimensioni dell'iframe. Usa pixel (px) per dimensioni fisse o percentuali (%) per layout responsive.
  • Sandbox: Una funzionalità di sicurezza che limita ciò che il contenuto incorporato può fare (es. impedire script o popup). Abilita permessi specifici solo se necessario.
  • Caricamento: Imposta su "lazy" per differire il caricamento dell'iframe finché non è vicino alla viewport, migliorando la velocità della pagina e la SEO.
  • Bordo & Scorrimento: Controllano l'aspetto visivo. Rimuovere i bordi di solito appare più pulito, mentre le impostazioni di scorrimento dipendono dalla lunghezza del contenuto.

Rendere gli Iframe Responsive

Nel mondo mobile-first di oggi, un iframe responsive è cruciale. Gli iframe standard hanno dimensioni fisse, che possono rompere i layout su schermi più piccoli.

Il nostro strumento offre un'opzione "Rendi Responsive" che usa CSS moderno aspect-ratio o il classico "padding-hack" per garantire che il tuo contenuto incorporato scalì perfettamente su tutti i dispositivi, dai desktop agli smartphone.

Problemi Comuni degli Iframe

Se il tuo iframe non funziona, controlla questi problemi comuni:

  • X-Frame-Options: Alcuni siti web (come Google o Facebook) bloccano l'incorporamento tramite intestazioni. Se vedi un errore "refused to connect", il sito probabilmente non consente gli iframe.
  • Contenuto Misto: Se il tuo sito è su HTTPS, assicurati che l'URL incorporato sia anch'esso HTTPS. I browser bloccano i contenuti HTTP non sicuri su pagine sicure.
  • Usabilità Mobile: Assicurati che il contenuto incorporato stesso sia mobile-friendly, o potrebbe apparire piccolo o rotto all'interno dell'iframe.

Domande Frequenti

Questo Generatore di Iframe è gratuito?
Sì, questo strumento è gratuito al 100% per generare codici iframe HTML per qualsiasi sito web.
Come rendo il mio iframe responsive?
Basta spuntare la casella 'Rendi Responsive' nelle impostazioni. Questo genererà un div wrapper con CSS che mantiene il rapporto d'aspetto su qualsiasi dimensione dello schermo.
Perché il mio iframe non si carica?
Il motivo più comune è che il sito web sorgente ha impostato un'intestazione 'X-Frame-Options' su 'SAMEORIGIN' o 'DENY', impedendo che venga incorporato su altri siti.
Posso incorporare video di YouTube con questo?
Sì, ma per la migliore esperienza, raccomandiamo di usare il nostro Generatore di Codice di Embed YouTube dedicato che offre opzioni specifiche come autoplay e loop.
È SEO friendly?
Sì. Includiamo opzioni per 'loading="lazy"' per migliorare le prestazioni e attributi 'title' per l'accessibilità, entrambi importanti per la SEO.