Outre l'utilisation de l'un de nos nombreux widgets, vous pouvez également ajouter du son et de la vidéo à votre site dans Website Builder à l'aide du code HTML et du composant de code. Dans ce guide, nous expliquons comment procéder.
- Étape 1 - Téléchargez le fichier audio ou vidéo sur votre espace Web
- Étape 2 - Ouvrez le Website Builder
- Étape 3 - Intégrer le code dans Website Builder
- Étape 4 - Enregistrer et publier
Remarque : Le composant de code est une fonctionnalité Website Builder Premium et Business + Ecommerce. Si vous utilisez actuellement Essentiel, vous pouvez passer au niveau supérieur ou utiliser le widget YouTube à la place.
Étape 1 - Téléchargez le fichier audio ou vidéo sur votre espace Web
Tout d'abord, téléchargez votre fichier audio ou vidéo sur votre espace Web à l'aide du File Manager ou du protocole FTP. L'audio doit être au format mp3 et la vidéo au format mp4.
- Connectez-vous au panneau de configuration de one.com.
- Ouvrez le File Manager dans la vignette Fichiers et sécurité.
- Cliquez sur + Télécharger et sélectionnez le fichier audio (mp3) ou vidéo (mp4) que vous souhaitez intégrer à votre site.
- Copiez le chemin complet de votre fichier et collez-le dans un fichier texte pour une utilisation ultérieure.
Étape 2 - Ouvrez le Website Builder
- Ouvrez le Website Builder.
- Cliquez sur Widgets dans le menu des composants sur la gauche.
- Faites défiler l'écran vers le bas et sélectionnez Code.
Étape 3 - Intégrer le code dans Website Builder
- Copiez l'un des exemples de code ci-dessous et collez-le dans le composant de code de Website Builder.
- Remplacez FULL PATH dans l'exemple de code par le chemin complet de votre fichier audio ou vidéo.
- Cliquez sur Enregistrer.
Choisissez l'un des exemples ci-dessous ou créez votre propre code à l'aide de la balise HTML<audio> et de la balise HTML<video>. N'oubliez pas de remplacer FULL PATH par le chemin complet de votre fichier audio ou vidéo.
Audio :
Intégrez un fichier audio mp3 :
<audio controls>
<source src="FULL PATH" type="audio/mpeg">
</audio>
Intégrez un fichier audio mp3 dont la lecture démarre automatiquement :
<audio controls autoplay>
<source src="FULL PATH" type="audio/mpeg">
</audio>
Remarque : Certains navigateurs limitent la lecture automatique des fichiers audio ou vidéo, même si vous les avez ajoutés à votre code.
Vidéo :
Intégrez un fichier vidéo mp4 :
<video width="640" height="480" controls>
<source src="FULL PATH" type="video/mp4">
</video>
Intégrez un fichier vidéo mp4 qui démarre automatiquement :
<video width="640" height="480" controls autoplay>
<source src="FULL PATH" type="video/mp4">
</video>
Conseil : La taille par défaut de la vidéo est de 640 x 480. Vous pouvez modifier la taille en ajustant les chiffres de largeur et de hauteur dans le code. Vous pouvez également adapter la vidéo à l'écran du spectateur en réglant la largeur sur « 100 % » (width="100%") et la hauteur sur « auto » (height="auto").
Étape 4 - Enregistrer et publier
- Le composant aura maintenant été ajouté à votre espace de travail. Faites glisser le composant vers l'endroit où le fichier doit se trouver sur votre site.
- Cliquez sur Aperçu pour vérifier si cela correspond à vos attentes.
- Si tout va bien, cliquez sur Enregistrer et publier pour que vos modifications soient visibles en ligne.
Conseil : Ajoutez à votre site un composant de boîte aux mêmes dimensions que votre vidéo et attachez le composant de code à la boîte. Cela permet de contrôler plus facilement le placement de l'audio ou de la vidéo. La taille de la vidéo est déterminée par la hauteur et la largeur du code HTML.
Articles associés: