[Resolved] Home Page Video Background with Header and Content

Home Forums Support [Resolved] Home Page Video Background with Header and Content

Home Forums Support Home Page Video Background with Header and Content

Viewing 15 posts - 1 through 15 (of 17 total)
  • Author
    Posts
  • #1270755
    Nadine

    Hi,
    I need to add a video background to my home page. The header and part of the page content needs to sit on top of it. I was trying to do this with Page Hero element, but I don’t see a video option. How do I accomplish this?
    Thanks!

    Edit: I put it up on a test site for help. I have been testing different positioning, but I need it relative to the logo. I also need to keep the logo to the left and eventually the mobile menu to the right.

    #1270771
    Nadine

    Oh and I’m using Elementor

    #1270838
    Leo
    Staff
    Customer Support

    Hi there,

    This is the method if you are using GP:
    https://docs.generatepress.com/article/page-hero-background-video/

    If you are using Elementor then you would need to create the template in Elementor then just add the shortcode as the page hero content:
    https://docs.generatepress.com/article/how-to-create-a-page-hero/#step-1-add-the-content

    Let me know if this helps πŸ™‚

    #1270866
    Nadine

    Hi Leo,
    Thanks for the speedy reply! I just tried it with sample template, and my header is not sitting on top of the Elementor template. I do have merge selected.

    #1270872
    Leo
    Staff
    Customer Support

    Any chance you can link us to the site in question?

    You can edit the original topic and use the private URL field.

    Let me know πŸ™‚

    #1270887
    Nadine

    Unfortunately I’m working locally. Let me try a bit longer. If I can’t figure it out I’ll put it online somewhere. thanks

    #1270888
    Leo
    Staff
    Customer Support

    Sounds good. We will be here πŸ™‚

    #1272283
    Nadine

    Would it be possible to send you a private screenshot? I have some of it figured out, but now my Elementor content block that sits on the same header background isn’t sitting correctly. It moves around and I’m not sure how to position it relative to the header elements. Does that make sense?

    #1272465
    Leo
    Staff
    Customer Support

    Screenshots really don’t help with issues like this as I need to inspect the code to determine the issue.

    Any chance you can make the site live or create a staging site with the issue so I can help better?

    #1272474
    Nadine

    I did. I tried to edit the original topic and I added a private link. Did it not work?

    #1272482
    Leo
    Staff
    Customer Support

    Sorry it did work – you didn’t mention it so I didn’t check πŸ˜‰

    So what is the issue? This part here?
    https://www.screencast.com/t/H1QnT1Kjn

    #1272498
    Nadine

    No, that’s from me trying a million things. It’s in setting the distance that text area has from the logo. I can set the distance from the top, but it then overlaps the logo on different screen sizes and mobile.

    #1272763
    Leo
    Staff
    Customer Support

    Looks like it’s controlled by Elementor.

    If you reduce the padding-bottom, it should move the content closer to the top:
    https://www.screencast.com/t/H42T95wq3

    #1272766
    Nadine

    It is. The problem I’m having is that the logo is controlled by GeneratePress, so I can’t those elements relative to the logo. It’s not the padding bottom, I tried a million different things there. I’ll try again tomorrow and hopefully be able to work it out then.

    #1272769
    Leo
    Staff
    Customer Support

    Sounds good.

    Let me know if you need another look.

Viewing 15 posts - 1 through 15 (of 17 total)
  • You must be logged in to reply to this topic.