MOD Ajouter vidéo

Un site utilisant WordPress

MOD Ajouter vidéo

Aujourd’hui, un MOD* pour ajouter une vidéo en fond de page (background) précisément sur la page de « login » de WordPress.
La vidéo provient de Youtude et je la veut en lecture pleine page, lancement immédiat et répété !

Impossible de trouver un plugin qui permette cela ou du moins, je n’en n’ai pas trouvé !
Alors je vous propose un petit module pour modifier un fichier d’origine.

Oui je sais, ce n’est pas bien de faire cela car après le fichier n’est plus considéré comme étant d’origine et on perd les modification à chaque nouvelle version… Mais je n’ai pas trouvé mieux pour le moment.

Donc nous allons modifier le fichier ./wp-login.php

Dans ce fichier, repérez la ligne :

</head>

Ajouter :

<?php
/*
* With many help of :
* - https://www.labnol.org/internet/embed-mute-youtube-video/29149/
* - https://stackoverflow.com/questions/19410789/youtube-player-api-with-loop
* - https://developers.google.com/youtube/iframe_api_reference#Functions
* - https://developers.google.com/youtube/player_parameters#showinfo
*/
?>


<!-- 1. The <iframe> (and video player) will replace this <div> tag. -->
<div id="player" style="position: fixed; z-index: -99; width: 100%; height: 100%"></div>

<script>
  // 2. This code loads the IFrame Player API code asynchronously.
  var tag = document.createElement('script');

  tag.src = "https://www.youtube.com/iframe_api";
  var firstScriptTag = document.getElementsByTagName('script')[0];
  firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);

  // 3. This function creates an <iframe> (and YouTube player)
  //    after the API code downloads.
  var player;
  function onYouTubeIframeAPIReady() {
    player = new YT.Player('player', {
        videoId: 'Yus9j-Ulvcs',
        playerVars: {
            'autoplay': 1,
            'controls': 0,
            'showinfo' : 0,
            'playlist' : 'Yus9j-Ulvcs',
            'loop' : 1,
            },
        events: {
            'onReady': onPlayerReady
            }
        });
      }

  // 4. The API will call this function when the video player is ready.
  function onPlayerReady(event) {
    event.target.mute();
  }
</script>

Notez que j’ai mentionné mes sources notement pour la lecture automatique et répété d’une seule vidéo en mode automatique ! => Il fallait créer une playlist avec deux fois la même vidéo dedans…

Recherchez :

	<div id="login">
						 
		<h1><a href="<?php echo esc_url( $login_header_url ); ?>"><?php echo $login_header_text; ?></a></h1>

Remplacer par :

<div id="login">
    <div id="sub_panel">
        <h1><a href="<?php echo esc_url( $login_header_url ); ?>"><?php echo $login_header_text; ?></a></h1>

Notez l’ajout d’une balise DIV

Recherchez :

	</div><?php // End of <div id="login"> ?>

Remplacer par :

	</div>
	    </div>
	<?php // End of <div id="login"> ?>

Notez la fermeture de la précédente balise DIV que j’avais ajouter.

Voilà, c’est tout.

Tags: , ,

Laisser un commentaire

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *