0

If one shares a YouTube video in a post on a website (Facebook etc.) that shows a video player where you can press "Play", a still image is already showing. How is this image chosen from the video? Is it possible to determine the time of the still image yourself?

Edit

I mean the case of a YouTube video you did not upload yourself.

1

Yes, it is possible. After you upload/submit the video you can choose autogenerated thumbnail images for your video:

0


or you can set your own image after your account gets verified:

0


The verification process looks like this:

0


If the video is not yours you can still do it by editing the embed code - for example:

official embed code:

<iframe width="560" height="315" 
 src="https://www.youtube.com/embed/im-JM0f_J7s" 
 frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; 
 picture-in-picture" allowfullscreen></iframe>

workaround solution:

<div onclick="this.nextElementSibling.style.display='block'; this.style.display='none'">
   <img src="https://i.imgur.com/wEEFvCB.png" style="cursor:pointer" />
</div>
<div style="display:none">

    paste embed code here

</div>

You can try it yourself here: https://www.w3schools.com/html/tryit

Or something more advanced like:

<div width="560px" height="315px" style="position: static; clear: both; 
 width: 560px; height: 315px;">&nbsp;
<div style="position: relative">
<img id="vidimg" width="560px" height="315px" 
 src="https://i.imgur.com/wEEFvCB.png" style="position: absolute; 
 top: 0; left: 0; cursor: pointer; pointer-events: none; z-index: 2;" />

<iframe id="unlocked-video" style="position: absolute; top: 0; left: 0; z-index: 1;" 
 src="https://www.youtube.com/embed/im-JM0f_J7s" width="560" height="315" frameborder="0" 
 allowfullscreen="allowfullscreen"></iframe>

</div>
</div>
<script type="application/javascript">
  var monitor = setInterval(function(){
    var elem = document.activeElement;
    if(elem && elem.id == 'unlocked-video'){
      document.getElementById('vidimg').style.display='none';
      clearInterval(monitor);
    }
  }, 100);
</script>

0

  • Thank you for this information. This is in the case of a video you uploaded yourself. I meant the case of a video you did not upload yourself (changed in question). – Karlo Jul 13 at 12:45
  • @Karlo answer updated – user0 Jul 13 at 13:26
  • This code enables to use an arbitrary picture as thumbnail. - Would it be possible to indicate the time of the video at which is should take the thumbnail? - Can one embed html in a Facebook (or other) post? – Karlo Jul 16 at 8:57
  • 1
    @Karlo no, but you can always take a screenshot of the desired frame of the video and place it in the embed code – user0 Jul 16 at 10:54

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.