Merge Header

  • Hi there,

    I created an element called Main Header.
    I created it as a block and then site header.

    Now I want to merge it with the hero section of the page.

    How do I do that?
    Does it work with an Element I built myself?

    Thanks in advance!

  • Hello,

    You can add a Header element and set Merge with Content setting to Merge. Set it to appear on the Entire Site.

    Header merge

    Header merge location

  • Thanks George,

    I did that but nothing “merges”.

    Does the “Header merge” as you described in the screenshot influence and work with the header element I created? Screenshot

    sss

    It seems that it doesn’t work, when the header and navigation is another element – correct?
    Or is there another way to merge?

    Thanks!

  • Hi there,

    Can you share the site URL so we can take a look at the current header layout?

  • Never mind, I just found your site URL from your other topic.

    What you need to do is select the Site Header block and apply the following settings:

    
    Position: Absolute
    Width: 100%
    Background Color: Transparent
    

    That will create the merged header effect.

  • Thanks Alvind,

    I entered the values you wrote.

    Now the header is gone. 🙂

    Any other ideas?

  • Sorry, there’s one setting missing.

    In addition to the previous settings, set the Z-Index to 99 under the Position settings.

    So the Site Header block should have:

    
    Position: Absolute
    Width: 100%
    Background Color: Transparent
    Z-Index: 99
    
  • Yes!

    Thank you!!!

    Uhmm…is this knowledge you know by heart or do you have to
    trial and error to figur this out?

    Thanks so much!

  • You’re welcome!

    It was mostly a matter of basic CSS troubleshooting using the browser’s developer tools to inspect the layout and identify what was causing the issue.

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