My client is trying to embed a Vimeo video in Composite page, but gets errors. Is there a function (similar to YouTube function) for Vimeo? If not, any tips on how to get the embed code to work properly?
Here's the site, however, the error has been removed and replaced with a simple link to the video: http://www.tennantbiomodulator.ca/Canadian-Disbtributor/Training
Thanks,
Troy Assaly
Comments: ** Comment from web user: mawtex **
I'm guessing you experience the issue when pasting in Vimeo's share <iframe />. The issue here is that Composite C1 require strict markup (xhtml5) while Vimeo's suggestion is not strictly formatted.
The fix is to make standalone attributes have a value - here is a before and after example:
```
<iframe src="//player.vimeo.com/video/53540343" width="500" height="375" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>
```
```
<iframe src="//player.vimeo.com/video/53540343" width="500" height="375" frameborder="0" webkitallowfullscreen="webkitallowfullscreen" mozallowfullscreen="mozallowfullscreen" allowfullscreen="allowfullscreen"></iframe>
```
You can create a new function like the YouTube player function - called Composite.Media.Vimeo - if you create a new file ~/App_Data/Razor/Composite/Media/Vimeo.cshtml and paste in the code below:
Also, note that the video has not been harked "allow for sharing" so you would need to allow this on Vimeo for embedding to fully work.
```
@inherits RazorFunction
@using System.Text.RegularExpressions
@functions {
public override string FunctionDescription
{
get { return "Plays a Vimeo video"; }
}
[FunctionParameter(Label = "Vimeo URL", Help = "The URL to the video on Vimeo, like http://vimeo.com/15195655")]
public string VimeoURL { get; set; }
}
@{
string pattern = @"vimeo\.com/(?:.*#|.*/videos/)?([0-9]+)";
if (!Regex.IsMatch(VimeoURL, pattern))
{
<div class="alert alert-danger">Wrong Vimeo URL.</div>
return;
}
var match = Regex.Match(VimeoURL, pattern);
}
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:f="http://www.composite.net/ns/function/1.0">
<head>
</head>
<body>
<iframe src="//player.vimeo.com/video/@(match.Groups[1].Value)" width="500" height="375" frameborder="0" webkitallowfullscreen="webkitallowfullscreen" mozallowfullscreen="mozallowfullscreen" allowfullscreen="allowfullscreen"></iframe>
</body>
</html>
```