Insérer une video sur son site web: conseils, techniques, codes
  • Bonjour à tous,

    J'ouvre une discussion sur la question de la diffusion de videos sur un site web suite à de multiples questions de patrick dans les commentaires de ce tutoriel
    Mettre video sur blog ou site web avec générateur html pour wmv, flv, divx
    Je vais tenter de répondre à toutes ces questions, en espérant que quelques membres du forum pourront également m'assister:

    1ères séries de questions de patrick à résoudre:


    créer des liens hypertexte entre le titre de mes clips et le flash vidéo (commun ci possible à tous les clips).
    Quand je clique sur “voir la vidéo” de n’importe clip présent sur mon site web, que la page sur laquelle se trouve le flash vidéo, puisse se positionner.
    Il ne reste plus maintenant qu’à cliquer sur “play” du flash vidéo pour voir la vidéo
    j’ai essayé de générer un player divx avec divx code générateur. Lorsque j’ai copier le code généré et que j’ai collé sur ma page web, toutes les pages se sont fermées inopinément. Je l’ai repété plusieurs fois et c’est le même résultat.


    Toutes les générateurs de code html video ont été ajoutées dans ma sélection de meilleurs sites de générateur de video:

    http://favoris.jeanviet.info/video-generator/

  • 27 Commentaires sorted by
  • Un petit test sur le forum avec video, lien, image d'un clip de patrick:

  • OK, ça marche... Enfin je pense que c'est ce que voulais patrick.
    Après on pourra ajuster taille et déclenchement de la video (autostart ou non).

    Donc on a 3 fichiers à ajouter sur son site à la racine par exemple (tous les 3 dans le même répertoire):

    player.php (qui contient le code embed de notre video wmv)
    video.htm (qui contient un lien vers la video)
    popup.js (qui contient une fonction pop up propre à initialiser dans le body)

    Je mets tous ces fichiers à diposition ici en reprenant l'exemple de Patrick:

    player.zip


    Chaque fois qu'on fait un lien depuis video.htm il faut le construire ainsi, si je me situe sur le site de patrick.
    Voir le clip / Koglego
    dim indique la dimension de la popup en largeur et hauteur, rel="popup", c'est la fonction javascript popup qu'on appelle pour l'ouverture du lien.

    Et on appelle jamais directement le fichier wmv, on le fait précéder de notre player maison:

    player.php?video=
    et on ajoute derrière video= l'url de notre video avec http://

    Notre fichier html d'appel de la video est comme ceci:
    le popup.js doit être appelé, et chargé dans le body ()

    Appel video dans playerVoir le clip / Koglego
    Tiens nous au courant Patrick... pour la question 4), il faut que tu télécharges le codec divx web player:

    http://www.divx.com/divx/windows/webplayer/

  • Le divX refuse de se lancer. Il est arrivé à expiration. Certainement que mes prédécesseurs l'utilisaient déjà. Je vous prie de me conseiller un autre logiciel de conversion. Merci

  • Patrick,

    Dans mes explications, j'ai adapté mon discours à  ta problématique.

    Tu peux garder tes videos au format wmv, il faut juste que tu prennes le temps de lire ce que j'ai écris plus haut, de le tester, et ça devrait marcher.

    Courage tu vas y arriver !

  • Bonjour,
    Alors voilà ce que j'ai fait : (l'exercice pratique a concerné seulement que le clip de YONI)
    1- J'ai charger les fichiers zip que vous m'avez envoyés sur mon site
    2 - j'ai créer un lien avec le titre du clip (koglego) vers le fichier video.htlm contenu dans le fichier zip que vous m'avez envoyé .
    3 - J'ai copié -coller ce code que vous m'avez envoyé sur la page où va apparaître ma vidéo




    Appel video dans player




    Voir le clip / Koglego


    4- Enfin j'ai publié !
    Si vous cliquez sur ce lien : vous constaterez que je ne vous ai pas compris: http://www.artistebf.org/musiqueduburkina_musiqueduburkina....htm
    Par contre si vous cliquez sur ce lien : http://www.artistebf.org/musiqueduburkina_yoni.htm
    vous constatez la présence du Flash player prêt à jouer. preuve que j'ai assimulé vos premières leçons.
    En cas toujours d'échec de ma part, j'ai envi d'alligner les flash player et d'indiquer le titre des clips correspondant à chaque flash player. Ce qui  allongera considérablement ma page  (à cause de la succession des flash player) surtout pour un artiste qui aura 5 clips par exemple. Mais j'espère que je vais réussir. je vais me battre et reprendre vos explications.
    Le DIVx
    Je le préfère parce qu'il vous permet d'afficher un apperçu de l'image de la video.  C'est plus intéreressant . il est l'idéal.

  • Essaye comme ça:

  • Bonjour Janviet et merci pour votre assistance
    J'ai essayé samedi et dimanche de suivre la démarche mais il me semble que vous avez omis de m'indiquer un 4è fichier à éditer. (puique que vous me parliez tantôt qu'il me fallait éditer 4 fichiers. or vous m'avez inqué que 3  fichiers :
    le player .php
    le popup.js;
    la vidéo.htm;
    mais pas de 4è fichier ?
    Dans tous les cas, voilà ce que j'ai fait. Dans l'application à partir du quel je conçois le site web a prévu un répertoire vidéo. Alors j'ai donc:
    1- Créer par (par précaution) un sous répertoire "vidéo-player" pour ranger les fihiers dont vous m'avez parlés
    2 - Je les ai chargés sur mon serveur
    3 - Pour faire appel à une vidéo ou changer une vignette, j'ai juste choisi un raccourci. Au lieur de changer toute l'URL de la vidéo (comme ceci) :http://www.artistebf.org/videos/46.WMV" ; j'ai remplacé juste seulement la fin c'est à dire le 46.WMV par la vidéo de mon choix  le 40.WMV par exemple.
    NB : Est-ce à cause de cela que la vidéo n'a pas fonctionné, là, est la question. Sinon la vignette à marcher.
    Autres raisons possibles : Les 3 fichiers chargés sur mon serveur démeurent introuvables. Or dans votre exemple, les 3 fichiers sont bien présents dans leur répertoire. Par ce fait j'ai senti déjà le signe précurseur de mon échec. Pour vous rendre compte de mes manip, je vous prie de cliquez sur ce lien ( c'est cette page qui m'a servi d'exercice ): http://www.artistebf.org/musiqueduburkina_yoni.htm
    Merci bien

  • Bonjour Patrick,

    Il n'y a que 3 fichiers (4 avec ta video)
    Si tu t'amuses à créer des répertoires / sous répertoires dans tous les sens ça ne peut pas marché...

    Du moins les fichiers player.php, et popup.js doivent être dans le même répertoire que ton fichier musiqueduburkina_yoni.htm ce qui n'est pas le cas dans ton ex.

    Je t'ai montré la marche suivre + les manips FTP en video, je ne peux rien de plus pour toi, si tu ne suis pas mes indications.

    Il n'y pas d'appel à la fonction popup.js dans musiqueduburkina_yoni.htm
    les fichiers player.php et popup.js n'ont pas été ajoutées dans le même répertoire: normal qu'ils soient introuvables !

    Tu veux aller trop vite, contente toi de mettre tous les fichiers zip dans un même répertoire (ex /videotest/

  • Bonjour Jeanviet.
    Je reprends mon commentaire suite au dernier exercice que j'ai effectué; car je me suis rendu compte que vous n'avez pas reçu les tous premiers.
    j'ai procédé cette fois étape par étape pour mieux comprendre
    A. Le chargement d'abord des 3 fichiers
    1- J'ai dézipé le répertoire zip que vous vous m'avez envoyé
    2 - je les ai rangés dans un répertoire "videotest" (video sans accent)que j'ai créer à cet effet sur mon disque dur.
    3- je me suis connecté à mon serveur
    4- j'ai créer un répertoire "videotest" dans le répertoire "www"
    5- j'ai chargé  les 3 fichiers dans le répertoire "videotest" qui se trouve bien sûr dans le répertoire "www"
    6 - je suis revenu sur la page de yoni (qui m'a service d'exercice d'applique ) à ce lien précisément : http://www.artistebf.org/musiqueduburkina_yoni.htm
    7- J'ai copié-collé le code ci-après :




    Appel video dans player




    Voir le clip / Koglego


    Ai-je au moins suivi pour cette première étape ?

  • Bonjour Patrick,

    Je t'ai répondu ici:
    http://forum.jeanviet.info/discussion/482/video-sur-site-web/

  • Bonjour Jeanviet,
    Suis de retour !
    1 - J'ai de nouveau dézipé les 3 fichiers que j'ai ranger dans le répertoire "videotest"
    sans plus rien changer à leur forme.
    2- j'ai publié mon site en local (sur le disque dur) étant donné que je peux pa le publier directement.
    3- j'ai retrouvé la page yoni au format .htm que j'ai ajouté dans le dossier "videotest"
    4 -Je me suis connecté au serveur et j'ai demandé d'écraser l'ancien répertoire "videotest" au profit du nouveau qui contient cette fois 4 fichiers
    5- je n'ai plus jugé utile de copié-collé sur la page de yoni le code suivant étant donné que cette action a été faite antérieurement.
    Il s'agit de ce code:



    Appel video dans player




    Voir le clip / Koglego


    Remarque : La première procédure, n'ayant pas marché, j'ai replacé le répertoire"vidéotest" dans le dossier "import" de mon logiciel de cration de site web.
    A quel niveau ai-je flanché ?
    Merci !

  • Ce que je vois, c'est que le répértoire videotest est inexistant (mais poruquoi l'as tu effacé ?)... donc on avance pas au niveau des fondamentaux....

    http://www.artistebf.org/videotest/

  • Bonjour,
    J'ai replacé le dossier "videotest" comme vous me l'aviez indiqué.
    Merci

  • Bonsoir,
    J'ai une bonne nouvelle ! quelque chose à marcher ! jeanviet ! j'ai réussi à faire marcher le divx. Ce que j'ai fait, j'ai copier tous mes fichiers vidéo sur ma clé usb et je me suis rendu en ville.
    J'ai télécharger le divx suivant le lien que vous avez indiqué. j'ai commencé par convertir un seul fichier vidéo en divx. Je l'ai publié et j'ai repris vos explications et ça marche. formidable !!!
    Seulement, lorsque je copie-colle le code sur ma page d'accueil ou partout ailleurs sur mes pages, toute l'application se referme. Je ne comprends pas ! bon là c'était déjà la nouvelle que je voulais vous annoncer. mais pourquoi cela ? parceque je voulais le placer sur ma page d'accueil.

  • Bonsoir Patrick,

    Il y a peut-être un  conflit avec des codes présents dans ta page pour le divx player....

    On peut faire sans.

    Donc tu as bien tout mis dans le répertoir video test....

    C'est impeccable...

    Tu peux donc tester ma technique, sur cette page:
    http://www.artistebf.org/videotest/video.htm

    Et tu constates que ça fonctionne... n'est-ce pas ?

    Il te faut donc répliquer certains élément de cette page sur la page suivante:
    http://www.artistebf.org/videotest/musiqueduburkina_yoni.htm

    Car la fonction pop-up n'est pas prise en compte...

    Je reprend le code de video.htm, et je te mets en rouge ce qui doit aussi figurer au niveau de musiqueduburkina_yoni.htm (que tu n'as pas mis)
    Appel video dans playerVoir le clip / Koglego
    Voilà pour ce soir, tiens moi au courant.

  • Salut ça faisait longtemps que j'étais pas passé sur le forum, mais là j'ai vraiment besoin de vos lumières!Et pourtant j'ai  j'ai pas encore commencé. Alors voilà, dans le tuto il est dit d'héberger la vidéo sur un espace perso en ligne. Mais le prob est la limite d'espace (100 Mo). Moi j'ai une vidéo de plus de 700 Mo alors comment je fais? C'est impossible? Est-ce que vous pouvez m'aider je désespère vraiment.

  • salut wena,

    Tu peux l'héberger sur vimeo (et la poster sur ton site ensuite).... si ta video n'est pas copyrightée: c'est bien une de tes créations perso ?

  • Non c'est pas une de mes création. C'est bien ce que je disais il y a pas de solution.

  • Jeanviet,
    c'est fait !
        Mais aujourd'hui bien  que le procédé souhaité ne marche pas encore, je peux m'estimer très satisfait de votre grande aide. Sincèrement, vous m'avez aider à réaliser l'un de mes plus beaux rêves. Je vous prie de visiter quelques une de mes pages de musique pour voir la solution pour laquelle j'ai opté. Je peux d'abord gardé cela en entendant que vous me suggérez d'autres présentations.
    En page d'accueil, http://www.artistebf.org/ , j'aurai bien voulu avoir une Vidéo en DivX, avec un apperçu d'une image de la vidéo pour des flash publicitaires. C'est domage que je rencontre des problèmes. Mes pages se referment automatiquement dès l'insertion du code.
     

  • Bravo Patrick... bon courage pour la suite.
    A+

  • Bonjour Jeanviet ! 
    1 - Si j'étais à noter, combien me donnerez-vous pour mon site ? ....../20 bien sûr
    * J'ai pensé un moment qu'il faut peut-être vous indiquer le lien pour télécharger le petit logiciel sur lequel je conçois le site. Comme ça vous comprendrez mieux pourquoi il refuse le code des vidéo en  DivX. J'ai l'impression qu'il ne sagit pas de conflits de code puique j'ai essayer sur de nouvel pages et ça donne le même résultat.
    voilà le lien pour tester le logiciel : http://www.01net.com/telecharger/windows/Internet/editeur_de_site/fiches/27344.html
    3 - Je peux vous inviter au Burkina  Faso ?

  • Bonjour Patrick,

    1/ Ton site est très bien organisé, très riche, et très complet... franchement c'est du très bon travail... je lui mets 16/20.

    2/ Bon moi, je n'utilise que notepad++ pour créer des pages web.... Je ne suis pas trop pour les editeurs de site... Si je devais en garder un seul ce serait Dreamweaver (mais bon il n'est pas donné)

    3/ Merci pour l'invitation ! ca fait un peu loin pour moi... quand j'aurai des vacances, pourquoi pas

  • Merci ! bien et je ne manquerai pas de recourir à vous . Encore merci pour votre disponibilité. Je suis content car j'ai réussi à faire de même pour les audio.
    Je vais donc choisir le dreamweaver pour facilement créer les divX pour mes Pub. Jetez un coup d'oeil sur ma page d'accueil. j'ai réussi en suivant vos conseils à créer un diaporama et à faire une petite pub pour mon site.
    Je souahite vivement que vous ayez vos vacances car il y a le festival panafricain du cinéma de Ouagdougou (fespaco) binetôt.
    Bravo pour vous !
     

  • Salut Jeanviet!!!
    Pour viméo c'est mort ainsi que viddler du coup je sais plus quoi faire. Et pour insérer un lecteur windows dans un blog on fait comment?Merci pour l'aide.

  • Salut Wena,

    Bon  j'ai une technique à te proposer... mais il ne faut pas en abuser.
    Tu héberges ton divx sur Boxstr, ensuite tu suis mon tuto:

    Générer un player divx avec  divx code Generator

    Et ca devrait marcher... les limites:


    Ton fichier video doit faire moins de 1 go, tu as une bande passante de 1go / jour.

    Ce qui siginifie que si ton fichier fait 500 mo, seulement 2 personnes pourront le regarder en ligne chaque jour.

    Ne mets pas en ligne des oeuvres piratées... sinon tu risque d'avoir des soucis !

  • Ok merci je vais essayer et si prob je passerai te voir.Merci!!!!



© Jean-Baptiste Viet: Chef de Projet Internet, Webmaster de Jeanviet.info, Créateur de Tuto Video, et Ancien Etudiant à Paris 1 Sorbonne | Design : Emilie Boudet