Embedding videos only working for youtube?

Collapse
X
 
  • Time
  • Show
Clear All
new posts
  • glennrocksvb
    Former vBulletin Developer
    • Mar 2011
    • 4011
    • 5.7.X

    #16
    It should use the iframe embed code (which uses HTML5) found in vimeo.com

    HTML Code:
    <iframe src="https://player.vimeo.com/video/14240735?autoplay=1" width="640" height="360" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>
    Last edited by glennrocksvb; Tue 23 May '17, 5:32pm.

    Flag Icon Postbit Insert GIPHY Impersonate User BETTER INITIALS AVATAR Better Name Card Quote Selected Text Bookmark Posts Post Footer Translate Stop Links in Posts +MORE!

    Comment


    • glennrocksvb
      glennrocksvb commented
      Editing a comment
      I checked the bbcode_template and Hulu, DailyMotion, Metacafe and Google videos are also using Flash. These need to be updated too.

    • glennrocksvb
      glennrocksvb commented
      Editing a comment
      Posted complete solution here.
  • Peter Walker
    Member
    • Oct 2005
    • 67
    • 3.8.x

    #17
    I needed this function with vB 4.2.5 and it was not working properly. I saw the solution on vbmods.rocks, but that had issues as well. After a lot of experimenting, I now have a system that works well with YouTube, Vimeo, DailyMotion and Facebook.

    Note: Although listed in the box, videos from Hulu, Metacafe and Google are not supported as Hulu is subscription only, Metacafe cannot embed videos on secure websites and the Google Video service has closed down.

    Here is my code, that completely replaces the code in the bbcode_video template. This should work in vB5 as well. (Mod edit: It will not work for VB5)

    In AdminCP, go to Styles & Templates, Style Manager. For each style. select Edit Templates in the drop down menu and click on Go.
    Find "BB Code Layout Templates" and double-click.
    Find bbcode_video and double-click.

    Replace the entire template with the following:

    Code:
    <vb:if condition="$provider == 'hulu'">
    <object class="restrain" type="application/x-shockwave-flash" width="512" height="296" data="//www.hulu.com/embed/{vb:raw code}">
        <param name="movie" value="//www.hulu.com/embed/{vb:raw code}" />
        <param name="wmode" value="{vb:raw wmode}" />
        <!--[if IE 6]>
        <embed width="512" height="296" type="application/x-shockwave-flash" src="//www.hulu.com/embed/{vb:raw code}" />
        <![endif]--></object>
    
    <vb:elseif condition="$provider == 'youtube'" />
        <iframe class="restrain" title="YouTube video player" width="<vb:if condition="isset($width) AND $width > 0">{vb:raw width}<vb:else />640</vb:if>" height="<vb:if condition="$height">{vb:raw height}<vb:else />390</vb:if>" src="https://www.youtube.com/embed/{vb:raw code}?wmode={vb:raw vboptions.player_wmode}&autoplay=0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>
        <vb:elseif condition="$provider == 'youtube_share'" />
        <iframe class="restrain" title="YouTube video player" width="<vb:if condition="isset($width) AND $width > 0">{vb:raw width}<vb:else />640</vb:if>" height="<vb:if condition="$height">{vb:raw height}<vb:else />390</vb:if>" src="https://www.youtube.com/embed/{vb:raw code}?wmode={vb:raw vboptions.player_wmode}&autoplay=0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>
    
    <vb:elseif condition="$provider == 'vimeo'" />
    <iframe src="https://player.vimeo.com/video/{vb:raw code}?autoplay=0" width="<vb:if condition="isset($width) AND $width > 0">{vb:raw width}<vb:else />640</vb:if>" height="<vb:if condition="$height">{vb:raw height}<vb:else />360</vb:if>" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>
    
    <vb:elseif condition="$provider == 'dailymotion'" />
    <iframe src="//www.dailymotion.com/embed/video/{vb:raw code}?autoplay=0" frameborder="0" width="<vb:if condition="isset($width) AND $width > 0">{vb:raw width}<vb:else />640</vb:if>" height="<vb:if condition="$height">{vb:raw height}<vb:else />360</vb:if>" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>
    
    <vb:elseif condition="$provider == 'metacafe'" />
    <iframe src="https://www.metacafe.com/embed/{vb:raw code}" width="<vb:if condition="isset($width) AND $width > 0">{vb:raw width}<vb:else />560</vb:if>" height="<vb:if condition="$height">{vb:raw height}<vb:else />315</vb:if>" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>
    
    <vb:elseif condition="$provider == 'facebook'" />
    <div    class="fb-video"
            data-href="https://www.facebook.com/facebook/videos/{vb:raw code}/"
            data-width="<vb:if condition="isset($width) AND $width > 0">{vb:raw width}<vb:else />576</vb:if>"
            data-show-text="false"
            data-allowfullscreen="true"
            data-autoplay="false"
            data-show-captions="true">
    </div>
    
    <vb:elseif condition="$provider == 'facebook_share'" />
    <div    class="fb-video"
            data-href="https://www.facebook.com/facebook/videos/{vb:raw code}/"
            data-width="<vb:if condition="isset($width) AND $width > 0">{vb:raw width}<vb:else />640</vb:if>"
            data-show-text="false"
            data-allowfullscreen="true"
            data-autoplay="false"
            data-show-captions="true">
    </div>
    
    </vb:if>
    Save the Template. That's all.

    When writing posts, simply click on the video icon and post the url in the box and click OK.
    For Facebook videos (must be public), right click over the video, select "Show video URL." click on displayed link and copy it. Paste link into video box.

    As of December 7, 2017 - this is working correctly, including on Chrome.
    Last edited by BirdOPrey5; Thu 7 Dec '17, 8:41am.
    Regards

    Peter Walker
    http://www.rifeforum.com

    Comment

    • Mark.B
      vBulletin Support
      • Feb 2004
      • 24286
      • 6.0.X

      #18
      That won't work with vB5 at all. The templates are completely different.

      Anyone trying to use that on vB5 will break their site completely.
      MARK.B
      vBulletin Support
      ------------
      My Unofficial vBulletin 6.0.0 Demo: https://www.talknewsuk.com
      My Unofficial vBulletin Cloud Demo: https://www.adminammo.com

      Comment

      • Peter Walker
        Member
        • Oct 2005
        • 67
        • 3.8.x

        #19
        Hi Mark,
        I checked out the current code version of bbcode_video in vB 5.3.4 and found that Vimeo and DailyMotion does not work, yet YouTube and Facebook, does.

        I have adjusted my script for vB 5.3.4 and this works with all four video formats:

        Code:
        <vb:if condition="$provider == 'hulu'">
        <object class="restrain" type="application/x-shockwave-flash" width="512" height="296" data="//www.hulu.com/embed/{vb:raw code}">
            <param name="movie" value="//www.hulu.com/embed/{vb:raw code}" />
            <param name="wmode" value="{vb:raw wmode}" />
            <!--[if IE 6]>
            <embed width="512" height="296" type="application/x-shockwave-flash" src="//www.hulu.com/embed/{vb:raw code}" />
            <![endif]--></object>
        
        <vb:elseif condition="$provider == 'youtube'" />
            <iframe class="restrain" title="YouTube video player" width="<vb:if condition="isset($width) AND $width > 0">{vb:raw width}<vb:else />640</vb:if>" height="<vb:if condition="$height">{vb:raw height}<vb:else />390</vb:if>" src="https://www.youtube.com/embed/{vb:raw code}?wmode={vb:raw vboptions.player_wmode}&autoplay=0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>
            <vb:elseif condition="$provider == 'youtube_share'" />
            <iframe class="restrain" title="YouTube video player" width="<vb:if condition="isset($width) AND $width > 0">{vb:raw width}<vb:else />640</vb:if>" height="<vb:if condition="$height">{vb:raw height}<vb:else />390</vb:if>" src="https://www.youtube.com/embed/{vb:raw code}?wmode={vb:raw vboptions.player_wmode}&autoplay=0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>
        
        <vb:elseif condition="$provider == 'vimeo'" />
        <iframe src="https://player.vimeo.com/video/{vb:raw code}?autoplay=0" width="<vb:if condition="isset($width) AND $width > 0">{vb:raw width}<vb:else />640</vb:if>" height="<vb:if condition="$height">{vb:raw height}<vb:else />360</vb:if>" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>
        
        <vb:elseif condition="$provider == 'dailymotion'" />
        <iframe src="//www.dailymotion.com/embed/video/{vb:raw code}?autoplay=0" frameborder="0" width="<vb:if condition="isset($width) AND $width > 0">{vb:raw width}<vb:else />640</vb:if>" height="<vb:if condition="$height">{vb:raw height}<vb:else />360</vb:if>" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>
        
        <vb:elseif condition="$provider == 'metacafe'" />
        <iframe src="https://www.metacafe.com/embed/{vb:raw code}" width="<vb:if condition="isset($width) AND $width > 0">{vb:raw width}<vb:else />560</vb:if>" height="<vb:if condition="$height">{vb:raw height}<vb:else />315</vb:if>" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>
        
        <vb:elseif condition="$provider == 'facebook'" />
        <iframe src="https://www.facebook.com/video/embed?video_id={vb:raw code}" width="<vb:if condition="isset($width) AND $width > 0">{vb:raw width}<vb:else />576</vb:if>" height="<vb:if condition="$height">{vb:raw height}<vb:else />432</vb:if>" frameborder="0" allowFullScreen></iframe>
        
        <vb:elseif condition="$provider == 'facebook_2017'" />
        <iframe src="https://www.facebook.com/plugins/video.php?href=https%3A%2F%2Fwww.facebook.com%2F{vb:urlencode {vb:raw code}}&show_text=0" width="<vb:if condition="isset($width) AND $width > 0">{vb:raw width}<vb:else />576</vb:if>" height="<vb:if condition="$height">{vb:raw height}<vb:else />432</vb:if>" frameborder="0" allowFullScreen></iframe>
        
        </vb:if>
        Regards

        Peter Walker
        http://www.rifeforum.com

        Comment

        • Wayne Luke
          vBulletin Technical Support Lead
          • Aug 2000
          • 73981

          #20
          It would seem your template is out of date then. We have added Google Video embeds and those aren't in your template. All providers should work with the default template provided in vBulletin 5.3.4.
          Translations provided by Google.

          Wayne Luke
          The Rabid Badger - a vBulletin Cloud demonstration site.
          vBulletin 5 API

          Comment

          • Peter Walker
            Member
            • Oct 2005
            • 67
            • 3.8.x

            #21
            Originally posted by Wayne Luke
            It would seem your template is out of date then. We have added Google Video embeds and those aren't in your template. All providers should work with the default template provided in vBulletin 5.3.4.
            I have taken out Google Video because Google Video closed down a long time ago. In fact, Hulu should be removed as well as such links will only work for Hulu subscribers. MetaCafe will only work on websites that DO NOT use SSL (my forum uses SSL, and I could not get it to work). As those two services still exist, I left them in - Google Video is definitely gone and there is no reason to leave support for it in the script.

            I tested the video function on my own vB 3.5.4 implementation, but I will apply my test videos here as well. These all work with my script, let us see if they work here:

            YouTube:




            Vimeo:




            DailyMotion:




            Facebook: On Facebook, right click over the video (must be public), select "Show video URL." click on displayed link and copy it. Paste link into video box.




            They do appear to be working on this forum, although the video size for Daily Motion does not match the others. So this means that people should check it all works before making any changes.

            My VB 4.2.5 script certainly fixes the broken scripts, there.
            Last edited by Peter Walker; Thu 7 Dec '17, 11:47am.
            Regards

            Peter Walker
            http://www.rifeforum.com

            Comment


            • BirdOPrey5
              BirdOPrey5 commented
              Editing a comment
              Great videos. A+.
          • Mark.B
            vBulletin Support
            • Feb 2004
            • 24286
            • 6.0.X

            #22
            The reason things like this are partially broken in vB4, is because there is no longer any development being done on vB4. Whilst we still support it to the best extent we can, it is obsolete from a development perspective.
            MARK.B
            vBulletin Support
            ------------
            My Unofficial vBulletin 6.0.0 Demo: https://www.talknewsuk.com
            My Unofficial vBulletin Cloud Demo: https://www.adminammo.com

            Comment

            • Wayne Luke
              vBulletin Technical Support Lead
              • Aug 2000
              • 73981

              #23
              Originally posted by Peter Walker
              My VB 4.2.5 script certainly fixes the broken scripts, there.
              You're posting in a vBulletin 5 forum. We will only discuss vBulletin 5 here.

              Translations provided by Google.

              Wayne Luke
              The Rabid Badger - a vBulletin Cloud demonstration site.
              vBulletin 5 API

              Comment

              Related Topics

              Collapse

              Working...