Différences

Ci-dessous, les différences entre deux révisions de la page.

--- aide:wiki:video [08/08/2011 11:16] – jpc
+++ aide:wiki:video [24/11/2022 05:34] (Version actuelle) – modification externe 127.0.0.1
@@ Ligne 1: / Ligne 1: @@
 ====== Intégrer une vidéo dans une page du wiki ======
+<WRAP center round info 95%>
+Si vous voulez intégrer votre propre vidéo vous devez d'abord la déposer sur [[http://www.youtube.com/|Youtube]] ou [[http://vimeo.com/|Vimeo]]
+Le fichier de la vidéo pourrait être ajouté comme tout autre fichier en cliquant sur "Ajouter les images ou autres fichiers" dans la barre d'outils au dessus de la page une fois éditée. Mais ce n'est pas une bonne solution (fichier trop lourd).
+Il vaut mieux inclure la vidéo et la visionner dans la page du wiki, ce qui est préférable visuellement.
+</WRAP>
+Pour cela, deux façons, en utilisant le langage html, ou en utilisant le plugin [[http://www.dokuwiki.org/plugin:vshare|vshare]] (installé sur Lingalog).
+===== Exemple avec le bouton "Insert video from video sharing" (plugin vshare) =====
+<WRAP center round important 95%>
+Cette méthode ne fonctionne qu'avec les vidéos youtube et vimeo
+</WRAP>
+Pour insérer la vidéo vous devez d'abord copier l'URL de la page de la vidéo qui se trouve dans la barre d'adresse de votre navigateur :
+{{:aide:wiki:vimeo-url-video.png?300|}}
+ensuite cliquez sur le bouton "Insert video from video sharing" dans la barre d'outils :
+{{:aide:wiki:bouton-video.png?|}}
+puis collez l'URL
+{{:aide:wiki:bouton-video-coller-url-video.png|}}
+La syntaxe sera alors automatiquement ajoutée à votre page.
+Vous pouvez aussi utiliser directement la syntaxe.
+==== Vimeo ====
+Voici la syntaxe :
+<code>{{vimeo>68180971?medium}}</code>
+Voici le résultat :
+{{vimeo>68180971?medium}}
+==== youtube ====
+Voici la syntaxe :
+<code>{{youtube>KrHrJoGNpaA?medium}}</code>
+Voici le résultat :
+{{youtube>KrHrJoGNpaA?medium}}
+==== Modification de l'affichage de la vidéo ====
+Pour faire varier la taille, mettre ?small ou ?large, comme ceci
+  {{youtube>2PxQYM__-xU?small}}
+Pour centrer la vidéo sur la page (un espace de chaque côté :
+  {{ youtube>2PxQYM__-xU?small }}
+Procéder en fait comme pour une image fixe pour centrer, et mettre à droite ou à gauche :
+  *à droite
+  {{ youtube>2PxQYM__-xU?small}}
+  *à gauche
+  {{youtube>2PxQYM__-xU?small }}
+===== Exemple avec le code html "intégrer", "incruster" ou "embed" =====
+Il faut copier/coller le code html dans la page du wiki en l'entourant de ''<html>'' et ''</html>''
+Vous pouvez normalement le faire depuis n'importe quel site qui vous propose le code html d'intégration d'une vidéo
+<WRAP center round tip 95%>
 On s'y prend de la même façon pour une présentation déposée sur [[http://en.calameo.com/|Calameo]], [[http://www.slideshare.net/|Slideshare]], ou autre.
+</WRAP>
+==== youtube ====
+Sur youtube le code est accessible en dessous de la vidéo en cliquant sur le lien "Intégrer"
+{{:aide:wiki:code-html-youtube.png|}}
+Voici la syntaxe :
-Le fichier de la vidéo peut être ajouté comme tout autre fichier en cliquant sur "Ajouter les images ou autres fichiers" dans la barre d'outils au dessus de la page une fois éditée. Mais ce n'est pas la meilleure solution.
+<code>
+<html>
+<iframe width="560" height="315" src="http://www.youtube.com/embed/KrHrJoGNpaA" frameborder="0" allowfullscreen></iframe>
+</html>
+</code>
-On peut également inclure la vidéo et la visionner dans la page du wiki, ce qui est beaucoup mieux visuellement. Pour cela :
+Voici le résultat :
-- déposer votre vidéo sur un site approprié tel que Youtube ou Vimeo ;
+<html>
+<iframe width="560" height="315" src="http://www.youtube.com/embed/KrHrJoGNpaA" frameborder="0" allowfullscreen></iframe>
+</html>
-- un code que le site met à votre disposition est à recopier, appelé "embed" ou "intégrer", copier ce code ;
+==== Vimeo ====
-- coller ce code à l'endroit où vous voulez voir la présentation s'afficher en le faisant précéder et suivre des balises html <html> avant et </html> après.
+Sur vimeo le code est accessible en cliquant sur le bouton "Share" ensuite il faut copier ce qui ce trouve dans "Embed"
-Voici à quoi ressemble le code "embed" :
+Voici la syntaxe :
+<code>
+<html>
+<iframe src="http://player.vimeo.com/video/68180971" width="500" height="281" frameborder="0" webkitAllowFullScreen mozallowfullscreen allowFullScreen></iframe> <p><a href="http://vimeo.com/68180971">Mirage</a> from <a href="http://vimeo.com/user18872843">Iker &amp; Dana</a> on <a href="http://vimeo.com">Vimeo</a>.</p>
+</html>
+</code>
-   <html><object width="212" height="172"><param name="movie"
+Voici le résultat :
-   value="http://www.youtube.com/v/Rgul4WAWj6w&hl=en&fs=1"></param><param name="allowFullScreen" value="true"></param><param
-   name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/Rgul4WAWj6w&hl=en&fs=1"
-   type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="212"
-   height="172"></embed></object></html>
-Et voici le résultat :
+<html>
+<iframe src="http://player.vimeo.com/video/68180971" width="500" height="281" frameborder="0" webkitAllowFullScreen mozallowfullscreen allowFullScreen></iframe> <p><a href="http://vimeo.com/68180971">Mirage</a> from <a href="http://vimeo.com/user18872843">Iker &amp; Dana</a> on <a href="http://vimeo.com">Vimeo</a>.</p>
+</html>
-<html><object width="212" height="172"><param name="movie" value="http://www.youtube.com/v/Rgul4WAWj6w&hl=en&fs=1"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/Rgul4WAWj6w&hl=en&fs=1" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="212" height="172"></embed></object></html>