Copied to clipboard

Flag this post as spam?

This post will be reported to the moderators as potential spam to be looked at


  • Claushingebjerg 844 posts 2220 karma points
    Dec 09, 2014 @ 16:32
    Claushingebjerg
    0

    Responsive Video using built in embed

    Im using the fitvids javascript to make embedded videos responsive.

    Is there a simple way to wrap a video from the built in embedder in a div, so i can target it with fitvids?

    Either in embeddedmedia.config or tinyMceConfig.config?

  • Dave Woestenborghs 3215 posts 10807 karma points MVP 4x admin c-trib
    Dec 09, 2014 @ 16:38
    Dave Woestenborghs
    0

    Don't think so. But you can create your own oEmbed provider that wraps the output in a div.

    Here is the source code for the default video embed : https://github.com/umbraco/Umbraco-CMS/blob/7.2.1/src/Umbraco.Web/Media/EmbedProviders/OEmbedVideo.cs

    Just wrap the output in a div. Don't forget to update the embeddedmedia.config

    dave

  • Claushingebjerg 844 posts 2220 karma points
    Dec 10, 2014 @ 08:42
    Claushingebjerg
    103

    Well, i have the bad excuse of being a front ender, so im going for a client side solution.

    $( ".content iframe" ).wrap( "<div class='videowrapper'></div>" );

    Seems to work fine

  • MrFlo 148 posts 390 karma points
    Apr 25, 2017 @ 12:30
    MrFlo
    2

    I found this while googling so I will add the backend code.

    Create a class in your project:

    using System.Xml;
    using Umbraco.Web.Media.EmbedProviders;
    
    namespace ClassicCarPassion.EmbedProviders
    {
        public class OEmbedVideo : AbstractOEmbedProvider
        {
            public override string GetMarkup(string url, int maxWidth, int maxHeight)
            {
                string requestUrl = BuildFullUrl(url, maxWidth, maxHeight);
    
                XmlDocument doc = GetXmlResponse(requestUrl);
                return "<div class=\"videowrapper\">" + GetXmlProperty(doc, "/oembed/html")+"</div>";
            }
        }
    }
    

    Change the config:

    <!-- Youtube Settings -->
      <provider name="Youtube" type="ClassicCarPassion.EmbedProviders.OEmbedVideo, ClassicCarPassion">
        <urlShemeRegex><![CDATA[youtu(?:\.be|be\.com)/(?:(.*)v(/|=)|(.*/)?)([a-zA-Z0-9-_]+)]]></urlShemeRegex>
        <apiEndpoint><![CDATA[https://www.youtube.com/oembed]]></apiEndpoint>
        <requestParams type="Umbraco.Web.Media.EmbedProviders.Settings.Dictionary, umbraco">
          <param name="iframe">1</param>
          <param name="format">xml</param>
          <param name="scheme">https</param>
        </requestParams>
      </provider>
    

    You might have to change the setting for all video providers

  • Travis Schoening 35 posts 158 karma points
    Jun 29, 2017 @ 00:23
    Travis Schoening
    0

    I'm trying to implement this, and I'm getting the error "Could not embed media - please ensure the URL is valid". Anyone try to do the same thing but get that result and figure out how to correctly use it?

    I'm using 7.6.3.

    Thanks!

  • Eric Wilkinson 12 posts 82 karma points
    Oct 15, 2019 @ 13:30
    Eric Wilkinson
    0

    It sounds like your youtube video URL didn't pass the validation that is defined in the urlSchemeRegex.

Please Sign in or register to post replies

Write your reply to:

Draft