Esistono diverse opzioni per aggiungere un video al vostro sito web: Aggiunta di video di YouTube e Vimeo, Kinescope, un'opzione per aggiungere il link diretto a un video su un server di terze parti (video HTML5) e l'utilizzo di iFrame per aggiungere un video.

Come aggiungere i video di YouTube

È possibile aggiungere i video di YouTube utilizzando i blocchi VD01 (un video), VD04 (visualizzazione di un video dopo aver fatto clic sul pulsante Riproduci), VD06N (due video), VD08 (video e testo), VD09 (video a comparsa), VD11 (video con copertina personalizzata), VD12 (video e immagine in una riga), VD13 (streaming live di YouTube con chat dal vivo), VD14 (playlist video), VD16 (widget video), AB701 (titolo, descrizione e video), BF402N (video o immagine e modulo in due colonne), alcuni blocchi galleria e anche blocchi con un'immagine a schermo intero come sfondo(per saperne di più sull'aggiunta di un video come sfondo).

Per aggiungere un video, è sufficiente un link a un video pubblicamente disponibile e abilitato all'incorporamento su siti web di terzi nelle impostazioni sulla privacy.

Scegliere il blocco che più piace, andare alla sua scheda Contenuto e inserire un link al video.

Se si desidera che il video venga riprodotto a partire da un determinato momento, aggiungere il frammento ?start= all'URL e specificare il tempo richiesto in secondi dall'inizio del video. Ad esempio, XEfDYMngJeE?start=5025. In questo caso, il video verrà riprodotto a partire dal 5025° secondo. È possibile copiare rapidamente l'ora facendo clic con il tasto destro del mouse sul lettore e selezionando l'opzione "Copia URL video all'ora corrente".

Come aggiungere i video di Vimeo

È possibile aggiungere i video Vimeo utilizzando i blocchi VD01 (un video), VD04 (visualizzazione di un video dopo aver fatto clic sul pulsante Riproduci), VD06N (due video), VD08 (video e testo), VD09 (video a comparsa), VD11 (video con copertina personalizzata), VD12 (video e immagine in fila), VD14 (video playlist), VD16 (widget video), AB701 (titolo, descrizione e video), BF402N (video o immagine e modulo in due colonne) e alcuni blocchi galleria e anche blocchi con un'immagine a schermo intero come sfondo.

Se il video è bloccato dalle impostazioni di privacy di Vimeo, avrà un'ulteriore combinazione di numeri e lettere alla fine del link dopo l'ID del video. Per riprodurre il video, aggiungere questa combinazione al campo Vimeo Private Link Hash.

Come aggiungere video da un server di terze parti (video HTML5)

