Offcanvas Menu Dropdown Shows Squares - Forum | JoomShaper
Solved SP Page Builder

Offcanvas Menu Dropdown Shows Squares

Asked by Melissa 5 years ago Last activity 5 years ago

I searched other questions reguarding this issue, but the fix said to go to the Template Style > Template Options > Advanced > Font Settings and then make sure Awesome Font is enabled.

Problem is....when I go to Advanced, "Font Settings" isn't a choice. Please see screenshot for reference.

The square icon (instead of the down chevron icon) is showing only on offcanvas menu. On top main menu the icon for the dropdown shows as it should.

Please advise. Thanks.

Accepted answer

Marked as the solution
Paul Frankowski Senior Staff

But if you want to have arrow ">" instead of plus "+" please use the following code:

.offcanvas-menu .offcanvas-inner .sp-module ul > li.menu-parent > a > .menu-toggler::after,
 .offcanvas-menu .offcanvas-inner .sp-module ul > li.menu-parent > .menu-separator > .menu-toggler::after {
    font-family: "font awesome 5 free"; font-weight: 900; content: "";}

3 more replies

Paul Frankowski Senior Staff
5 years ago · edited

Hi Melissa,

  1. By default Font Awsome is loaded in Helix Ultimate 1.1.x and 2.0 - so you don't have to enable it.
  2. Yes, I noticed small problem in your Mobile Menu. Hopefully it's easy to fix. In template Options - CUstom Code - Custom CSS please paste following code:
.offcanvas-menu .offcanvas-inner .sp-module ul > li.menu-parent > a > .menu-toggler::after,
.offcanvas-menu .offcanvas-inner .sp-module ul > li.menu-parent > .menu-separator > .menu-toggler::after {
    font-family: "font awesome 5 free"; font-weight: 900;}

After Save settings you should have + / -

foto_6900_2021.jpg

Melissa Asked this

That seemed to work. Thanks Paul!

Paul Frankowski Senior Staff

you're welcome.

Log in to reply.