Return to previous page

Displaying headers on mobile and desk top problems

This topic has 15 replies, 4 voices, and was last updated 2 months, 4 weeks ago ago by Tony Rodriguez

nickporter

Participant

December 17, 2025 at 08:24

I created this topic yeterday and I thought it had been resolved. And in a way it has headers are now showing on both desktop and mobile which is great. However the header showing on the mobile is not the one that I created using the xstore header builder.
Can you take a look and let me know what I have done wrong?
Thanks
Nick

Please, contact administrator
for this information.

Files is visible for topic creator and
support staff only.

#462638 Copied

14 Answers

Ayan Rahman

Support staff

December 17, 2025 at 08:34

Hello,

You have created two templates and assigned them to the entire site, which has caused a conflict. Only one template can be correctly assigned to the whole site. Therefore, you need to configure a single template for the entire site with the required options for both desktop and mobile versions.

To see how this works on our demos, you can import a demo header into a new template and immediately check its settings for desktop and mobile.

Best regards,
8Theme Team

#462639 Copied

nickporter

Participant

December 17, 2025 at 10:34

Perfect thanks for the explanation. I have done that and it’s almost as I want it.
If you have a look at the image attached, is there anyway to get the logo in the center and leave the menu on the right.
I have tried changing the settings but don’t seem to be able to get it centered.
Thanks
Nick

Files is visible for topic creator and
support staff only.

#462656 Copied

Ayan Rahman

Support staff

December 17, 2025 at 10:58

Hi,

We can see that you are currently editing the header, so we are unable to check the settings at the moment: https://prnt.sc/b4kzWKjKGC-G. Please let us know once you have finished, and we will review the situation to see how we can assist you further.

Warm Regards,
The 8Theme Team

#462660 Copied

nickporter

Participant

December 17, 2025 at 12:15

Sorry yes I was then had to go out and left it open.
I am out of it now.
Thanks
Nick

#462663 Copied

Ayan Rahman

Support staff

December 17, 2025 at 12:42

Hi,

We’ve made some changes. Please clear cache and check the header on mobile.

Warm Regards,
The 8Theme Team

#462667 Copied

nickporter

Participant

December 17, 2025 at 13:49

OK thanks. Thats not really worked it just looks lit it has been stretched rather than centered.
On another note please see the image attached where do I edit the Categories that are on the menu I can’t find it anywhere.
Thanks
Nick

Files is visible for topic creator and
support staff only.

#462676 Copied

Ayan Rahman

Support staff

December 17, 2025 at 14:21

Hi,

Could you please let us know if this option suits you: https://gyazo.com/eb0165e4d5151cd23a6c282ec3b83a33 ?
Here you can set the desired logo width: https://prnt.sc/3NMMt_fYGAfM

As for the categories shown in your menu https://prnt.sc/V1tbNjU73Xxc , they are taken from your admin panel: https://prnt.sc/IBWLgjEshlBs Please note that only non-empty categories (those containing products) will be displayed.

Warm Regards,
The 8Theme Team

#462680 Copied

nickporter

Participant

December 17, 2025 at 15:09

very helpfull.
So for the categories I could cahnge this to a menu and build a menu to show what I want. If thats correct then no problem I can do this.
As for this image https://gyazo.com/eb0165e4d5151cd23a6c282ec3b83a33 showing the header with the logo centered That might look OK but I am thinking of having the log at top and the bar at the bottom.
The page that image was taken from is that a page where I can edit the mobile layout? I think I have seen it somwhere before but can’t remember how to get to it. Can you let me have the path to it so I can find it agin a have a look.
Thanks
Nick

#462682 Copied

Jack Richardson

Support staff

December 18, 2025 at 09:14

Hello @nickporter,

Since a single header template is used across the entire website, such a screenshot can be taken from any page. For example, please see the homepage: https://prnt.sc/QR7OK7WQ_rZy.

Additionally, we have improved the header with a custom adjustment by adding a duplicated mobile menu widget, which is hidden on the frontend (but not in the editor) using custom CSS (https://prnt.sc/Qkh4WJewrmef). This widget is placed in your header on the left side of the logo to ensure perfect alignment, with the logo positioned symmetrically between the widgets on both sides.

We have also removed most of the content (https://prnt.sc/5cSjB-Qa6ve3) from the duplicated mobile menu widget to prevent unnecessary content loading.

If you have any further questions, please feel free to contact us.

Best regards,
Jack Richardson
The 8Theme’s Team

#462728 Copied

nickporter

Participant

December 18, 2025 at 11:04

Thanks for the reply. I am not sure why you have done the edits to the header for the mobile.
If you have a look at the 2 images below the first before you applied the edits and the second after. I think you will have to agree that the before edit is better. Even with the padding of the extra menu the logo is still too far over to the right.
Sorry if there was any confusion but we had already covered the centering of the logo and that didn’t need anything doing to it. Can you please put it back to how it was.

The page I was referring to that I can’t find is shown in image https://gyazo.com/eb0165e4d5151cd23a6c282ec3b83a33 if you look at the top it will give you a clue as to which page it is. I have seen it but can’t remember how to get back to it.
Thanks
Nick

Files is visible for topic creator and
support staff only.

#462744 Copied

Jack Richardson

Support staff

December 19, 2025 at 08:12

Dear @nickporter,

Thank you for your reply. As we previously mentioned and attached in our screenshot, the header appears correctly aligned on our end. However, the screenshot you provided seems to display a cached version of your header, likely due to the CDN cache used on your website (https://prnt.sc/vyA6FLlD60iJ).

We kindly ask you to clear your CDN cache and check the result again. If you still prefer to keep the previous version of your header, we can revert it for you. Please note, however, that based on our experience, the previous version is not fully responsive—it may appear correctly on some devices, but the logo alignment may be incorrect on others. This is why we implemented the current solution, which ensures proper display across all mobile devices (https://gyazo.com/e3e24cece3acd3e34b13a90f29e66503 compared to the previous version https://gyazo.com/db03a5e45eca7fb5981c9201cc25f874).

Best regards,
Jack Richardson
The 8Theme’s Team

#462804 Copied

nickporter

Participant

December 19, 2025 at 13:05

OK thanks
It looks good now like you say was probably the cache.
Thanks again.
Nick

#462839 Copied

nickporter

Participant

December 19, 2025 at 13:05

Thanks for the support! My topic “Displaying headers on mobile and desk top problems” has been successfully resolved.

#462840 Copied

Tony Rodriguez

Support staff

December 19, 2025 at 13:05

Dear nickporter,

It’s great having you in our WordPress & WooCommerce community!

Every insight you share helps us refine XStore and build tools that empower thousands of online store owners worldwide.

Leave Feedback →
(takes less than a minute)

Together, we grow stronger with every release.

Topic closed.
The 8Theme Team

#462841 Copied
Viewing 15 results - 1 through 15 (of 15 total)

The issue related to '‘Displaying headers on mobile and desk top problems’' has been successfully resolved, and the topic is now closed for further responses

Displaying headers on mobile and desk top problems

Explore our best WordPress WooCommerce Themes collection