I am trying to paste Vimeo's embed code to the body of an entry like this-
and instead of showing the video, I get a link to the video. Can I embed it this way by putting the code in the body field? Or do I need to use a plugin such as Embedder?
2 Answers
I had this exact same issue on a recent project and found adding the "raw" filter to my field code was necessary to make some embeds work. So instead of this:
{{ entry.videoFieldName }}
This:
{{ entry.videoFieldName | raw }}
That prevents Twig from trying to escape any of the characters in your embed code, which will break Vimeo embeds. This is assuming you're just wanting to paste the plain text embed code into a plain text field or Matrix block.
-
1
I am assuming you're using a rich text field?
If that's the case, Redactor (the library that powers rich text editing in Craft) has a video embed plugin: https://imperavi.com/redactor/plugins/video/
To install Redactor plugins in Craft, see this post to get you started: Install Redactor plugin
However this kind of content complexity was really what the Matrix field type was made for. Mixing text and media elements in a single field can get quite cumbersome. This video should help you understand how you can implement mixing text and embedded video the "Craft" way: https://craftcms.com/features/matrix
-
Thanks, so with Matrix I can add a block and be able to embed my Vimeo code in that? Commented Jan 21, 2016 at 4:12
-
One way you could do it is create a Video block type, which has a field where you can paste in the link to the video. Then use the Embedder plugin to transform that link to an embed code in the template. Commented Jan 21, 2016 at 4:25
-
1Another would be to use (shameless plug to my own plugin) Embedded Assets if you're reusing embedded videos a lot. There's a million other ways you can do it, which is a testament to the power of Craft. Commented Jan 21, 2016 at 4:27
-
Can you provide an example of how to use it in a template? <div class="mainvideo"> {% for asset in assets %} <img src="{{ asset.url }}"> {% set embed = craft.embeddedAssets.fromAsset(asset) %} {% if embed %} {{ embed.safeHtml }} {% endif %} {% endfor %} </div> Commented Jan 31, 2016 at 14:34
-
That code should be pretty much it! All you need to do is create an asset field inside your video matrix block, maybe limit it to one asset (and if you want to only allow embedded assets, limit the filetype to JSON), then in your template:
<div class="mainvideo"> {% set asset = block.assetField.first %} {% set video = craft.embeddedAssets.fromAsset(asset) %} {% if video %} {{ embed.safeHtml }} {% endif %} </div>Commented Feb 1, 2016 at 3:51