Docs

[Noellemena]

Ok, I am over at http://thecreativesclassroom.com/ and I am using a .mp4 video on the home page over the masthead all set from within the Home page itself. (Not Cornerstone) I have watched the Slider Video here in the knowledge base but it is out of date. https://community.theme.co/kb/sliders/

First- There are no choices for any “pre-made” sliders as shown in the video above. Sliders for “video” or “off set” etc. So I realized I must have to create some of my own. But I want to use my own video which is working fine. (Note it is a temp one as it is long)

Anyway 🙂 I created a slide to go with this slider (called slide1) on the home page. So it has the transparent first slide the video can play no problem. BUT, it will not go to the next slide with the words, instead it keeps playing the video on loop. I tried some code from the forum that was given for not looping but it is not working either. It is here, but I thought it was weird code:

}
jQuery( function($) {

$( ‘#big-video-wrap video’ ).prop(‘loop’, false);

} );

So! I want my video to play one time and I want it to have the screenshot slide at the end that has the text come up… Bringing Your Classroom to Your Site.

Of course this is the set up on Ethos 3 demo as well except the words are there the whole time. I would take that too if there were an updated tutorial. I know Themepunch is where to go for their templates etc, but using a single, self hosted video url is an X feature so I would love to see this updated to be so much easier to replicate 🙂

Thank you! Login below.

[Noellemena]

This reply has been marked as private.

[Rupok]

Hi Noelle,

Thanks for updating. You can add this under Custom > JavaScript in the Customizer.

jQuery (function($) {

$(document).ready( function() {$('video').prop('loop', false); } );

} );

For more help, kindly follow Revolution Slider Documentation .

Cheers!

[Noellemena]

Thank you for the JavaScript, but referring me to the revolution documentation is redundant and out of date. I had said that above. My question is in using the video feature that is through X, as said in the video link above. So my questions are pertaining to that integration. Not revolution slider as a whole. Can you please read again and advise?? I see so many in this forum that are basically asking this same thing and always get the answer to go to documentation. But in this case it is not there. No one seems to get an answer that clarifies. Help! 🙂

[Rupok]

Hi Noelle,

I can only see a Revolution Slider on your page with video background so not sure what you are referring by “video feature that is through X”. Are you using Video element or Video Emebed which are actually offered by X? If yes then kindly point us them. If you are using the Revolution Slider (that I can see) then you should follow their documentation first and certainly it’s updated. If you find anything that’s not working as expected then let us know so that we could assist you on this.

Hope this makes sense.

Cheers!

[Noellemena]

Hey! I did a quick screen cast to help with this. Thank you so much, here is the link:
http://noellemena.evsuite.com/xhelpme-yay/

And in the video I also bring up my course being full width, here is a direct link to it once you are logged in:
http://thecreativesclassroom.com/courses/using-picmonkey/

Login is already above 🙂
THANK YOU SO MUCH !!!
Noelle

[Christian]

Hey Noelle,

The video background was designed to loop as its purpose is for decoration. We’re sorry but there is no option to stop it or it would require custom development which falls outside the scope of our support.

Please add a text layer to your first slide of your slide1 slider. Your Slider Above Masthead setup is correct. What you will need to know now is how to use or setup Slider Revolution to have text or any layer animate on top of the video background. Please see https://www.themepunch.com/faq/slider-revolution-beginner-video-guides-tutorials/ for Slider Revolution tutorials. Regretfully, we could not provide step by step instruction on how to replicate the sliders in our demo.

For your course to become fullwidth, please add the code below in your Appearance > Customize > Custom > CSS

.single-sfwd-courses .x-sidebar {
    display: none;
}

.single-sfwd-courses .x-main {
    width: 100%;
}

Hope that helps. 🙂

[Author]

Posts