Accueil Plan du site Liens utiles Isotools.com

AccueilF.A.Q.Help-DeskNous contacterPlan du siteRechercher

F.A.Q.

F.A.Q. > webServices

Vidéo

1. Insertion d'une vidéo YouTube

Mettre une vidéo YouTube dans mon site

Description : Pour mettre une vidéo YouTube dans votre site, vous allez utilisez le code html de votre vidéo fournie par YouTube.

Solution : Ouvrez la page web de votre vidéo YouTube et copiez le code html qui apparaît dans le champ, de la fenêtre droite de votre page (Cf. encadré rouge).

Une fois ce code copié, ouvrez votre site avec IsotoolsStudio et insérez ce code dans la page où vous souhaitez voir apparaître cette vidéo. Pour insérer du code Html dans votre site reportez vous à la rubrique « comment ajouter du code html dans toutes mes pages ».

2. Comment mettre une vidéo FLV dans une page ?

Dans une page Web, l'affichage d'une vidéo de format FLV requiert de passer par un lecteur Flash spécifique.

Problème : IsotoolsStudio ne propose pas d'outil intégré auquel il suffirait de donner le fichier FLV ; il faut donc trouver soi-même un bon lecteur Flash et écrire soi-même le HTML...

Pour intégrer une vidéo FLV, un de nos partenaires (LD-Services) a développé un élément rédactionnel qui réalise ce besoin.

Notons qu’il est également possible d’intégrer une vidéo FLV manuellement. L’intégration manuelle peut permettre de répondre à des besoins plus précis et semble également plus intéressante pour pouvoir contrôler cela soi-même.
En voici la procédure :

I. Récupération des fichiers de travail

Téléchargez le fichier .ZIP ci-dessous, et décompressez-le sur votre disque-dur.

	FLV Isotools Kit Taille : 245 ko

Contenu de l'archive :

flvplayer.swf :
- Le fichier SWF du lecteur Flash lui-même.
- Vous n'avez pas besoin d'en comprendre le contenu.

videoIsotools.flv :
- Fichier vidéo au format FLV.
- Bien que nous vous fournissions ce fichier en exemple, remplacez-le par votre propre fichier FLV.

flv_outils.txt :
- Une librairie JavaScript requise pour le bon fonctionnement du lecteur.
- Vous n'avez pas besoin d'en comprendre le contenu.
- Ce script doit être mis une seule fois dans une page contenant au moins un lecteur.

flv_parametres.txt :
- Les 3 paramètres vous permettant de personnaliser votre vidéo.
   -> flv : nom de fichier de votre video FLV.
   -> largeur : la largeur du lecteur, en pixels.
   -> hauteur : la hauteur du lecteur, en pixels.

flv_lecteur.txt :
- Le code HTML/Javascript incarnant le lecteur FLV lui-même.
- Vous n'avez pas besoin d'en comprendre le contenu.
- L'emplacement où vous collerez ce code définira l'emplacement d'affichage du lecteur.

II. Intégration des éléments dans la page

Comme le montre la copie d'écran ci-dessous, insérez les éléments nécessaires dans la page.

Code HTML "Outils" : collez-y le contenu du fichier flv_outils.txt.
Code HTML "Paramètres" : collez-y le contenu du fichier flv_parametres.txt.
Lorsque la mise en place de l'exemple focntionnera bien, vous adapterez le nom et les dimensions à votre fichier vidéo.
Code HTML "Lecteur" : collez-y le contenu du fichier flv_lecteur.txt.
Document Lecteur FLV : mettez-y le fichier flvplayer.swf.
Document Fichier FLV : mettez-y d'abord notre fichier d'exemple (videoIsotools.flv).
Lorsque la mise en place de l'exemple fonctionnera bien, vous pourrez alors y mettre votre propre fichier FLV.

III. Diffusion de l'exemple

Vous pouvez dès à présent diffuser votre site, et vérifier le bon fonctionnement de votre lecteur FLV.

Attention : la façon dont est fait cet exemple ne permet pas de voir fonctionner le lecteur dans la vue Visualiser ; il faut obligatoirement diffuser pour pouvoir apprécier le résultat.

Attention : lorsque vous intégrez les Documents à votre site (flvplayer.swf et videoIsotools.flv), vérifiez les noms de fichier pris en compte par l'application. S'ils ont changé, reportez les nouveaux noms dans "Code HTML Paramètres" et "Code HTML Lecteur".

Le résultat que vous devriez obtenir est visible à droite :

Get the Flash Player to see this player.

IV. Adaptation & Perfectionnement

/////// Adaptation

Si la visite de la page dans le site diffusé vous a permis de voir correctement la vidéo d'exemple, effectuez ce qui suit :

- Dans l'élément "Document : Fichier FLV", supprimez le fichier d'exemple, et mettez votre propre fichier FLV.

- Dans l'élément "Code HTML Paramètres", remplacez le nom d'exemple (videoIsotools.flv) par le nom de votre propre fichier FLV.
Adpatez les dimensions (largeur, hauteur) à celles de votre fichier.

A ce niveau, la prochaine diffusion mettra à jour votre page, et votre vidéo devrait alors s'afficher dans le lecteur.

/////// Perfectionnement

Vous avez dû remarquer que la définition des 2 éléments Document dans la page rend ces fichiers téléchargeables (juste en-dessous du lecteur), ce qui est tout à fait disgrâcieux.
Vous pouvez éviter ce comportement en suivant la procédure suivante :

- Créez une Page Libre, dont vous cochez tout de suite l'option "Ne pas faire apparaître dans le menu".
- Déplacez les 2 éléments Document vers cette nouvelle Page Libre.

Attention : il faut que la "Page Libre cachée" se trouve dans le même sous-site ET dans la même zone de personnalisation que la page contenant le lecteur FLV.

V. Crédits