Support » Plugin: mb.YTPlayer for background videos » Contain Video

Viewing 5 replies - 1 through 5 (of 5 total)
  • Plugin Author pupunzi

    (@pupunzi)

    Hi,
    Your page and the one you are taking as example are behaving the same; the difference is that here: http://www.icanpt.com all the content in the sections under the one where the video is visible have a white background.

    Solution 1
    So, if you want the same effect of the site you are looking as example you should work on the CSS to give each sections a white background.

    Here is a demo page I set up where All the content below the first section is wrapped inside a DIV with a white background:

    http://pupunzi.open-lab.com/test/bg_video_1.html

    Solution 2
    if you want a top section containing the video you should create a section, give it the height you want for the video and paste inside this code using the editor in text mode:

    <div id="bgndVideo_section" data-property="{videoURL:'https://www.youtube.com/watch?v=JMhkAwIwyqI', opacity:.5, autoPlay:true, containment:'#bgVideo-section', startAt:1, stopAt:0, mute:true, vol:50, optimizeDisplay:true, showControls:false, printUrl:false, loop:true, addRaster:false, quality:'default', ratio:'16/9', realfullscreen:'false', gaTrack:'true', stopMovieOnBlur:'false'}" class="mbYTPMovie" ></div>

    You should also disable the background video from the YTPlayer settings page.

    Here is an example that shows how this solution works:

    http://pupunzi.open-lab.com/test/bg_video_2.html

    Hope this can help,
    Matteo

    Thread Starter pilatesyogacoach

    (@pilatesyogacoach)

    Big, big thank you.

    Your second solution is just what I’m after. I’ll try this now.

    Hugely appreciated.

    Thread Starter pilatesyogacoach

    (@pilatesyogacoach)

    Hi there,

    Disabled the background video from the YTPlayer settings page. But still can’t seem to recreate what you did in solution 2.

    I’ve tried pasting the code in both the wordpress classic text editor and visual composer (inside both a text block and video element) but nothing shows up. Really frustrating as I can see your example!

    Any guesses on what I’m doing wrong?

    Really appreciate you taking the time to answer.

    Thanks, man.

    Plugin Author pupunzi

    (@pupunzi)

    In the code I gave you there was a misspelled ID name. The below code should work:

    <div id="bgndVideo_section" class="mbYTPMovie" style="width: 100%; height: 350px; background-color: #444;" data-property="{videoURL:'https://www.youtube.com/watch?v=JMhkAwIwyqI', opacity:.5, autoPlay:true, containment:'#bgndVideo_section', startAt:1, stopAt:0, mute:true, vol:50, optimizeDisplay:true, showControls:false, printUrl:false, loop:true, addRaster:false, quality:'default', ratio:'16/9', realfullscreen:'false', gaTrack:'true', stopMovieOnBlur:'false'}"></div>

    Thread Starter pilatesyogacoach

    (@pilatesyogacoach)

    Thank you – really appreciate your help. Solved.

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘Contain Video’ is closed to new replies.