All Department Menu is having issues when showing several items

This topic has 5 replies, 2 voices, and was last updated 2 hours, 19 minutes ago ago by Sherine

  • Avatar: Sherine
    Sherine
    Participant
    December 1, 2025 at 17:43

    I am having the following problems with the All Departments Menu

    1. When I select “more items” in the drop down list, I can only view them if I reduce the browser view zoom from 100% to approximately 80%.
    I therefore tried to disable the “Show more” feature and used the css showed below in the Global css area but no scroll bar appeared even after clearing browser and server cache.

    ul#menu-all-departments {
    height: 400px !important;
    overflow-y: scroll !important;
    }

    I therefore turned on back the “show more” feature and removed the css. Can you help me to put in a scroll bar.

    2. When I added a Static block eg Mega-menu-11-niche-market02 – to one of the Departments eg “Electronics & Gadgets” that shows after selecting “show more” the pop out does not appear immediately beside the arrow it appears at the top level of the All Department menu, beside the first item in the All Department list.

    3. I created a new Static block to be used for a new category in the All Department menu. I used the “Product Category Lists” widget to display the Sub Categories for the Category that I added in the Query section. The issue is it is wrapping the names of the Categories. Also, the lowest level it goes for columns is 2. How do I format this or fix this issue.

    Content is visible for topic creator and
    support staff only.
    4 Answers
    Avatar: Jack Richardson
    Jack Richardson
    Support staff
    December 2, 2025 at 09:18

    Dear @Sherine,

    Thank you for reaching out to us.

    1. Unfortunately, there is no ready-made solution available at this time. However, we kindly suggest limiting the number of items in your “All Departments” menu to ensure that all entries are visible and that the mega menu displays correctly.

    2. You may try adding the following custom CSS to adjust the position of your static blocks within the “All Departments” section so that they appear in the correct visible area:

    .elementor-widget-theme-etheme_departments_menu .menu-static-block.nav-sublist-dropdown {
        min-height: 100vh;
    }

    3. Could you please attach the URL of the static block in question, along with a few screenshots showing the desired result? This will help us review the issue and determine what improvements can be made to achieve the outcome you need.

    Best regards,
    Jack Richardson
    The 8Theme Team

    Avatar: Sherine
    Sherine
    Participant
    December 2, 2025 at 18:08

    I am trying to recreate:
    /staticblocks/mega-menu-11-niche-market02/

    Content is visible for topic creator and
    support staff only.
    Avatar: Jack Richardson
    Jack Richardson
    Support staff
    December 3, 2025 at 07:39

    Hello @Sherine,

    Please check it now. We have improved your widget settings and added a hover animation using custom CSS (https://prnt.sc/nJg_LGWgmVp4). You can see how it appears on the frontend here: https://gyazo.com/5e20542e1981d72443f2ae64eefe3347

    Best regards,
    Jack Richardson
    The 8Theme Team

    Avatar: Sherine
    Sherine
    Participant
    December 4, 2025 at 23:35

    I am not sure what is happening. When I go to XStore Static Block and view the created Static block with the custom css, it looks the way I want it with no lines wrapping. However, when I view it in either Chrome or Edge it is not displaying correctly, the Category name is wrapping.

    Files is visible for topic creator and
    support staff only.
  • Viewing 5 results - 1 through 5 (of 5 total)

You must be logged in to reply to this topic.Log in/Sign up

We're using our own and third-party cookies to improve your experience and our website. Keep on browsing to accept our cookie policy.