Archived topic

How to put video into header

5 replies · Started by chris on November 23, 2018

Viewing posts 1–6 of 6

November 23, 2018 at 7:10 pm #736952

Hi GP Team

Is there a simple way to use a video in the page header?

I have read the following but still none the wiser.

https://docs.generatepress.com/article/page-hero-background-video/

Seems like earlier versions of GP had the option to include header video in the Headers section at the click of a button.

Where or how to insert do I insert the HTML code and CSS?

Thanks

November 23, 2018 at 9:53 pm #737041

Hi there,

The HTML can go into the page hero content.

You can copy and paste the code in and just replace URL/TO/video part.

Adding CSS: https://docs.generatepress.com/article/adding-css/

Let me know if this helps :)

November 24, 2018 at 6:25 am #737354

Thanks Leo

I wanted to link to a Youtube video. Could not get it to work. Uploaded video to my site and it worked. Please confirm if I can link to a Youtube video in the header as I would prefer this way.

Lastly. The top of the first 2 posts were originally on top of the header picture creating a nice effect. Now they are behind the video. Anyway to get them in front of the video?

Thanks

November 24, 2018 at 8:42 am #737601

I believe you need the actual source URL to the video for it to work as a background, and I don't think YouTube gives that to you, unfortunately.

For the overlap issue, add this CSS:

.page-hero + #page {
    position: relative;
}

November 24, 2018 at 7:47 pm #738032

Tom
Yep that works. All good thanks.
Chris

November 24, 2018 at 8:54 pm #738056

You're welcome :)

This archived topic is closed to new replies.

Start building better websites today.