• Priority: 0
  • Status: Closed
  • Theme: Alysum
  • Assigned To: Fred
  • Private: No
  • Open Date: 17.11.20, 17:58
  • Opened by: Sylvain Duval
  • Closed by: Anonymous Submitter
  • Closed on:
  • Reason: Not a bug

Ticket #19861 - Display problem for the menu

Hello,

I have an issue regarding my menu : http://mlv.lokris.ovh/index.php

I have lots of pages to put in my menu. When I add all of them, the display isn’t great.
Indeed, instead of putting my elements one below the other, the width of my page is increasing. So, as you can see on the screenshots in attached documents, the content of my menu is not readable easily and the final render is not beautiful. This situation proves that the website is not responsive depending on the size of computers screens. What should I do to fix the problem ?

Moreover, I have a question about prices. As we are going to sell products to companies, we would like to display both ex-tax prices and prices including all taxes. Is it possible ? Can you explain me how to do it please ?

Thank you in advance for your answer.

Best regards,
Chloé Le Guillou

Comments

Fred 18 Nov 2020, 13:21

1. Menu. It’s not recommended to add so many menu items.
You can add a hundred and say that the theme is not responsive but that is physically impossible to display correctly many items in one line
In your certain case you can reduce the space between items with the following CSS code

#header .pk-menu-horizontal li.level-1 > a {padding: 10px}

2. The theme doesn’t manage prices display. You need to find such option in prestashop configuration. I don’t know where exactly

Sylvain Duval 18 Nov 2020, 14:04

Is it not possible to have a menu in 2 lines ? Look at the screenshot in attached document, it’s this shaping of menu that we would like (https://www.groupe-mlv-france.fr). The idea of the menu is to facilitate the user experience by decreasing the number of clicks to find a product.

We are using your theme regularly. We’ve already developed 6 websites with it and we are led to develop new websites with Alysum. The problem might be regular, this is why it is important to find a solution together. We don’t want to be forced to use another theme for the next websites that have many menu items.

I agree to add your CSS code (where should I add it ? In which file ? Where in the file ?) but is there an other CSS code that allows my menu to be in to 2 lines ?
Or, is it possible to have a vertical menu with your theme ? (I didn’t find any demo with a vertical menu in your demo).

Attachments:

Capture d’écran 2020-11-18 à ... (874.8 KiB)
Fred 18 Nov 2020, 14:52

1. If you want we can add an option to display menu in multiple lines.
2. You have to add CSS to the Theme Settings → Customer CSS

Sylvain Duval 23 Nov 2020, 08:57

Can you give me the CSS to add please that will allow me to have the menu in multiples lines ?

Fred 23 Nov 2020, 12:55
#top-menu {flex-wrap:wrap}
Sylvain Duval 23 Nov 2020, 13:50

Thank you very much.

Fred 23 Nov 2020, 13:51

you are welcome

Sylvain Duval 23 Nov 2020, 13:54

Is it possible to make the 2 lines start at the same point and delete the shift between the word “accueil” and “protection” ?

Attachments:

Capture d’écran 2020-11-23 à ... (95.6 KiB)
Fred 23 Nov 2020, 16:15
#header .top-menu .level-1 > a {padding-left:0}