How To Activate A Menu Heading Item In Offcanvas - Question | JoomShaper
🎃 Halloween Sale is Live! Get 35% OFF on all plans. Sale ends soon! Get Offer

How To Activate A Menu Heading Item In Offcanvas

L

lluis

Helix Framework 7 months ago

Hello,

According to Helix Ultimate documentation, a menu item in the Offcanvas menu can be made active instead of the arrow “>” using this CSS code.

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,
.offcanvas-menu .offcanvas-inner ul.menu > li.menu-parent li.menu-parent .menu-toggler {
  right: auto;width: 99%;}

.offcanvas-menu .offcanvas-inner ul.menu > li.menu-parent li.menu-parent .menu-toggler::after,
.offcanvas-menu .offcanvas-inner ul.menu > li.menu-parent > a > .menu-toggler::after, 
.offcanvas-menu .offcanvas-inner ul.menu > li.menu-parent > .menu-separator > .menu-toggler::after {
  float: right;} 

If the menu item is a Menu Heading, how can I do it? Thanks.

0
3 Answers
Mehtaz Afsana Borsha
Mehtaz Afsana Borsha
Accepted Answer
Support Agent 3 months ago #198010

Hi

Is this solved now? If yes, you can then close this post by accepting the answer.

0
Mehtaz Afsana Borsha
Mehtaz Afsana Borsha
Accepted Answer
Support Agent 7 months ago #187558

Hi

Thanks for contacting us. Use this CSS in your custom.css file

.offcanvas-menu .menu-deeper ul li {
    display: flex;
    flex-direction: column;
}

.offcanvas-menu .menu-deeper ul li nav-header {
    position: relative;
}

.offcanvas-menu .offcanvas-inner ul.menu > li.menu-parent .menu-toggler {
    top: 50%;
    background: none;
    width: 100%;
    text-align: end;
    right: unset !important;
}

-Regards.

0
Mehtaz Afsana Borsha
Mehtaz Afsana Borsha
Accepted Answer
Support Agent 3 months ago #198037

Thanks for accepting the answer.

0