Se il vostro video non è pubblicato sui servizi di hosting video citati, potete caricarlo sul vostro server e inserirlo utilizzando i seguenti blocchi video HTML5: VD01 (un video), VD04 (visualizzazione di un video dopo aver fatto clic sul pulsante Riproduci), VD08 (video e testo), VD09 (video pop-up), VD11 (video con copertina personalizzata), VD12 (video e immagine in fila), VD16 (widget video), AB701 (titolo, descrizione e video), BF402N (video o immagine e modulo in due colonne) e alcuni blocchi galleria. È anche possibile aggiungere un video HTML5 come sfondo del sito web, utilizzando i blocchi con sfondo a schermo intero(per saperne di più sull'aggiunta di un video come sfondo).

Per aggiungere un video di questo tipo alla pagina, è necessario utilizzare file video WebM e MP4. È possibile convertire i video in questi formati utilizzando convertitori online o software di editing video o di conversione. Quindi inserirli nell'hosting e ottenere un link diretto al file. Si noti che molto probabilmente sarà necessario utilizzare un servizio di file hosting a pagamento, poiché non tutti i servizi di archiviazione dei file dispongono di questa funzione.

Non è possibile caricare il proprio file video su Tilda , ma è possibile utilizzare servizi di terze parti che forniscono un link diretto al file.

Andare alla scheda Contenuto del blocco video HTML5 e aggiungere il link ai video in entrambi i formati nei campi richiesti.

In alcuni blocchi, c'è solo un campo per aggiungere un link a un video HTML5. In questo caso, è possibile utilizzare un solo formato di file ed è preferibile l'MP4.

Tabella di supporto del browser per i video MP4 → https://caniuse.com/mpeg4
Tabella di supporto del browser per i video WebM → https://caniuse.com/webm

Come caricare i video su un server di terze parti

Per aggiungere un link diretto a un file in un blocco video HTML5, è necessario caricarlo su un servizio di archiviazione file. Le opzioni di archiviazione in cloud, come Google Drive o Dropbox, non sono adatte a questo scopo, poiché non forniscono un collegamento diretto a un file.

Per questo compito, è necessario utilizzare servizi o provider di hosting che offrano un servizio di archiviazione di file. Vediamo come caricare un file e ottenere un link diretto ad esso usando Selectel come esempio.

Come aggiungere i video Kinescope

È possibile aggiungere i video di Kinescope utilizzando i blocchi VD01 (un video), VD04 (visualizzazione di un video dopo aver fatto clic sul pulsante Play), VD08 (video e testo), VD09 (video a comparsa), VD11 (video con copertina personalizzata), VD12 (video e immagine in fila), VD14 (playlist di video), AB701 (titolo, descrizione e video), BF402N (video o immagine e modulo in due colonne) e anche alcuni blocchi con un'immagine a schermo intero come sfondo.

Per iniziare a lavorare con Kinescope, è necessario registrarsi al sito https://www.kinescope.com/ o accedere al proprio account.

Fare clic su "Inizia gratuitamente".

Per caricare il vostro video su Kinescope, fate clic sul pulsante Nuovo nell'angolo superiore destro, selezionate "Carica un file" e aggiungete un video.

Per aggiungere il video al sito web, fare clic sul pulsante con i tre puntini vicino al video nel Catalogo → Copiare il link → Incollare il link nella scheda Contenuto del blocco in Tilda.

Come aggiungere un video utilizzando iFrame

È possibile aggiungere video con iFrame utilizzando i blocchi VD01 (un video), VD04 (visualizzazione di un video dopo aver fatto clic sul pulsante Riproduci), VD08 (video e testo), VD09 (video a comparsa), VD11 (video con copertina personalizzata), VD12 (video e immagine in una riga), VD14 (playlist di video), AB701 (titolo, descrizione e video), BF402N (video o immagine e modulo in due colonne).

Questa opzione consente di aggiungere video da qualsiasi piattaforma che fornisca un codice iframe per incorporare video in un sito web.

Con questa opzione, le impostazioni "Video in riproduzione automatica" e "Video con audio disattivato" non funzionano. Se la piattaforma che ospita il video lo consente, è possibile inserire i parametri Autoplay e Mute nel link.

Video di sfondo per copertine e altri blocchi

È possibile utilizzare un video per una copertina o altri blocchi con un'immagine come sfondo invece di un'immagine di sfondo statica. Andare alla scheda Contenuto e incollare un link al video nel campo richiesto. È possibile utilizzare un link a un video di YouTube o un link a un video HTML5 ottenuto utilizzando la guida precedente.

Un esempio di video di sfondo

Un blocco con una playlist di video

Il blocco playlist si trova nella categoria "Video" → blocco VD14.

Questo blocco supporta i video provenienti dai servizi YouTube, Vimeo e Kinescope. Per aggiungere un video, è necessario specificarne i dati nel seguente formato:
Link al video; Titolo del video; Durata del video; Descrizione del video

Un breve riassunto per ogni video della playlist deve essere specificato da una nuova riga.

Widget video

Il widget video è un piccolo video nell'angolo dello schermo che può aiutarvi a condividere la storia del vostro prodotto o servizio. L'anteprima viene riprodotta senza audio e, se si fa clic su di essa, viene caricato il video principale con audio.

Per aggiungere il widget video, accedere alla categoria Video e selezionare il blocco VD16.

Prima di aggiungerlo, è necessario preparare e ottimizzare il video per il web (utilizzando un software speciale o editor online come Veed.io).

Dopodiché, caricare il file su un servizio che fornisce l'archiviazione dei video e l'accesso ad essi tramite un link diretto.

Non è possibile caricare il file video su Tilda, ma è possibile utilizzare servizi di terze parti.

L'opzione migliore è caricare il file sul proprio hosting, ad esempio Selectel. Guida dettagliata →

Accedere alla scheda Contenuto del blocco e incollare il link al video principale.

È possibile aggiungere facoltativamente la versione di anteprima del video. Può aiutare gli utenti a farsi un'idea introduttiva del video principale e a ridurre il tempo di caricamento del sito web.
La dimensione ottimale del video è 200px di larghezza e fino a 5 secondi.

È possibile specificare un link e un testo per il pulsante sul video principale, se l'obiettivo è incoraggiare il visitatore a compiere un'azione. Se non avete bisogno di un pulsante, lasciate i campi vuoti.

Nelle impostazioni del blocco, è possibile regolare i parametri del widget, del video principale che si apre e dei pulsanti. Per il widget, è possibile specificare il rapporto di aspetto, la larghezza e i parametri del bordo, la posizione sullo schermo e altri parametri. Per il video principale, è possibile configurare i parametri del bordo, dell'ombra e del pulsante di riproduzione. La larghezza del video è sempre fissa - 560x315 per i video orizzontali e viceversa - 315x560 per i video verticali.

Aggiunta di un video in Zero Block

Per aggiungere un video in Zero Block → fare clic sul pulsante (+) e aggiungere un elemento Video → selezionare una delle opzioni disponibili per aggiungere un video: YouTube, Vimeo, MP4, Kinescope → incollare il link al video o il suo ID.

Per aggiungere video da altri servizi, è possibile utilizzare l'opzione di incorporamento del codice HTML: Aggiungere l'elemento HTML → fare clic sul pulsante Modifica codice nel pannello delle impostazioni → specificare il codice per incorporare il player. Di seguito ↓ sono riportati esempi di come ottenere il codice.

Video per un prodotto del catalogo

Nel Catalogo prodotti è possibile aggiungere un video per presentare il prodotto. A tale scopo, accedere alla scheda prodotto → fare clic sul link "Video" vicino a qualsiasi immagine del prodotto e inserire il link a un video di YouTube, Vimeo o Kinescope o il relativo ID.

Come aggiungere video ai feed

Nei Feed è possibile aggiungere sia il video principale del post (che verrà visualizzato all'inizio del post e usato come copertina nell'elenco dei post) sia inserire più video nel testo del post dei Feed.

Per aggiungere il video principale, accedere al campo con l'immagine nella scheda di modifica del post dei Feed → scheda "Video" e incollare il link al video.

Il video verrà visualizzato all'inizio del post.

Per aggiungere un video nel testo del post, fare clic sull'icona più a sinistra → aggiungi un blocco Video → fare clic su di esso e specificare il link al video.

Facendo clic sui tre punti a sinistra del blocco, è possibile cambiare il video.

Il video verrà inserito nel testo del post. Salvare le modifiche.

Successivamente, il video verrà visualizzato nel testo della pagina del post.

Come aggiungere video utilizzando il codice HTML

È possibile aggiungere video incorporando il codice del player nel blocco di codice HTML. A tal fine, accedere alle impostazioni del player o del servizio per ottenere il codice da incorporare.

Per Kinescope, fare clic sul pulsante con i tre puntini vicino a un video nell'elenco → Incorpora → selezionare il codice reattivo se è necessario adattare il lettore alle dimensioni dello schermo o il codice fisso per aggiungere un lettore di piccole dimensioni e specificarne le dimensioni e la posizione nel codice copiato → incollare il codice ricevuto nel blocco T123 della categoria "Altro" o nell'elemento HTML di Zero Block.