Text support in Morpheus top-level menu

Forum rules
Please note that response time for technical support is within 3-5 business days.
Post Reply
auzair
Posts: 3
Joined: 14 Dec 2019, 09:48

14 Dec 2019, 09:59

Hi. I'm interested in purchasing Morpheus PrimeNG template. I have a couple of questions before I proceed.
  • Can I use the Morpheus template offline for a project that will be used on my local network? Or is there any functionality in the template that shall need online connectivity?
  • One of the reasons I have chosen Morpheus template is because I like its hierarchical menu structure. Top-level menu in Morpheus has icons only (Features, Inbox, Calendar, Projects, etc.). My question is, can I replace the icons in this top-level menu with some text of my choice? I mean that instead of the Folder icon for Features menu item, can I display "Features" as text?
Thank you.

merve7
Posts: 861
Joined: 12 Sep 2017, 10:44

16 Dec 2019, 10:52

Hi,
  • Firstly, yes you can use offline and you don't need online connectivity for functionalities.
  • Secondly, yes you can use text instead of icons but you may need to add or change some style(really small changes like font-size) in the stylesheet.

madinaapps
Posts: 1
Joined: 04 Mar 2022, 20:55

22 Dec 2022, 08:11

You mentioned
"Secondly, yes you can use text instead of icons but you may need to add or change some style(really small changes like font-size) in the stylesheet."

Can you please put those changes here.

Also is it possible to keep menu expanded all the times. If yes How to do it.

cetincakiroglu
Posts: 130
Joined: 17 Dec 2021, 09:33

06 Jan 2023, 11:25

Hi,

To change the menu as you want, follow the steps below:

1-) Navigate to app.sidebar.component.html
2-) locate the ul with class "layout-tabmenu-nav"
3-) This line of code is responsible to render menuitem as icon

Code: Select all

    <a href="#" class="tabmenuitem-link" (click)="app.onTabClick($event, 0)" pRipple><i class="pi pi-folder-open"></i></a>
Change it to:

Code: Select all

    <a href="#" class="tabmenuitem-link" (click)="app.onTabClick($event, 0)" pRipple>Features</a>
After changing the icon with text, you'll see the text is rendered instead of the folder icon.

Hope it helps.

Post Reply

Return to “Morpheus - PrimeNG”

  • Information
  • Who is online

    Users browsing this forum: No registered users and 1 guest