Return to previous page

No design options for mobile menu elements. Bad UX out of the box

This topic has 16 replies, 2 voices, and was last updated 1 months ago ago by Jack Richardson

Tommy

Participant

October 5, 2024 at 16:44

Hello friends.
Today we need to talk about the design options:
Why your theme does not have options to controle the menu elements in mobile view?

Look at this please – this is your mobile menu out of the box:
https://ibb.co/D1LmSb7

The negative / problem is:
A scrollbar with large width is shown.
The scrollbar “strike through” the “open” icon to expand the menu. The scrollbar overlaps / is to close to menu and give visitor not the best feeling.

Its very plain text styled and there is no click area, because its to small and each element are very close to next element. The eye does not have any focus to an element, because there is no seperator and no space for touch UX.

No look at this please: Here you see a great touch ux in another theme and very good focus for each menu element.
https://ibb.co/xf5tfRd
And if you click on it, it will drag/open the nested menus down under the main menu like this:
https://ibb.co/981wfJj

How to have this with your theme also please? You have a great and modern theme and i belive we can do that with your theme also out of the box. Without custom css again and again.

We need to add more space between each menu:
this is possible via settings.

Questions:
– But why no chance to add seperator in style settings of mobile menu header?
– Why no chance to add icon to all mobile menu elements?
– Why no chance to add label like (NEW) or (HIGHLIGHT) to mobile menu elements?
– Why you have a so large scroll bar here that have nearly more focus then the total menu? 🙁 How to move the scroll bar more to left side, like in other themes please?
– Mobile view is so important. Do you plan to add more controle options? Sure, we can start a request for that important viewport, but i think it shoud be done without any roadmap request, or do you really like this scrollbar over the total menu in that large size and width and verly close to drag/open menu icon? https://ibb.co/D1LmSb7

Last but not least:
I can see some users asking about the same and other design requests in mobile menu in comments section. I hope you already have implement this basic needs. Mobile view is one of the most important viewport.

Second problem:
Please check this screenshot:
https://ibb.co/g9Hyhfq

What is this “hanging around” design? 🙂 We need to move the menu to top and remove the space between headline and menu. We need to add a little bit more space between each line and add seperator between each menu. We do not find any text in your documention how to controle the design of this menu.

Sorry for my words. I like your support and i like your theme. But i see massive problems in the details. If you solve that, you will have much more sales and more happy clients.
Not all clients say: oh, i see an issue here, because this users are no grafik designer. I am in germany one of the leading grafik designer and my customer need a pixel perfect design.
In the history we worked with another theme that have eye and focus on options AND design. I hope you understand our needs and its not important to open roadmap question and wait for other users voting to solve that issue.

BR
Tommy

Files is visible for topic creator and
support staff only.

#417352 Copied Theme version: 9.4.2

15 Answers

Jack Richardson

Support staff

October 7, 2024 at 13:20

Dear @Tommy,

Thank you for sharing your valuable insights regarding the implementation of specific features within our theme. We truly appreciate your feedback as it helps us enhance our offerings.

1. We are pleased to inform you that we will be incorporating several improvements in our next update, including separators between menu items as per your suggestion. You can preview the expected outcome here: https://prnt.sc/HYdVpGyeO9ml.

2-3. Regarding the customization of the WordPress-created menu in the mobile menu settings, please access the selected menu through your dashboard panel. Upon selecting any menu item, you will find options to add a custom icon for each item here: https://prnt.sc/yeFnipPaLGba. You can also specify the icon value, which is available on our xstore-icons page: https://xstore.8theme.com/xstore-icons. Additionally, there is an option to choose labels for each menu item, as shown here: https://prnt.sc/Bm_oM0B6koXL. The anticipated result can be viewed here: https://prnt.sc/8Z1adXgj0sD6.

4. The issue you highlighted will be addressed in the forthcoming update.

Please note: All design improvements have been made with careful consideration of our existing customers, ensuring that we maintain our commitment to delivering a clean and modern aesthetic without the use of heavy or overly complex elements, such as those present in the screenshots you have provided as an example.

We are grateful for your feedback and continued support. Should you have any more suggestions or require further assistance, please do not hesitate to contact us.

Best Regards,
Jack Richardson
The 8Theme Team

#417588 Copied

Tommy

Participant

October 7, 2024 at 14:54

Hello Jack,

that are great new. Thank you.
You will see: this will give your menu much better touch conversion!
Before: Menu was plain and now its looking like: here i am, click me.
The border is also good to seperate each menu and show the click area.

Last question i have:
https://imgbb.com/D1LmSb7

