Adding HTML to header on desktop next to hamburger

Hi there,

you can use a Hook Element to add the HTML, or a Block Element if you want to use the Block Editor to add content to the them templates

In either of those elements you cans select a Hook to place your content, use the generate_menu_bar_items hook to add content beside the hamburger.

And set the Elements Display Rules Location to Entire Site ( or the parts of the site you want it displayed ).

Thanks for the quick response, however it apprears to be inside the hamburger menu, Im trying to get it to the left side of it, please see link

https://mismile.wpengine.com/. <== New GP site

https://aj4113.wpengine.com/. <== Site im trying to replicate

Its beside it - you just need to change the text and background colors in Customizer > Colors > Primary Navigation.
And increase the Font Size in Customizer > Typography > Primary Navigation.

For your HTML - i would do this:

<div class="menu-bar-cta"><span>CALL OR TEXT</span><a href="tel:248-644-2136">248-644-2136</a></div>

Then add some CSS to style it:

.menu-bar-cta {
    display: flex;
    align-items: center;  
}
.menu-bar-cta span {
    font-size: 16px;
    margin-right: 10px;
}
.main-navigation .menu-bar-cta a {
    font-size: 30px;
}

Much appreciated, However I can't tell if its a part of the menu now or seperate, Im trying to keep it seperate to make it have no background and then style the hamburger with no background and white color to match
https://mismile.wpengine.com/

https://aj4113.wpengine.com/

In the Customizer > Colors > Primary Navigation you can set the Background color to transparent ( or the same blues as your site header ) and the Text color to white - that should give you the result you require.

Thanks David, that worked great. One more question, is it possible to have a search icon as well to the right of the menu?

For sure - in Customizer > Layout > Primary Navigation - just enable the Navigation Search

Aweomse thank you, is it possible to display to the right vs the left? Lastly is that the only style option that's provided or can you have it open up a full screen overlay?

To move the search icon to the right - add this CSS:

.main-navigation .menu-bar-item.search-item {
    order: 10;
}

Theres not a full screen option built in, but it can be achieved with some PHP and CSS - see this article ( note you don't require the first code block ):

https://generatepress.com/forums/topic/moving-search-field-and-icon/#post-1540468

Your the man! Works great. I believe I have almost all the same functionality as of now.
Is it possible to add an image in the off canvas menu above the navigation, such as on the link below
https://aj4113.wpengine.com/

Also I know I can hook in right below the header but I was curios as how I could add a search box to it similar
to link below

https://mismile.com/meet-the-doctor/

Is it possible to add an image in the off canvas menu above the navigation

You can try the off canvas widget area then we can use the CSS to move it up:
https://docs.generatepress.com/article/off-canvas-panel-overview/#off-canvas-panel-widget-area