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

Elan Morgan

Elan Morgan is a blogger, designer and consultant, and speaker who blogs and works from schmutzie.com, spreads gratitude through the graceinsmallthings.com social network, celebrates quality blogging with the canblogawards.com, and speaks all over. She has been seen in the Globe & Mail, Best Health and Woman's Day magazines, TEDxRegina, and on CBC News and Radio. She believes in and works to grow both personal and professional quality, genuine community, and meaningful content online.

Subscribe by RSS or
sign up to get new content in your inbox: