Add a video on landing page as a background. Video will be displayed in background if user screen is larger than 1000px in width.
Caution
Slower internet may face slow video, suggest you to use small video like around 1mb....
v1.1
*fixed height of signup form (choppy or half form displayed fixed)
Go to configure/settings of the component:
CUSTOMS CSS/JS
Copy paste this and change to your colours:
body {
background:#ADD8E6;
color: #0c0c0d; }
body.wpex-is-mobile-device .vc_video-bg,
body.wpex-is-mobile-device .wpex-video-bg-wrap {
display: block;
}
body {
background: url("http://talktoai.online/talktoai.gif") no-repeat;
background-size: cover;
}
.ossn-layout-startup {
background: none !important;
}
It works nice see my site https://talktoai.online works well with the fakebook theme my fav theme. The mobile view video background should not be that difficult to fix?
Snippets: Display Self-hosted Video Backgrounds for Mobile Devices
Important: This snippet is no longer needed! Videos will now display always by default?
This snippet allows you to display the video backgrounds on mobile devices which was previously hidden in versions lower then Total 5.0.8.
body.wpex-is-mobile-device .vc_video-bg,
body.wpex-is-mobile-device .wpex-video-bg-wrap {
display: block;
}
Snippet Type: CSS
Posted Under: Responsive
custom code could be added:
https://blog.hubspot.com/website/video-background-css
Juan this component doesn't requires any configuration you can simply install and enable and it will show you a video background on your website.
In every component you should have INSTRUCTIONS on how to use it.
This is a disgrace, with no instruction on how to edit or add video. I've spent hours to no avail.
Hello,
On the registration panel, the panels are placed over the top bar,
Can you fix the problem?
Thank you
While this works as advertised, it killed my SSL certificate when I installed the SSL. It would not let it secure my website. When I disabled this component the SSL then worked perfectly. Not good.
Can the video not escape the footer? and not scrolling down?
that is, to be somewhat fixed on all screens
on the larger screens to expand and on smaller screens to condense
Working with mobile is not that easy as it have small layout video is larger size, i am not sure how to fit video in mobile?
@Darien,
I can see that the actual video to be used is in the VideoBackground/video path....
To "Install" a different video, my guess would be you simply change the sample "video" file to one of your own, but with the caution made by Arsalan above to be noted.
there are no options to "add" a video but by manually adding it, I suppose.
As the landing screen would be for all to see as well as could well be an "intro" video for some time to peak the interest of potential users, having an option to "install" videos at will would defeat the purpose, I have tested it on desktop machines and ipad (at 1024 but not working at 768px), but having issues with mobile use for obvious screen size problems below 1000px, as already indicated..
However, you should also look at the necessity to have a video at the lower resolutions whilst also trying to display the "Login" or "Create an Account" information on a mobile device....I feel, although it would be nice to have at the lower resolutions, a thought has to be put on the practicality of trying to fit all the information on smaller screens.........Just my view
also if you could get this to work on mobileit would be a gem