[Resolved] Creating Custom Header + Removing Default Header

Home Forums Support Creating Custom Header + Removing Default Header

Viewing 15 posts - 1 through 15 (of 18 total)
  • Author
    Posts
  • #955167
    Heather

    Hello,

    I am in the process of migrating an existing blog on a website over to GP, and the website’s navigation is pretty in depth so I need to re-create it in GP.
    I can create it using hooks, but the main issue is that the default header is always present – I tried making it all transparent and that didn’t work, and I didn’t see anywhere a way to hide it completely.

    I also tried placing the hook inside the navigation, but unless I position:absolute it (which is a huge headache when making it responsive) I can’t fully hide the default nav behind the custom one.

    How can I go about this? I basically just want to use a hook to make a custom nav and have that exist on all pages, while the default nav is deleted. I don’t just want to display:none it as that’s not really accessible/can create issues.

    Thanks

    #955173
    Leo
    Staff
    Customer Support

    Hi there,

    To hide the default header, simply create a hook element like this:
    https://www.screencast.com/t/bUqVLzMJc5
    https://docs.generatepress.com/article/hooks-element-overview/

    To hide the navigation, select No Navigation in the customizer:
    https://docs.generatepress.com/article/navigation-location/

    Let me know if this helps 🙂

    #955253
    Heather

    Hi,

    It does not seem like I have the option to do “no navigation”/ don’t have the navigation location option at all. See attached for all the options when I go to customize > appearance > layout > primary navigation.

    Am I missing a checkbox somewhere else that will enable this feature for me?

    screenshot of primary navigation features

    #955349
    Leo
    Staff
    Customer Support

    That’s weird. I’ve actually never seen this before.

    That option is actually included in the free theme and it’s located under alignment:
    https://www.screencast.com/t/1jVIUO4z

    Can you disable all plugins and make sure there isn’t a weird plugin conflict somewhere?

    Let me know 🙂

    #955355
    Heather

    I’m literally only running GP Premium, PageSpeed Ninja, WPForms Lite, and Yoast SEO for plugins, so nothing that would affect design/layout/etc. However, I did disable them and it still did not show up.

    Any ideas? Is this a newer feature? I’m running GP 2.3.2, GP Premium plugin 1.8.3 and WordPress 5.2.2

    #955364
    Leo
    Staff
    Customer Support

    That is very strange. This is one of the oldest features.

    Have you modify the theme file in any ways or added any custom functions at all?

    If not any chance you can re-install the theme and see if this somehow fixes it?

    You won’t lose the customizations 🙂

    #955980
    Heather

    But if I remove the theme and re-install it, won’t I lose all of the elements/hooks/custom CSS I did?

    #956047
    Leo
    Staff
    Customer Support

    As long as you didn’t modify the theme’s core files, all the changes will be saved.

    #959402
    Heather

    Ok, I will try it.

    I am also running into an issue with my JS scripts not running/even registering in the code. I am mostly using hooks, is there an issue with having script tags in a hook? For this nav, there is a hamburger menu transition that needs to activate when the burger menu is clicked, but none of the scripts are running.

    Any suggestions?

    #959497
    Leo
    Staff
    Customer Support

    Actually the navigation location option is hidden if you have the use navigation as header activated:
    https://docs.generatepress.com/article/navigation-as-a-header/

    I think that is likely the issue.

    Please open a new topic for the separate issue.

    Thanks!

    #959540
    Heather

    Thank you, that worked!

    The only issue is now it seems like the header itself is getting pushed down by a default div with the classes of “inside-header grid-container grid-parent”. So I’m getting a bit of the background as well as the site title and logo. Even when I remove all of then it is still showing white space. Do you know where I can deactivate this so that my header hook reaches the top of the page. I’ve also made that hook a header, not before/after the header or logo or anything. I’ve attached a photo, I’m trying to get rid of everything above that purple gradient background.

    header with random white space in place of nav

    #959545
    Leo
    Staff
    Customer Support

    Just to make sure, you are wanting to remove this part all together?
    https://www.screencast.com/t/Sjr5sXey1

    #959586
    Heather

    Exactly. So that burger menu and icon/img are part of my custom nav and they have a z-index of like 300 and position absolutely so it’s not actually interfering with the header/pushing anything down. If I display none that specific div I mentioned it’s fine but I would like to avoid that.

    #959590
    Leo
    Staff
    Customer Support
    #959601
    Heather

    That did it! Thank you!

    Not sure if this is part of the same issue, but I am also getting this nav id=”generate-slideout-menu” which also seems to be a default nav/something with the theme, and it is hiding some of my nav as it’s z-index is 100001. Is there somewhere I can go to disable this? See attached

    nav sidebar issue

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