In general:
So many customers using this menu and nobody asking about this trouble? Its like to drive a car with broken wheels and a car expert do not check this after weeks. This points let us think: we using the right theme / experts here?!

1. You plan to move that scrollbar more to right position to avoid overlapping the “open” icon for dropdowns?

2. Or do you plan to reduce the width of that scrollbar?

3. When you will share this update?

4. What about this menu? https://ibb.co/g9Hyhfq
This have in header section to much space and text is look like plain text. I have no feeling to click on it, because its “flying” and “lost” by design. Do you plan to give us more controle options here? For example remove that large space between logo and menu, adding background color for menu and add seperator line for each menu… All simples basics to transform a plain text to a menu/clickable section and not only clickable text.

We see your handson philosophy and fast update cycle. Thank you!!!

BR
Tommy

#417618 Copied

Jack Richardson

Support staff

October 8, 2024 at 07:35

Dear @Tommy,

1-2. We would like to inform you that the issue with the scrollbar will be addressed and resolved in next update.

3. For updates regarding the regularity of our theme updates, please visit our update history page at: https://xstore.8theme.com/update-history/. Typically, updates are released every 2-3 weeks.

4. At this time, we do not have plans to add specific options for the area you mentioned, as there have not been any requests for such features on our Taskboard. Additionally, this menu is not essential for use. You can configure the elements to be displayed in the Mobile Panel content by navigating to Theme Options -> Mobile Panel.

Thank you for your understanding and cooperation.

Best Regards,
Jack Richardson
The 8Theme Team

#417703 Copied

Tommy

Participant

October 8, 2024 at 10:24

Hello Jack,

thank you for your update.

Regarding

4. At this time, we do not have plans to add specific options for the area you mentioned, as there have not been any requests for such features on our Taskboard. Additionally, this menu is not essential for use. You can configure the elements to be displayed in the Mobile Panel content by navigating to Theme Options -> Mobile Panel.

Look at this please:
https://ibb.co/g9Hyhfq
1. Why its cool to have so much space between headline and content? Its much better to remove the spaced. How to controle this via elementor please. Or no chance to controle this without custom css?

2. Why there is no seperator lines between each menu?
We only see option to change font-style.

3. In general this menu looking like created in word and does not impress me to click on a menu element. Do you plan to add more styling options?

Sure, you can say nobody asking for it. But please look at this and ask yourself: woud you like it on your page with that spaces and look & feel? All your demos looking so great, but if you open the mobile menu its looking like from a outdated and not styled theme.

BR
Tommy

#417742 Copied

Jack Richardson

Support staff

October 9, 2024 at 08:18

Dear @Tommy,

1. We would like to inform you that currently, there are no options available for modifying the Mobile Panel via Elementor, as this area is configured within the Theme Options. The existing design is both aesthetically pleasing and compliant with UI/UX standards. To date, we have not received any requests for reconfiguration of the Mobile Panel from our customers. However, you are welcome to customize the design using a few lines of CSS or by submitting a request on our Future Requests Taskboard.

2. It is important to note that while we strive to accommodate all suggestions, we are unable to implement each one. However, we have adopted many enhancements that we believe are beneficial for our customers. You can view these updates here: https://www.8theme.com/topic/terrible-styled-mini-cart-in-website-out-of-the-box/#post-417277. Should you wish for us to enhance our Elementor menu widgets with the options you have proposed, please submit your request at https://www.8theme.com/roadmap/. We will assess the popularity of these suggestions based on user votes.

3. We are pleased to confirm that improvements to our Elementor Mobile Menu Widget will be included in the next update, as previously discussed in your request found here: https://www.8theme.com/topic/terrible-styled-mini-cart-in-website-out-of-the-box/#post-417277.

Please refrain from duplicating your questions to ensure efficient communication.

Thank you for your understanding and cooperation.

Best Regards,
Jack Richardson
The 8Theme Team

#417909 Copied

Tommy

Participant

October 9, 2024 at 09:56

Hello Jack,

1. We would like to inform you that currently, there are no options available for modifying the Mobile Panel via Elementor, as this area is configured within the Theme Options. The existing design is both aesthetically pleasing and compliant with UI/UX standards. To date, we have not received any requests for reconfiguration of the Mobile Panel from our customers. However, you are welcome to customize the design using a few lines of CSS or by submitting a request on our Future Requests Taskboard.

We can link custom content in this area? So if user click in mobile menu bar menu element we will show custom content created by elementor and not that plain text menu with so much space between header and content.

