Copied to clipboard

Flag this post as spam?

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


  • Claushingebjerg 879 posts 2363 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 3255 posts 11055 karma points MVP 5x 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 879 posts 2363 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 391 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

  • Richard Hamilton 36 posts 157 karma points
    Jul 21, 2020 @ 07:55
    Richard Hamilton
    0

    Where's that config file? Its been a while since I've needed to do this

  • Jan Skovgaard 11258 posts 23498 karma points MVP 7x admin c-trib
    Jul 21, 2020 @ 08:28
    Jan Skovgaard
    0

    Hi Richard

    If your Umbraco instance is v7 then the config file should be located in the "config" folder in the root of your project. If you're using v8 then this config no longer exists. Many configs have been removed so I think you should have a look at using an "embed provider", which has been documented here https://our.umbraco.com/documentation/extending/Embedded-Media-Provider/

    Callum Whyte made a good article for Skrift about some of the differences between Umbraco 7 and 8, which might be nice for you to read if you're on v8 https://skrift.io/issues/who-moved-my-cheese/ :-)

    Hope this helps!

  • Richard Hamilton 36 posts 157 karma points
    Aug 03, 2020 @ 13:35
    Richard Hamilton
    0

    Its actually Umbraco 8 so that's why I couldn't find the config file! Thanks for the link :)

  • Travis Schoening 37 posts 161 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 13 posts 83 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