Trouble embedding Vimeo videos

  • markelh

    (@markelh)


    10 years, 12 months ago

    Hi – my web admin recently migrated me to a new WordPress theme, and we started having issues embedding Vimeo videos. This is a hosted site, and we have tried both iFrame code, and two different plugins that allow you to use code like [vimeo 123xxx] or same code but select the size you want to display. All to no avail.

    In Google Chrome, the video is HUGE. In Explorer, it is tiny….what am I doing wrong?

    http://www.thebullbustercafe.com

    Thanks!

Viewing 2 replies - 1 through 2 (of 2 total)
  • Pioneer Web Design

    (@swansonphotos)

    10 years, 12 months ago

    Opinion: If you have a web admin and this is an issue, consider a new one:

    http://jobs.wordpress.net/

    tiaanswart

    (@tiaanswart)

    10 years, 12 months ago

    Drop this little snippet in your html head section:

    <script type="text/javascript">
    $(function() {

        var $allFigures = $("iframe[src^='http://player.vimeo']"),
                $fluidEl = $("figure");

        $allFigures.each(function() {

            $(this)
            // jQuery .data does not work on object/embed elements
        	        .attr('data-aspectRatio', this.height / this.width)
        	        .removeAttr('height')
        	        .removeAttr('width');

        });

        $(window).resize(function() {

            var newWidth = $fluidEl.width();
            $allFigures.each(function() {

                var $el = $(this);
                $el
        	            .width(newWidth)
        	            .height(newWidth * $el.attr('data-aspectRatio'));

            });

        }).resize();

    });
</script>

    and embed the vimeo video using the following format:

    <div>
    <figure>
        <iframe width="1600" height="900" src="http://player.vimeo.com/video/#YOUR-VIMEO-ID-HERE"></iframe>
    </figure>
</div>
Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘Trouble embedding Vimeo videos’ is closed to new replies.