I can not understand why this menu with so much space and without any optical structure is a good ux case. In design you have subjective and objective arguments. A subjective argument is to talk about the color and font size. And objective argument is when somebody asking: Why you have so much space between headline and menu? The space here is larger then your content: https://ibb.co/g9Hyhfq I never seen a menu before that show more space then content. But okay.

BR
Tommy

#417936 Copied

Jack Richardson

Support staff

October 10, 2024 at 07:20

Dear @Tommy,

I hope this message finds you well. Could you kindly navigate to the Theme Options, then proceed to the Mobile panel and review the settings there? It appears that there are options available to display static block content that may have been created using Elementor.

For further details, please refer to the discussion in the following topic: https://www.8theme.com/topic/add-short-code-in-mobile-panel-item-for/#post-346486.

Thank you for your attention to this matter.

Best regards,
Jack Richardson
The 8Theme Team

#418086 Copied

Tommy

Participant

October 10, 2024 at 13:45

Hello Jack,
ok. Got it. I will share this information with my team.

BR
Tommy.

#418162 Copied

Tommy

Participant

October 10, 2024 at 14:14

Hello Jack,

thank you. I will talk to my team and review it.

BR
Tommy

#418167 Copied

Tommy

Participant

October 10, 2024 at 14:15

Hello Jack,

1) Mobile Menu
what about this https://ibb.co/b6YQbpF ? Dont call it menu. Better call it “the scrollbar and look out our scrollbar closer”. 🙂
– In this screenshot you see a massive scrollbar.
– In this screenshot you see dropdown icons which do not impress me to push it because the scrollbar overlaps the icons / is very close to dropdown icons.
– My focus is not on text, its on scrollbar.
– Nobody need a so much strong and bold scrollbar in so fine menu element.

And now look at this please:
https://ibb.co/HNjTstx

– Each menu element have full focus.
– Each menu have a good “click me” CTA area.
– Scrollbar is outside of the menu.

This is how good design works and will give you better converison and modern look and feel without overlapping important areas of menu like dropdown element.

2) Mobile Mini Cart
a) Option to wrap product title per line woud be fine. So for example all products will have max. 2 lines of text. Will give best UX.
b) Mini Cart Title is always centered. We only can change the font-size https://ibb.co/t2KqCjm Why not adding small option to align left for example? (left, centered, right). So we can build left aligned headline like here: https://ibb.co/RDkgvYB. Looking much better for focus.
c) We need a seperator line between headline and first product also. Better for focus: https://ibb.co/RDkgvYB
d) “Alignment” in this screenshot does not have any effect: https://ibb.co/Tqj5v12. Not to cart widget in header and also not in mini cart.

BR
Tommy

#418168 Copied

Jack Richardson

Support staff

October 10, 2024 at 15:18

Dear @Tommy,

I hope this message finds you well.

1) Could you kindly confirm if you have cleared your browser cache? It seems that this might not have been done, as we have tested the issue on several different browsers, and the scroll bar is not visible, nor is there any overlap with the menu. If you still see the scrollbar after clearing your cache, we kindly ask you to check the issue in an incognito window as well. Should the issue persist, please provide us with the details of the browser and operating system (Mac or Windows) you are using for testing.

2)
a) Thank you for your suggestion. We will take it into consideration for future releases, should there be similar requests from other customers.
b) & c) These are great ideas, and we will implement them in the next update.
e) Thank you for bringing this issue to our attention. It will be addressed and resolved.

Best regards,
Jack Richardson
8Theme Team

#418177 Copied

Tommy

Participant

October 10, 2024 at 15:26

Hello Jack,

yes, i tested this case in firefox and chrome. Tested via imac and windows. No static cache plugin, no object cache. We disabled also all other plugins.

You can test it in our stage.
Login data added to privat content section.

BR
Tommy

Please contact administrator
for this information.

#418179 Copied

Jack Richardson

Support staff

October 11, 2024 at 07:44

Hello @Tommy
Please, check the private area.
Kind regards, Jack Richardson

Please contact administrator
for this information.

#418245 Copied

Tommy

Participant

October 11, 2024 at 10:28

Hello Jack,

please check my video in privat section.

BR
Tommy

Please contact administrator
for this information.

#418278 Copied

Jack Richardson

Support staff

October 11, 2024 at 16:21

Dear @Tommy,

Thank you for providing the details. It appears that the scrollbar issue is only present in Firefox browsers on our end. We will address this in the next update as well.

Best regards,
Jack Richardson
The 8Theme Team

#418342 Copied
Tagged: best selling woocommerce themes, improve mobile ux, mobile menu design, woocommerce design solutions, woocommerce mobile options, woocommerce ux design
Viewing 16 results - 1 through 16 (of 16 total)