Search code examples
htmltumblr

Tumblr {Video-700} and {VideoEmbed-700} variables


I am experiencing a weird issue with {VideoEmbed-_} tags. The tumblr theme documentation (I would link it, but I don't have enough rep to post more than 2 links) defines {VideoEmbed-700} as

Same as {Video-700}, but removes the lightbox effect from directly uploaded video. 700-pixels wide.

However, when I use {VideoEmbed-700}, all videos that uploaded to 3rd party video sites (instead of directly uploaded to Tumblr) do not display at all.

Here is an example using a Dailymotion video, and here is an example using a video uploaded to Tumblr. As you can see, the tumblr-uploaded video works fine, and the dailymotion video is not generated.

I tried using a few sizes ({VideoEmbed-700}, {VideoEmbed-500}, etc) and they all produce the same results.

I'd prefer to not have the lightbox, and also I made the videos fluid width and the lightbox breaks that when you open and close it. So, I'm pretty determined on making {VideoEmbed-_} work.

Has anyone else experienced this? Any comments or suggestions are welcome. Thanks!


Solution

  • The only solution that I've found so far is to include both of them on the page:

    {VideoEmbed-400}
    {Video-400}
    

    ...and then hide the lightboxed version with

    .type-video .has_lightbox, .type-video .tumblr_video_container {
      /* Remove Tumblr video that has a lightbox enabled */
      display: none!important;
      visibility: hidden!important;
    }
    

    Note that in this case the Video post type has a class of .type-video on it.