Client Area Navigation Menus Cheatsheet - Revision history

AlexN: /* Open Links In A New Tab */

2022-05-31T14:09:06Z

‎Open Links In A New Tab

AlexN: /* Open links in a new tab */

2022-05-31T14:08:05Z

‎Open links in a new tab

AlexN at 08:08, 31 May 2022

2022-05-31T08:08:55Z

PeterM at 15:40, 20 April 2021

2021-04-20T15:40:11Z

SarahK: /* Finding a Menu Item Name */

2020-12-01T21:27:26Z

‎Finding a Menu Item Name

AlexN at 06:10, 18 June 2019

2019-06-18T06:10:22Z

AlexN at 06:09, 18 June 2019

2019-06-18T06:09:29Z

John: /* Hiding/Removing a Menu Item */

2015-09-01T10:34:01Z

‎Hiding/Removing a Menu Item

John at 16:22, 21 July 2015

2015-07-21T16:22:06Z

Matt at 15:40, 12 July 2015

2015-07-12T15:40:10Z

@@ Line 226: / Line 226: @@
 ==Open Links In A New Tab==
-You can open links in a new browser window using the <tt>setAttribute</tt> method. For example if we are using an external system to control our knowledgebase, we could do something like the following:
+You can open links in a new browser window using the <tt>setAttribute</tt> method. For example, if you are using an external system to control our knowledgebase, you could use the following code:
 <source lang="php">

@@ Line 224: / Line 224: @@
 </source>
-==Open links in a new tab==
+==Open Links In A New Tab==
-You can open links in a new browser window using the setAttribute method. For example if we are using an external system to control our knowledgebase, we could do something like the following:
+You can open links in a new browser window using the <tt>setAttribute</tt> method. For example if we are using an external system to control our knowledgebase, we could do something like the following:
 <source lang="php">

@@ Line 222: / Line 222: @@
+     }
 });
 </source>

@@ Line 1: / Line 1: @@
 The following guide is designed to provide some copy & paste ready code samples for common customisations performed to the dynamic client area navigation menus.  For more detailed documentation, please refer to [[Editing Client Area Menus]]
-This guide assumes you are already familiar with [https://developers.whmcs.com/hooks/ creating and using Hook files in WHMCS].
+<div class="docs-alert-success"><strong>Important</strong><br>This guide assumes you are already familiar with [https://developers.whmcs.com/hooks creating and using hook files in WHMCS].  The following code examples will need to be placed within a [https://developers.whmcs.com/hooks/getting-started/ hook file].</div>
 ==Finding a Menu Item Name==

@@ Line 7: / Line 7: @@
 Every menu item has a unique name that is used to reference it.  You will need this name in order to manipulate it.  To make it easier, we have made the name of each menu item available in the HTML source of the page, which means it can be retrieved using the Inspect Element option available in most modern browsers.  An example of this is shown below.
-[[File:Menu-inspect-element.png]]
+[[File:menus-find-name.png|700px]]
-Once you have the menu item name that you wish to manipulate, which in the example above is "Announcements" you can manipulate it in the following ways.
+Once you have the menu item name that you wish to manipulate, which in the example above is '''Account''' you can manipulate it in the following ways.
-<div class="docs-alert-info">The client area's navigation menu is defined in a tree structure. Each menu item has one parent item and can have many child items. So when you're looking to manipulate a menu item within a dropdown, you will need to first retrieve the parent menu item, which in the case above is "Support", followed by the "Announcements" menu item which is a child within that.</div>
+<div class="docs-alert-info">The client area's navigation menu is defined in a tree structure. Each menu item has one parent item and can have many child items. So when you're looking to manipulate a menu item within a dropdown, you will need to first retrieve the parent menu item, which in the case above is '''Account''', followed by the '''Account Details''' menu item which is a child within that.</div>
 ==Changing the Text Label of a Menu Item==

@@ Line 197: / Line 197: @@
 You can remove a menu item as follows:
 <source lang="php">
@@ Line 209: / Line 222: @@
+     }
 });
 </source>

@@ Line 110: / Line 110: @@
 // Moves a menu item to the last position
 $primaryNavbar->getChild('Support')->getChild('Announcements')->moveToBack();
 </source>

@@ Line 151: / Line 151: @@
                  'order' => '100',
              ));
+     }
 });