TiceCDDP Blog Formation - Tag - videos2017-12-05T12:54:25+01:00urn:md5:40539e71a095e745c29598832bac6b53DotclearGestion des Médiasurn:md5:b6443b8572ee4eda873771742abdd0e72011-01-14T12:40:00+01:002011-10-16T17:17:28+02:00tice CDDPPremiers Pasgalerieimagessonsvideos <h2>Un tutoriel vidéo. Une Notice "papier"</h2>
<p><ins><strong>Suggestions d'utilisation du tutoriel vidéo? </strong></ins><br /><br />* Ouvrir une fenêtre (ou un onglet) de votre navigateur pour travailler sur votre blog. <br />* Visionner un bout de vidéo. <br />* Mettre en pause. <br />* Passer à la mise en pratique sur son blog. <br />* Faire ainsi des va et vient de cette page à celle de votre blog.</p>
<p> La vidéo peut se voir en plein écran (Cliquer sur le bouton dédié dans la barre de la vidéo).</p>
<p>Pour quitter le mode plein écran, appuyer sur le bouton "Echap" de votre clavier.</p>
<br /><p>
<div style="text-align: center;"><object type="application/x-shockwave-flash" data="?pf=player_flv.swf" width="500" height="390">
<param name="movie" value="?pf=player_flv.swf">
<param name="wmode" value="transparent">
<param name="allowFullScreen" value="true">
<param name="FlashVars" value="margin=1&showvolume=1&showtime=1&showfullscreen=1&buttonovercolor=ff9900&slidercolor1=cccccc&slidercolor2=999999&sliderovercolor=0066cc&flv=http://blogs.brestecoles.net/blogforms/public/videos/tutoriels/Tutos_gestionnaire_media640.flv&width=500&height=390&align=center&text=Patience !&"> </object>
</div></p>
<ul>
<li>
<h2><a href="http://blogs.brestecoles.net/blogforms/public/IMAGES-BILLETS/Premierpas/gestion_media2/index.html" target="_blank">Voir La notice "papier"</a></h2>
</li>
<li>
<h2><span style="color: #666600;">Télécharger la notice : voir en annexe ci-dessous.</span></h2>
</li>
</ul>Intégrer du Swf de "Prezi"urn:md5:02042bab94e8fafae5faa549604490d92011-01-01T14:24:00+00:002011-04-04T15:58:16+01:00tice CDDPAIDE VIDEOSvideosPour insérer du flash comme ici, pour une présentation Prezi <ul>
<li>Il faut rédiger en "Editeur source et non visuel".<br /></li>
<li>Il faut copier-coller le code fourni par Prezi:</li>
</ul> <br />
<br />
<strong>Un exemple :</strong><br />
<br />
<object id="prezi_6504651a8206cfc9d8f1db8b77e4d8994422d4dc" name="prezi_6504651a8206cfc9d8f1db8b77e4d8994422d4dc" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="400" height="350"><param name="movie" value="http://prezi.com/bin/preziloader.swf"/><param name="allowfullscreen" value="true"/><param name="allowscriptaccess" value="always"/><param name="bgcolor" value="#ffffff"/><param name="flashvars" value="prezi_id=6504651a8206cfc9d8f1db8b77e4d8994422d4dc&lock_to_path=0&color=ffffff&autoplay=no&autohide_ctrls=0"/><embed id="preziEmbed_6504651a8206cfc9d8f1db8b77e4d8994422d4dc" name="preziEmbed_6504651a8206cfc9d8f1db8b77e4d8994422d4dc" src="http://prezi.com/bin/preziloader.swf" type="application/x-shockwave-flash" allowfullscreen="true" allowscriptaccess="always" width="400" height="350" bgcolor="#ffffff" flashvars="prezi_id=6504651a8206cfc9d8f1db8b77e4d8994422d4dc&lock_to_path=0&color=ffffff&autoplay=no&autohide_ctrls=0"></embed></object>Insertion de vidéos hébergées chez les "Iou tube, Des lits motion, Vi meo etc "urn:md5:1cb900229322e2d3ff37da492de5031d2010-12-08T10:24:00+01:002015-10-01T10:42:24+02:00tice CDDPAIDE VIDEOSvideos <br /><strong>Comment faire ?</strong><ins></ins>
<br />
<ul>
<li>Rédiger son billet en mode source ou wiki</li>
<li>Cliquer sur l'icône 'Media externe" présent dans la barre d'édition.</li>
<li>Renseigner l'adresse de la page de la vidéo concernée. Valider.</li>
<li> puis son positionnement dans votre billet.</li>
<li>Si lors du clic sur "Insérer", il ne se passe rien , c'est que le site où est hébergée la vidéo n'est pas pris en compte par cette extension de Dotcleår.</li>
<li>Il faudra donc procéder d'une manière manuelle selon le format vidéo du fichier. (Cf les autres billets)</li>
</ul>
Un exemple :<br />
<div class="external-media" style="margin: 1em auto; text-align: center;">
<object width="480" height="295"><param name="movie" value="http://www.youtube.com/v/aGpnYl4OpXk?version=3"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/aGpnYl4OpXk?version=3" type="application/x-shockwave-flash" width="480" height="295" allowscriptaccess="always" allowfullscreen="true"></embed></object>
</div><br />
<ins><h2><strong>ATTENTION : YOUTUBE MODIFICATIONS SUITE A EVOLUTION DU SITE :</strong><br /></h2></ins>
<br />
La vidéo à insérer est présente à l'adresse : <a href="https://www.youtube.com/watch?v=QokJIREjMuk" hreflang="fr">https://www.youtube.com/watch?v=QokJIREjMuk</a>
<br />
L'adresse que l'on insèrera sera https://www.youtube.com/v/QokJIREjMuk.
<br />
J'ai là remplacé<strong><em> /watch?v=</em></strong>
<br />
par
<br />
<strong><em>/v/</em></strong>
<br />
<br />
<strong> Code à rentrer pour cette vidéo dans le source lors de l'édition du billet en Xhtml :</strong>
<br />
<div class="external-media" style="margin: 1em auto; text-align: center;">
<object type="application/x-shockwave-flash" data="https://www.youtube.com/v/QokJIREjMuk&hl=fr_FR&fs=1&rel=0" height="385" width="480">
<param name="movie" value="https://www.youtube.com/v/QokJIREjMuk&hl=fr_FR&fs=1&rel=0" />
<param name="wmode" value="transparent" />
</object>
</div>Insertion d'une vidéo déposée sur votre Médiablogurn:md5:90240f8368dda65f703dd3b78b611c162010-12-06T10:20:00+01:002011-04-05T10:11:17+02:00tice CDDPAIDE VIDEOSDiversvideos <br /><strong>Comment faire ?</strong><ins></ins>
<br />
<ul>
<li>Se rendre sur le médiablog de l'école en tant qu'auteur (<a href="http://www.mediablog-brest.net/ecoleXXXXX/auteur">http://www.mediablog-brest.net/ecoleXXXXX/auteur</a>).<br /></li>
<li>Sélectionner la vidéo à intégrer.<br /></li>
<li>Copier le code qui vous est donné dans le champ "Code du lecteur exportable" tout en bas de la fenêtre : <br /></li>
<li>Dans dotclear, créer un billet en xhtml mode source ou en wiki.<br /></li>
<li>Y coller le code copié.</li>
</ul>
<br />
Un exemple :<br />
<object width="400" height="300">
<param name="movie" value="http://www.mediablog-brest.net/versions/1-0/flash/player.swf" />
<embed height="300"
width="400"
flashvars="file=http://www.mediablog-brest.net/ecolelangevin/detail_media_solo.php?id_media=2&image=&fullscreen=true&type=video"
autoplay="false"
allowfullscreen="true"
wmode="transparent"
bgcolor="#000"
pluginspage="http://www.adobe.com/go/getflashplayer"
type="application/x-shockwave-flash"
src="http://www.mediablog-brest.net/versions/1-0/flash/player.swf"
style="display: block;"/>
</object>Insertion Swf dans billeturn:md5:d9054b4756743746ec8ac3bd230205e42010-12-01T17:03:00+01:002011-10-17T12:24:58+02:00tice CDDPAIDE VIDEOSvideosOn souhaite intégrer un fichier vidéo au format swf. Le gestionnaire de médias de Dotcleår nous propose uniquement de créer un lien vers le fichier swf.<br />
Un exemple de lien : <a href="http://blogs.brestecoles.net/blogforms/public/videos/Anmazzr1008.swf">Anmazzr1008.swf</a>
<br /><br />Si l'on souhaite afficher directement cette vidéo dans le billet, il faudra procéder comme suit :
<br /><br />1. METTRE L'EDITEUR EN MODE SOURCE (et non pas visuel)
<br />2. LE FORMAT DE TEXTE EST BIEN XHTML
<br />3. COLLER LE CODE SUIVANT DANS LA FENETRE D'EDITION (en l'adaptant en ce qui concerne l'url et la taille)<br /><br />
<title>Flash XHTML valid</title><br /><object type="application/x-shockwave-flash" data="http://blogs.brestecoles.net/blogforms/index.php?post/2011/01/31/public/videos/Anmazzr1008.swf" height="400" width="450"><br /><param name="movie" value="public/videos/Anmazzr1008.swf" /><br /><img src="http://blogs.brestecoles.net/blogforms/index.php?post/2011/01/31/banner.gif" alt="banner" height="400" width="450" /><br /></object><br /><br />
<title>Flash XHTML valid</title>
<object type="application/x-shockwave-flash" data="http://blogs.brestecoles.net/blogforms/index.php?post/2011/01/31/public/videos/Anmazzr1008.swf" height="400" width="450">
<param name="movie" value="http://blogs.brestecoles.net/blogforms/index.php?post/2011/01/31/public/videos/Anmazzr1008.swf" />
<img src="http://blogs.brestecoles.net/blogforms/index.php?post/2011/01/31/banner.gif" alt="banner" height="400" width="450" />
</object><br />Insertion Avi dans billeturn:md5:db83a6330712a8e4bd886e98f43b0edf2010-11-01T09:11:00+00:002011-10-17T11:24:27+01:00tice CDDPAIDE VIDEOSvideos<strong>On souhaite afficher un fichier AVi dans un billet, </strong> Pour ce faire, il nous faudra éditer le billet non pas en visuel mais en code source et on devra y coller du code spécifique.<br /><br />
ATTENTION, il faudra que le navigateur de votre visiteur soit à jours de ses codecs windows media player pour que la vidéo s'affiche correctement.
Le pack Windows Media Player est, à ce jour, téléchargeable à cette adresse par exemple :<a href="http://download.cnet.com/Media-Player-Codec-Pack/3000-13632_4-10749065.html"> http://download.cnet.com/Media-Player-Codec-Pack/3000-13632_4-10749065.html</a>.<br />
<br />
<br />
DES EXEMPLES DE CODE :<br />
<strong> 1.</strong> Ce code précédé de <strong><</strong> et suivi de<strong> ></strong> <br />
<strong>embed TYPE="application/x-mplayer2" " src="http://blogs.brestecoles.net/blogforms/public/videos/son.avi" autostart="true" controller="true"</strong>
<br /><br />
<embed TYPE="application/x-mplayer2"
width="320" height="240"
src="http://blogs.brestecoles.net/blogforms/public/videos/son.avi"
autostart="true"
controller="true">
<br />
<strong>2.</strong> Autre code avec démarrage manuelle de la vidéo:<br />
<embed type="application/x-mplayer2"
name="MediaPlayer1"
width="320" height="240"
pluginspage="http://www.microsoft.com/Windows/MediaPlayer/"
src="http://blogs.brestecoles.net/blogforms/public/videos/son.avi"
autostart="False"
showcontrols="True"
showstatusbar="False"
showdisplay="False"
showtracker="False"
autorewind="False"
volume="-100"
></embed>
</object><br />
<br />Insertion Wmv dans le billeturn:md5:6e04b77a6bf4f96118f6b3d0857dd4e32010-10-01T16:44:00+01:002011-10-05T09:46:28+01:00tice CDDPAIDE VIDEOSvideos<p><strong>Comment intégrer plutôt que de mettre en lien ?</strong></p> PREALABLE : Pour insérer du wmv dans un billet, il faut impérativement désactiver auparavant le mode visuel : <a href="http://blogs.brestecoles.net/blogforms/index.php?post/2011/04/02/D%C3%A9sactiver-le-mode-visuel"><strong>Voir le "comment faire ?"</strong></a><br />
Ce mode visuel pourra être réactivé sitôt enregistré le billet comportant un fichier wmv.
Sitôt que l'on voudra revnir sur ce billet pour une modification éventuelle, il faudra, avant de l'ouvrir, désactiver cet éditeur visuel.<br />
1. Rédiger en xhtml. (champ format de texte dans la colonne de gauche) <br />
2. Se mettre en "Source" et non en "visuel"<br />
3. Coller ce code pour afficher un fichier Wmv déposé<br />
(Rajouter un <strong><</strong> devant les 2 EMBED). <br />
<br />
EMBED TYPE="video/windowsmedia"<br />
src="http://blogs.brestecoles.net/blogforms/public/videos/leguer.wmv" <br />
WIDTH="400" HEIGHT="300" AUTOPLAY="true" CONTROLLER="true"<br />
/EMBED>
<br />
<br />
<EMBED TYPE="video/windowsmedia"src="http://blogs.brestecoles.net/blogforms/public/videos/leguer.wmv" WIDTH="400" HEIGHT="300" AUTOPLAY="true" CONTROLLER="true"</embed>Integration didapagesurn:md5:90628bd0a2a444c70337048b09698d0f2010-09-22T09:17:00+01:002014-04-08T12:30:37+01:00tice CDDPDIVERSDiversimagestextevideos<p>Intégrer un livre didapages dans un billet</p> <strong>Solution 1</strong> :<br />
Faire un lien pour voir en pleine page.<br />
<strong><a href="http://blogs.brestecoles.net/blogforms/public/IMAGES-BILLETS/demo/index.html" TARGET="_blank" hreflang="fr">Voir en pleine page</a></strong>
<br /><br />
<strong>Solution 2</strong>
Ouvrir l'éditeur en me mode d"'affichage source et non pas visuel.<br />
Y coller ce code par exemple (Rajouter un < au début et un > à la fin) : <br />
iframe src="http://blogs.brestecoles.net/blogforms/public/IMAGES-BILLETS/demo/index.html" style="width:500px;height:400px;">/iframe
<br />
<br />
<strong>Cela donne ceci :</strong><br /><br />
<br /><iframe src="http://blogs.brestecoles.net/blogforms/public/IMAGES-BILLETS/demo/index.html" style="width:500px;height:400px;">/iframe><br />
<br />
<strong><a href="http://blogs.brestecoles.net/blogforms/public/IMAGES-BILLETS/demo/index.html" hreflang="fr">Voir en pleine page</a></strong>Désactiver le mode visuelurn:md5:a4b10800593bf99aa06e9f8f3f12bca62010-09-18T10:36:00+02:002011-10-17T12:29:54+02:00tice CDDPAIDE VIDEOStextevideos <h2>C'est quoi ?</h2>
<br />Pour la rédaction des messages, on peut faire le choix d'accéder ou pas au "<strong>mode visuel</strong>".<br /><br /><strong>Qu'est le "mode visuel" ?</strong><br />Il permet d'avoir dans son interface de rédaction du billet, un aperçu plus ou moins fidèle de ce que l'on aura choisi comme formatage de texte (Gras, souligné, taille de police etc) ou insertion d'images.<br />L'autre mode appelé "<strong>mode source</strong>" ne nous affiche que le code "source" du billet.<br />
<h2>Pourquoi choisir le mode source plutôt que le mode visuel ?</h2>
Le mode visuel devient très embêtant lorsque, par exemple, on doit rentrer du code dans le billet (exemple de l'insertion de vidéos stockées sur le Médiablog de l'école.).<br /><br />En effet, pour intégrer ce code provenant du Médiablog par exemple, il vous faut passer en mode source. Jusque là tout va bien. Par contre la fois prochaine où vous ouvrirez votre billet, il s'ouvrira en mode par défaut cad le mode visuel.<br />Cette simple ouverture en mode visuel aura fait disparaître une partie de votre code source permettant l'affichage de la vidéo ! Donc plus de vidéos !!!<br /><br />La solution est donc de se mettre en "<strong>mode Source</strong>" par défaut et pour ce faire désactiver le "<strong>mode Visuel</strong>"<br /><br />
<h2>Voici la manipulation.</h2>Insertion de vidéos flv méthode 2urn:md5:d412efbfeb9062d75d9bab13e39fe4af2010-09-17T16:19:00+01:002012-03-27T09:16:00+01:00tice CDDPAIDE VIDEOSvideos<p>.</p>
<h2>Intégration directe d'un fichier flv depuis le bouton "Flv player".</h2>
<p>Avantages : Plus de choix de paramétrages du lecteur FLV.</p>
<p>Inconvénients : Suppose désactiver le mode visuel.</p><br />
__________________________________________________________________________________ <div style="text-align: left;"><br /><strong>Préalable :</strong></div>
<ul>
<li>
<div style="text-align: left;">Avoir téléverser par le gestionnaire de média le fichier vidéo à insérer. Voir <a href="http://blogs.brestecoles.net/blogforms/index.php?post/2011/03/30/Gestion-des-medias">Gestions des médias</a></div>
</li>
<li>Créer son billet au format wiki.</li>
</ul>
<div style="text-align: center;"> </div>
<div style="text-align: left;">Dans la barre d'outils disponibles lors de la rédaction d'un message,</div>
<div style="text-align: left;">on trouvera l'icône ouvrant l'accès au lecteur FLV (<strong>FLV player</strong>) .</div>
<p><img title="acces_playerflv.png, avr. 2011" src="http://blogs.brestecoles.net/blogforms/public/IMAGES-BILLETS/Aidesvideos/.acces_playerflv_m.jpg" alt="acces_playerflv.png" /></p>
<div style="text-align: left;"> </div>
<div style="text-align: left;">Une fois sélectionné le fichier Flv, une fenêtre s'ouvre, permettant d'intervenir sur les propriétés d'affichage de la vidéo.<br /><img title="editeur_flv.png, avr. 2011" src="http://blogs.brestecoles.net/blogforms/public/IMAGES-BILLETS/Aidesvideos/.editeur_flv_m.jpg" alt="editeur_flv.png" /></div>
<p> </p>