Home Forums Porto Template Youtube background video layer doesn’t work

  • This topic has 3 replies, 2 voices, and was last updated 1 week, 1 day ago by Support. This post has been viewed 57 times
Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #10031800
    magnamagna
    Participant

    Hello, I’m trying to use youtube video for slider revolution on my project… but something goes wrong: the video doesn’t play (I used the Video ID found on the official Theme Punch guide found at this address: https://www.themepunch.com/revsliderjquery-doc/background-image-video/#youtube-video-background); when I stream the video with the HTML5 method everything works fine… and also if I use the Vimeo background mode it seems to work fine…
    Do you have any advice for me to get that feature work properly?


    #10031805
    Support
    Keymaster

    Hello, here is an example for Youtube video with autoplay:

    <div class="slider-container rev_slider_wrapper">
    	<div id="revolutionSlider" class="slider rev_slider manual" data-version="5.4.8" data-plugin-revolution-slider data-plugin-options="{'delay': 9000, 'gridwidth': 500, 'gridheight': 500, 'responsiveLevels': [4096,1200,992,500]}">
    		<ul>
    			<li data-transition="fade">
    				<img src="video/landing.jpg"  
    					alt=""
    					data-bgposition="center center" 
    					data-bgfit="cover" 
    					data-bgrepeat="no-repeat" 
    					class="rev-slidebg">
    
    				<div class="tp-caption tp-resizeme tp-videolayer fullscreenvideo" 
    
    				    data-type="video" 
    				    data-start="0"
    				    data-ytid="iyuxFo-WBiU" 
    				    data-videowidth="100%" 
    				    data-videoheight="100%" 
    				    data-autoplay="on" 
    				    data-videocontrols="none" 
    				    data-nextslideatend="true" 
    				    data-forcerewind="on" 
    				    data-videoloop="loopandnoslidestop" 
    				    data-videoattributes="version=3&enablejsapi=1&html5=1&hd=1&wmode=opaque&showinfo=0&rel=0&origin=http://www.okler.net;" 
    				    data-x="center" 
    				    data-y="center" 
    				    data-hoffset="0" 
    				    data-voffset="0" 
    				    data-basealign="slide"></div>
    				
    			</li>
    		</ul>
    	</div>
    </div>

    * See the “origin” in that code and change to your domain.

    Kind Regards,

    Jonas


    #10031810
    magnamagna
    Participant

    Hi, Jonas,
    I ttried to use your code on that page, but no luck: the area still remains black and no video showing up; I changed also the domain source…
    Any chance to get that video backgroung working?
    Thanx


    #10031815
    Support
    Keymaster

    Hello, to see a functional example with a YouTube video please check this page: http://okler.net/tests/testvideoyoutube/

    It might be the domain with subdomain that is being blocked by Youtube.

    Anyway you could try in another server/domain?


Viewing 4 posts - 1 through 4 (of 4 total)