offcanvas menu - make first level items description clickable to show second level items - Forum | JoomShaper
Solved Helix Framework

offcanvas menu - make first level items description clickable to show second level items

Asked by Rita 2 years ago Last activity 2 years ago

Hi,
I would like, within the offcanvas menu, have the parent menu (first level) items clickable to show the child (second level) items in order to avoid having to pinpoint the menu item toggler - could you please help me out on this ?
I am using the helix Ultimate template with pagebuilder on Joomla4
kind regards
Rita

Accepted answer

Marked as the solution
Rita Asked this

Phantistic - Great
THANKS A LOT
K regards

Rashida Rahman Staff

You are always welcome:)

Have a nice day!

6 more replies

Rashida Rahman Staff

Hi there!

Thanks for contacting us.

Would you please give me your site URL here to check?

If your main menu items doesn't have any real link to redirect, then I can give you some CSS.

Best Regards

Rita Asked this

Hi, I would like to add following:
whatever and however I configure the offcanvas menu - contacts are not being displayed - inside contacts as well as module position (used top2).
xx Rita

Rita Asked this

Hello again - in the meantime I have been able to show contact info in the offcanvas menu -

I am looking forward to read from you on how to make first level menu item clickable to list second level items.

kind regards
Rita

Rita Asked this

Hi, could I please kindly remind you to send me the css as per your reply 4 days ago.

"If your main menu items doesn't have any real link to redirect, then I can give you some CSS."

many thanks in advance
Rita

Rashida Rahman Staff

Hi Rita,

Sorry for the delayed response.

Kindly use the following code in your custom CSS:

body.ltr .offcanvas-menu .offcanvas-inner ul.menu>li.menu-parent>.nav-header>.menu-toggler, body.ltr .offcanvas-menu .offcanvas-inner ul.menu>li.menu-parent>a>.menu-toggler, body.ltr .offcanvas-menu .offcanvas-inner ul.menu>li.menu-parent>.menu-separator>.menu-toggler {
    width: 100%;
    text-align: right;
}

Hope this helps:)

Best Regards

Log in to reply.