Home › Forums › WoodMart support forum › I want a scrollable mobile nav menu please scrolling in a page kidzedutab.com

I want a scrollable mobile nav menu please scrolling in a page kidzedutab.com

Viewing 30 posts - 1 through 30 (of 32 total)
1 2
  • Author
    Posts
  • May 29, 2024 at 5:38 pm #569120

    emmanuelebukan
    Participant

    Hi I’m want to insert this nav menu to the header in the “header bottom” section. Why it doesn’t scroll left right in the header?
    It is scrolling in a page: kidzedutab.com

    Can you help me fix it to scroll in the header please ?
    I want it to scroll in mobile nav menu please

    May 29, 2024 at 5:40 pm #569122

    emmanuelebukan
    Participant

    Hi I’m want to insert this nav menu to the header in the “header bottom” section. Why it doesn’t scroll left right in the header?
    It is scrolling in a page: kidzedutab.com

    Can you help me fix it to scroll in the header please ?
    I want it to scroll in mobile nav menu please

    May 30, 2024 at 10:35 am #569285

    Hung Pham
    Keymaster

    Hi emmanuelebukan,

    Thanks for reaching to us.

    I cannot access your site, please double check https://prnt.sc/DvZ1v-6VV4vW

    Regards,

    May 30, 2024 at 11:39 am #569352

    emmanuelebukan
    Participant

    oh sorry there Is a typographic error
    its kidsedutab.com (https://www.kidsedutab.com/wp-admin/post.php?post=12977&action=elementor#)

    I want it looking like this https://gyazo.com/a348e76d680591da27271ef390e0449e

    May 30, 2024 at 12:43 pm #569401

    emmanuelebukan
    Participant

    admin access

    May 30, 2024 at 12:52 pm #569403

    emmanuelebukan
    Participant

    Content:

    May 30, 2024 at 2:35 pm #569449

    Hung Pham
    Keymaster

    Hi emmanuelebukan,

    1. Navigate to WoodMart > Header builder > edit default header (highlighted star icon) or you can go through the admin bar directly https://prnt.sc/Ct9ehRDvvDV9.

    Hover on Text / HTML element, click on Pencil icon > select Mobile Tab > add Menu element to Mobile bottom section https://prnt.sc/YSYhhgu8swca

    2. Please add the following Custom CSS code to Theme Settings > Custom CSS > Custom CSS for mobile section.

    .whb-header-bottom .whb-col-mobile .wd-nav {
  display: flex;
  flex-wrap: nowrap;
  overflow-x: auto;
}

.whb-header-bottom .whb-col-mobile .wd-nav>li {
  flex: 0 0 auto;
  margin-right: 10px;
}

    Regards,

    May 30, 2024 at 3:12 pm #569461

    emmanuelebukan
    Participant

    I have done all and its not working

    May 30, 2024 at 3:21 pm #569468

    emmanuelebukan
    Participant

    its is not scrolling

    May 30, 2024 at 3:45 pm #569486

    emmanuelebukan
    Participant

    I want a bigger font and for it to scroll horizontally

    May 30, 2024 at 4:31 pm #569511

    emmanuelebukan
    Participant

    I have now done a mega menu (megamenu kids edutab) and tried using it the CSSS but it isn’t working too

    May 30, 2024 at 4:45 pm #569516

    emmanuelebukan
    Participant

    I want us to work with the new menu (“megamenu kids edutab”)

    May 30, 2024 at 4:56 pm #569523

    emmanuelebukan
    Participant

    after using the mega menu it worked but too flexible and floating I can’t control the roll

    May 30, 2024 at 5:07 pm #569533

    emmanuelebukan
    Participant

    I want it just like this—–https://gyazo.com/a348e76d680591da27271ef390e0449e

    May 30, 2024 at 6:08 pm #569545

    emmanuelebukan
    Participant

    check the buttom menu out
    kidzedutab.com ( its floating and hyper mobile, or unsteady ) and the font sizes are small

    May 30, 2024 at 6:10 pm #569546

    emmanuelebukan
    Participant

    and stops at watches leaving out some contents

    May 30, 2024 at 6:52 pm #569559

    Hung Pham
    Keymaster

    Hi emmanuelebukan,

    I tested on my end and it worked as expected, you can see recorded video https://go.screenpal.com/watch/cZhvosVNn5u

    Regards,

    May 30, 2024 at 7:07 pm #569560

    emmanuelebukan
    Participant

    NO! I think you are using a PC. IT doesn’t work.

    https://go.screenpal.com/watch/cZhvDnVNnGF ( take a look here) it is floating and not aligning within the roll.

    I want mine exactly like this. https://gyazo.com/a348e76d680591da27271ef390e0449e

    May 30, 2024 at 7:08 pm #569561

    emmanuelebukan
    Participant

    it doesn’t work well ==== take a closer look experiment on a mobile devicehttps://go.screenpal.com/watch/cZhvDnVNnGF

    May 30, 2024 at 7:18 pm #569562

    emmanuelebukan
    Participant

    I have feeling its opening a page ( its a megamenu linked to html pages )

    May 30, 2024 at 7:25 pm #569564

    emmanuelebukan
    Participant

    take a look here too .. it the menu vanished completely on menu scroll,.., as though a page opens behind/beneath the homepage…

    take a look…….https://go.screenpal.com/watch/cZhvDrVNnJq

    May 30, 2024 at 7:32 pm #569565

    emmanuelebukan
    Participant

    I don’t want the vertical movements

    May 30, 2024 at 9:24 pm #569580

    emmanuelebukan
    Participant

    the html of the menu pages opens over my home page

    May 31, 2024 at 8:28 am #569616

    Hung Pham
    Keymaster

    Hi emmanuelebukan,

    I fixed with below updated Custom CSS:

    .whb-header-bottom .whb-col-mobile .wd-header-nav {
  max-width: 100vh;
}

.whb-header-bottom .whb-col-mobile .wd-nav {
  display: flex;
  flex-wrap: nowrap;
  overflow-x: auto;
	-webkit-overflow-scrolling: touch;
}

.whb-header-bottom .whb-col-mobile .wd-nav>li {
  flex: 0 0 auto;
  margin-right: 10px;
}

    https://we.tl/t-DigeJypdkH

    Regards,

    • This reply was modified 6 months, 2 weeks ago by Hung Pham.
    May 31, 2024 at 10:16 am #569644

    emmanuelebukan
    Participant

    I have seen the changes how ever it doesn’t scroll to the end

    May 31, 2024 at 10:17 am #569645

    emmanuelebukan
    Participant

    I have seen the changes how ever it doesn’t scroll to the end so not all items on the menu gets to be seen

    May 31, 2024 at 6:00 pm #569838

    Hung Pham
    Keymaster

    Hi emmanuelebukan,

    Can you please replicate the issue then I can take a look? If you keep removing the menu, it takes time to re-add to see issue again.

    Regards,

    May 31, 2024 at 6:05 pm #569839

    emmanuelebukan
    Participant

    I have added menu back (however it doesn’t scroll to the last menu item ()

    there are 11(eleven) menu items and only 9 is showing

    May 31, 2024 at 6:12 pm #569840

    emmanuelebukan
    Participant

    I notice it each time I link my menu to html (megamenu)

    May 31, 2024 at 6:22 pm #569843

    emmanuelebukan
    Participant

    I confirmed the floating comes each time I linked my menu to html block links .

    take a look https://go.screenpal.com/watch/cZhvDrVNnJq

  • Author
    Posts
Viewing 30 posts - 1 through 30 (of 32 total)
1 2