Comment faire une lecture automatique de vidéo sur Squarespace

Publié: 2023-02-14

L'ajout de vidéos en lecture automatique à votre site Web Squarespace peut être un excellent moyen d'engager les visiteurs et d'attirer l'attention sur un contenu important. Les vidéos en lecture automatique sont particulièrement utiles pour les démonstrations de produits, les didacticiels ou le matériel promotionnel. Dans ce guide, nous aborderons trois méthodes différentes pour ajouter des vidéos en lecture automatique à votre site Squarespace : les intégrations YouTube, les balises vidéo HTML et SmartVideo (Swarmify).

Comment ajouter une vidéo YouTube en lecture automatique à votre site Squarespace

YouTube est l'un des services d'hébergement vidéo les plus utilisés. Heureusement, ajouter une vidéo de lecture automatique Squarespace à votre site est simple. Cela dit, il existe plusieurs raisons pour lesquelles un service d'hébergement alternatif, sans fuites de trafic ni distractions, est un meilleur choix pour les entreprises.

La première étape consiste à accéder à votre vidéo YouTube et à sélectionner votre vidéo. Sur la page de lecture de votre vidéo, recherchez les boutons J'aime et Je n'aime pas sous le titre de la vidéo. Directement à leur droite se trouve le bouton "Partager". Cliquez dessus.

Cela affichera une série de liens de médias sociaux. Cliquez sur "Intégrer".

Une nouvelle fenêtre apparaîtra, qui vous donnera votre code d'intégration. Cliquer sur "Copier" copie le code d'intégration dans votre presse-papiers.

Vous avez maintenant votre code d'intégration. Cependant, ce code ne lancera pas automatiquement la vidéo. Pour activer la lecture automatique, nous devrons le modifier. Collez le code dans un simple éditeur de texte tel que le Bloc-notes.

Localisez l'URL de la vidéo dans le code d'intégration. Cela ressemblera à ceci :

src="https//www.youtube.com/embed/xyz"

Juste à la fin de cette URL, entre les guillemets, ajoutez ceci :

?autoplay=1&mute=1

Votre code devrait maintenant ressembler à ceci :

src="https//www.youtube.com/embed/xyz?autoplay=1&mute=1"

Cette modification du code active la lecture automatique et coupe la vidéo par défaut. De nombreux navigateurs, dont Chrome, Safari et Firefox, tenteront d'empêcher la lecture automatique d'une vidéo si elle n'est pas mise en sourdine.

Maintenant que vous avez votre code modifié, retournez sur votre site Squarespace. Faites défiler jusqu'à la section du site où vous voulez votre vidéo. Si vous n'avez pas encore de section distincte, ajoutez-en une à l'aide du bouton bleu - Ajouter une section.

Ensuite, cliquez sur le bouton crayon dans le coin supérieur droit de la section pour modifier la section.

Vous verrez alors plusieurs éléments différents que vous pouvez ajouter. Sous l'en-tête Basique, recherchez l'option permettant d'ajouter un nouveau bloc de code. Cliquez sur </> Code.

Enfin, copiez simplement le code d'intégration de votre fichier texte et collez-le dans l'éditeur de code. Votre site sera automatiquement actualisé et votre vidéo apparaîtra. C'est ainsi que vous intégrez une vidéo YouTube

Comment intégrer une vidéo en lecture automatique à l'aide de balises HTML

Si vous avez une vidéo que vous n'avez pas téléchargée sur YouTube ou sur tout autre site d'hébergement de vidéos, vous pouvez utiliser Squarespace lui-même comme hôte. Assurez-vous que votre vidéo répond aux exigences définies pour les vidéos mises en ligne.

La première étape consiste à ouvrir la bibliothèque d'éléments.

Ensuite, faites glisser et déposez votre fichier vidéo de votre ordinateur dans la bibliothèque d'éléments pour démarrer le processus de téléchargement.

Une fois votre vidéo téléchargée, cliquez sur le bouton Détails du fichier (trois points dans le coin de la vidéo). Ensuite, recherchez la nouvelle URL de votre vidéo téléchargée.

Copiez cette URL et collez-la dans un éditeur de texte comme le Bloc-notes. Ensuite, ajoutez la balise HTML autour de l'URL comme ceci :

<video controls autoplay muted src="[URL]"></video>

Une fois que votre code HTML vidéo est prêt, vous pouvez ensuite ajouter un bloc de code (en utilisant la méthode mentionnée précédemment) et y coller votre code.

Comment ajouter une SmartVideo en lecture automatique à votre site Squarespace

Lorsque vous mettez des vidéos sur votre site, vous voulez qu'elles se chargent rapidement et qu'elles soient exemptes de distractions. La meilleure façon d'y parvenir est d'utiliser un réseau de diffusion de contenu comme Swarmify. Avec SmartVideo de Swarmify, vous pouvez avoir un contrôle total sur votre contenu vidéo, en éliminant la perte de trafic due aux publicités gênantes.

