Docs

[Nicci W]

Hi

I have tried to follow the various descriptions and tutorials on how to set up a slider with a background video. I just get a black screen. I have tried both using the same video from vimeo and youtube and get the same error. The slider part works as that appears. If i remove the source code from the optional video background field the screen then goes to white, so the slider part is working. I want to set it up similar to integrity 1 demo, but using a transparent slide over the top with links/buttons. I have set up a test page http://adamcochranefitness.co.uk/test-page/ as I cannot leave the homepage looking so bad with this slider. I will send a separate message with login cred marked as private.

Many Thanks in Advance

Nicci

[Nicci W]

This reply has been marked as private.

[Rahul]

Hi There,

1. Upload video using WordPress media up-loader.
2. You need to setup a slide first and add a video layer.
3. You set up video size as full width and set up the rest according to your needs.

Let me know if this helps.

Thanks in advance.

[Nicci W]

Hi

Thanks, i have made it work adding a video layer using youtube, I wanted to avoid self hosting due to bandwidth. All sorted.

Many Thanks

[Joao]

Glad to hear it,

Joao

[Nicci W]

Hi Sorry

I have now come across a related issue. For mobile view it is not responsive but it cannot be disabled for that view. so I have tried adding the slider through cornerstone to then hide from mobile view but I get the following attached screenshot message.

Many Thanks In Advance

Nicci

[Rupok]

Hi Nicci,

That means you didn’t assign the right video for the section you are using for mobile. Let’s change the slider.

Thanks!

[Nicci W]

Hi

Sorry, that makes no sense to me, “slider with alias bground not found” No such slider exists, the options I get from the drop down menu are front1 and bground video. And i don’t want to use a video for mobile I want to enable it as a cornerstone element so I can hide it from mobile view as it isn’t responsive and doesn’t display correctly.

regards

Nicci

[Jade]

Hi Nicci,

You can edit the video layer mobile setting and disable the video and set a poster image for mobile. Please refer to the screenshot below.

[Nicci W]

Hi

Sorry, no we still haven’t got the right solution. I want to be able to enable the slider as a cornerstone element, so that the whole slider can be hidden from mobile view, not just the video layer. The slider is not responsive so even with the video layer disabled I am left with a large white space above the masthead. As above when trying to add the slider as a cornerstone element I get the error message that I attached previously.

Thanks

Nicci

[Joao]

Hi Nicci,

Please add the following code to Appereance > customizer > Custom > CSS

@media (max-width: 769px) {
  
  .x-slider-container.above {
    
    display: none;
  }   
  
  }
.x-topbar .p-info {
  
  background: none;
}
  
}

I also added a an extra code for the background of p-info in order that it looks better on portrait tablets and mobile,

Hope it helps

Joao

[Nicci W]

Hi

This is much better, thanks for that solution. I’ve amended the max size to include medium size as it still looked bad in that view, and I now have the look I wanted to achieve.

Thanks Very Much

[Nicci W]

Hi

Sorry, I’ve got to add something else to this now. Since I’ve added this code the video now stops at random points and won’t play all the way through, but just leaves me with the white background screen. I have tried both the vimeo and youtube versions and the same thing happens, I have also tried on safari and chrome and get the same problem.

As this is causing a problem for the homepage I have removed it for now until resolution is reached and I have reapplied this slider back to the test page http://adamcochranefitness.co.uk/test-page/

Many Thanks
Nicci

[Jade]

Hi Nicci,

There is a JS error when I checked the console which might be causing the slider to behave incorrectly.

Kindly remove the lines <script type="text/javascript"> and </script> that wraps the analytics code you place in the JS customizer as it is not necessary to place them.

[Nicci W]

Hi

I have removed the lines as suggested and still have the same problem with the video stopping.

Thanks

Nicci

[Author]

Posts