Medium header with minimal mobile header

Hello,

1. It is not possible. You need to create a Custom Header for this.
2. You can use the shortcode [oceanwp_woo_cart] to display it where you want. But it also requires a custom header to add the shortcode.
See the documentation here – Create a custom header

Hi,

Thanks for your reply. How would i recreate the minimal mobile header? Specifically getting the menu and cart icon to sit inline with the logo?

I’ve tried the cart shortcode, which works great, but it doesn’t bring in the cart side menu like the original one did, do i need to add something further to it?

Follow the below steps to achieve this –

Step 1 – Create a template under the Theme Panel > My Library. Select Elementor Canvas to do this.
Step 2 – Edit it with Elementor. Create 2 sections. One for mobile & tablet and one for the desktop.
For desktop header – Click on the first section > Advanced > Responsive tab and hide it for mobile and tablet.
For mobile & tablet header – Click on the second section > Advanced > Responsive tab and hide it for the desktop.
Step 3. For the desktop header, design it as per your need. For the mobile header, use ‘Custom Header Nav’ widget to display menu. It will add the original cart as per your need.

‘Custom Header Nav’ – It will display the main menu. To make it work, go to Dashboard > Appearance > Menus and set a menu as the main menu.

Hi,

Many thanks for your reply. That works great, but how do i get the menu to sit opposite the logo on the mobile header? It currently sits below it.

I’ve got it set as 2 columns, one for the logo, one for the nav menu.

Edit the section with Elementor in responsive mode ( click on the mobile icon at the bottom of the elementor panel )and set the column width for mobile – 50%. Similarly for the second column. It will fix the issue.