De plus, Swarmify possède un réseau de serveurs répartis dans le monde entier soigneusement conçu pour fournir du contenu vidéo aux téléspectateurs plus rapidement que tout autre service. Ajouter une SmartVideo à lecture automatique à votre site Squarespace est simple.

Tout d'abord, vous devrez configurer votre compte SmartVideo. Une fois que vous avez terminé la configuration du compte, vous recevrez un code de script ainsi qu'un swarmcdnkey qui est nécessaire pour que votre vidéo soit livrée par Swarmify.

Ensuite, installez SmartVideo sur votre site Squarespace. Cliquez sur paramètres.

Cliquez sur Avancé.

Cliquez ensuite sur Injection de code.

Après cela, collez le code extrait que vous avez reçu avec votre clé dans la zone de texte En-tête.

Enfin, cliquez sur Enregistrer.

Chez Swarmify, notre mission est d'apporter une expérience vidéo accélérée et sans distraction aux sites Web de toutes tailles. Que vous soyez propriétaire d'un site Web , une agence ou que vous souhaitiez simplement participer à notre programme d'affiliation , nous avons un plan pour vous !

Une fois que vous avez enregistré vos modifications, SmartVideo sera entièrement installé sur votre site. Si vous avez des vidéos YouTube sur votre site, SmartVideo commencera automatiquement à les convertir en vidéos sans distraction. Si vous avez une vidéo d'une autre source, vous devrez utiliser la balise SmartVideo.

Comme pour les autres méthodes précédentes, cela sera accompli en utilisant un nouveau bloc de code. Rendez-vous sur votre site Squarespace, accédez à la section où vous voulez votre vidéo, cliquez sur Modifier, puis cliquez sur </> Code.

Une fois que vous avez votre boîte de code, vous voudrez alors ajouter la balise SmartVideo en utilisant la syntaxe suivante :

<smartvideo src="[URL]" width="1280" height="720" class="swarm-fluid" poster="path/to/my/image.png" controls muted autoplay></smartvideo>

Ce code ajoutera la vidéo à votre site. L'URL doit être le lien vers votre vidéo. SmartVideo prend en charge les liens Vimeo, Amazon S3, Google Cloud Storage, Dropbox et Google Drive, pour n'en nommer que quelques-uns.

L'option de contrôle permet aux utilisateurs de mettre en pause et de lire la vidéo. Les options de mise en sourdine et de lecture automatique fonctionnent de la même manière que les autres méthodes décrites dans ce guide.

Pourquoi SmartVideo est la meilleure option pour votre entreprise

Parmi les trois options que nous avons répertoriées, il existe plusieurs raisons clés pour lesquelles SmartVideo est clairement le gagnant lorsqu'il s'agit d'ajouter du contenu vidéo à votre site. La première option repose sur YouTube. Bien que YouTube soit un lecteur rapide très familier aux utilisateurs, il a ses inconvénients. Le principal problème avec YouTube concerne les publicités qui peuvent être diffusées avant le démarrage de votre vidéo.

Ces publicités peuvent distraire les prospects et finir par détourner le trafic de votre site et de votre marque. C'est le prix que vous payez pour pouvoir intégrer vos vidéos à l'aide de YouTube "gratuitement". De plus, à la fin d'une vidéo YouTube, la plate-forme recommande invariablement d'autres vidéos qui peuvent ou non être sur le sujet de votre site.

La deuxième option repose sur Squarespace hébergeant votre vidéo. Cependant, Squarespace impose des limites au format et à la longueur de vos vidéos, selon l'endroit où vous souhaitez les télécharger sur votre site. Par exemple, l'élément vidéo dans une section de votre site vous limite à un téléchargement de 60 secondes maximum. De plus, Squarespace n'a jamais été conçu comme un service d'hébergement vidéo et ne doit pas être invoqué pour fournir des résultats ultra-rapides.

La troisième option consiste à utiliser SmartVideo, soit automatiquement, soit via les balises SmartVideo. Cette option vous permet d'avoir une diffusion vidéo rapide sans publicités qui siphonnent le trafic. De plus, SmartVideo est plus rapide. Notre lecteur se charge plus de 12 fois plus rapidement que le lecteur de YouTube !

De plus, YouTube ne vous offre presque aucun support client. Swarmify, d'autre part, vous donne accès à une équipe de support expérimentée et amicale qui est prête à vous aider avec tout ce dont vous avez besoin.

N'attendez pas pour commencer avec Swarmify aujourd'hui !

FAITES LE CHANGEMENT

Essayez SmartVideo dès aujourd'hui !