tumblr page counter

How to Embed Vine Videos Just About Anywhere

Featured on BlogHer.comI love Vine, the app that lets you make unedited, six-second, looping videos. The six-second time limit is pretty confining, but this is what makes me love it so much. It's like a personal challenge to see if I can document a whole drugstore trip that way, and you know what? I can!



The Vine app doesn't offer up ready-made embed code for you to paste your precious videos into your own site, but you can still do it.

How to embed a Vine video:
  • Tweet your video on Twitter.
  • Copy and paste the following code into your website.
  • Replace the red part of the url with the Vine url that showed up when you tweeted your video.
<p><iframe src="https://vine.co/v/bnrtW52x1uJ/card?mute=1"
width="100%" height="100%" frameborder="0"></iframe></p>

UPDATE: If your video sizing seems funky, which can happen with this code in Tumblr, iWeb, and I'm sure some other places, try specifying the height and width in pixels rather than percentages:

<p><iframe src="https://vine.co/v/bnrtW52x1uJ/card?mute=1"
width="500px" height="500px" frameborder="0"></iframe></p>

And voilà! Now you can share six seconds of your cats being really high on catnip with all of your friends.



Enjoy!
24 Comments
Subscribe by RSS or
sign up to get new content in your inbox: