Why cant Vimeo be used with {{ page.vimeo }}?

Help
1

hello all,

first time messaging. been using Jekyll for a good many years, but im running into a weird error & bug with using Vimeo videos from pages

I do have a main page I use as my layout, for well, my pages.
with that page [page] I do use check for videos etc, even links as well. youtube works completely fine, but Vimeo errors out & does not allow the same thing.

this would be the kind of code I would use, the same with youtube as well

<div class="video">
  <iframe src="https://player.vimeo.com/video/{{ page.vimeo }}" width="640" height="400" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>
</div>

then within a page, say for animations or a game. I would use at the top, next to the title etc vimeo: numberOfTheVideo

again, whilst this works perfectly with youtube, Vimeo spits out a 404

19
Screen Shot 2019-03-06 at 10.54.19.png1032×120 7.59 KB

16
Screen Shot 2019-03-06 at 10.54.16.png1430×896 16.9 KB

im just wondering if anyone else has worked with Vimeo like this & knows of a possible fix?

when I put the number in the iframe, its all fine. but if I have multiple videos & different projects, I just want to keep it tidy

thanks & all the best

2

I would start with a comparison between the value of vimeo: xxxxxx in your page’s front matter and what is actually generated in the HTML after Jekyll does its thing.

Only thing I can think of is there’s some sort of encoding issue, but not sure why that would be. You have an example of what your YAML front matter looks like and what the outputted HTML of <iframe src="https://player.vimeo.com/video/{{ page.vimeo }}"> is?

3

this is what I do:

in _includes/vimeo.html

<div class="videoContainer">
    <iframe title="{{ include.id }}" src="https://player.vimeo.com/video/{{ include.id }}?title=0&byline=0&portrait=0" class="video" allowfullscreen></iframe>
</div>

in my posts:

{% include vimeo.html id=“XXXXXXXX” %}

example: