Mobile Header with Logo, Title, Menu & 2 Icons

Hi there,

on desktop, will the full menu be displayed? Or will it be the same as the mobile? ie. just the hamburger

1. go to Appearance > Elements -> Add New –> Block

https://docs.generatepress.com/article/block-element-hook/

2. set the Hook to menu_bar_items

3. set the Display Rules > Location to Entire Site

4. Now add your icons buttons in the block editor

5. Publish that.

That will add the icons to the header for desktop and mobile
Once done, let me know and ill advise on the next steps.

For that create a second block element.
And set the Hook to: inside-mobile-header then use a GB Headline Block to add the Site Title text you want.

Once you have the icons and the title in there, let me know.

Hi there,

Could you give the Paragraph Block in your Block Element a class of mobile-custom-title? Adding Custom Classes: https://wordpress.com/support/wordpress-editor/adding-additional-css-classes-to-blocks/

Also, in that Block Element, you have an extra empty Paragraph Block. Could you delete that?

I can’t see the CSS class added, but once you’ve added it, try adding this through Appearance > Customize > Additional CSS:

nav#mobile-header p.mobile-custom-title {
    order: 3;
    margin-left: auto;
    margin-right: auto;
}

I can’t seem to see the CSS I asked you to add. Do you have any caching/optimization plugins? Could you try disabling them to test?

Where did you add the CSS?

I am not seeing Fernandos CSS in the Additional CSS. Can you make sure the customizer changes were saved and not saved to Draft ?