Client Area Homepage Panels
The customizable panels in the Client Area Homepage display quick information to clients when they log in. You can customize this part of the Client Area to suit your brand and your customers’ needs.
Panel Structure
The panels on the Client Area homepage use a tree structure of objects.
Each panel is a child of an invisible root item. Many panels also render their own child items as lists of links inside the panel:
- root item
- panel item
- line item
- line item
- line item
- panel item
- line item
- line item
- panel item
- panel item
Panel Layout
Panels can appear in two layouts, Desktop Mode or Responsive Mode.
- Desktop Mode typically appears in desktop web browsers. It renders most Client Area homepage panels in two columns.
- Responsive Mode activates when the Client Area renders on a smaller screen like a phone or tablet. It renders all panels in a single column.
For more information about the Client Area layouts and how they determine panel display, see Client Area Layout.
Formatting and Customizing Panels
Client Area Homepage panels are similar to sidebar panels. They use the same underlying structure as menu item objects, but include a few unique changes.
- A homepage panel’s label is not a clickable link.
- Setting a URI in a homepage panel has no effect.
Custom Colors
Panels can render in a custom color when you define the color menu item attribute.
The following colors are available:
gold
green
red
blue
orange
pink
purple
lime
magenta
teal
turquoise
emerald
amethyst
wet-asphalt
midnight-blue
sun-flower
pomegranate
silver
asbestos
Optional Button
Each homepage panel has an optional button that renders to the right of the panel’s label and badge.
Define the following menu item extras to render a button in a homepage panel:
btn-link
— The URL to load in the user’s web browser when the viewer clicks the button.btn-text
— The text within the button.btn-icon
— An optional Font Awesome icon to display to the left of the button’s text.colspan
— In WHMCS 8.5 and later, an optional Boolean value that causes the panel to span both columns.
Default Panels
WHMCS defines several panels by default:
Name | Order | Required Permission | Conditions for Display |
---|---|---|---|
Unpaid Invoices | 10 | Invoices | At least one unpaid invoice with no overdue invoices. |
Overdue Invoices | 10 | Invoices | At least one overdue invoice. |
Domains Expiring Soon | 50 | Manage Domains | At least one domain expiring within 45 days. |
Active Products/Services | 100 | Manage Products | None |
Recent Support Tickets | 150 | Support Tickets | None |
Register a New Domain | 200 | Orders | Domain registration is enabled. |
Your Files | 250 | None | At least one file is associated with the client’s account. |
Affiliate Program | 300 | Affiliate | An active affiliate account. |
Recent News | 500 | None | None |
- Hooks can register additional panels and interact with default panels. There is no guarantee that these panels will be visible or use this display order.
- Most panels are conditional and require the user to have the appropriate permissions.
Interacting With Homepage Panels
You can use the add_hook()
function to call custom code when WHMCS is rendering homepage panels.
The ClientAreaHomepagePanels
hook allows you to manipulate the Client Area homepage’s panels.
- Call this hook before you assign the panel object to the view template.
- This hook passes the Client Area home panel’s root item to the hook function.
For more information about using the hook system and supported hook functions, see our Developer Documentation.
Custom Actions
In WHMCS 8.5 and later, you can use the CustomActions
server module function to define items that perform a set function and then redirect the user to a specified URL.
- Customers can invoke items from within the Client Area.
- Use this to specifically add items to the My Active Products/Services panel in the Client Area home page.
- You can also use this to add custom actions to Client Area service sidebar menus.
For more information on using custom actions, see our Developer Documentation.
Customization
You can add, modify, or remove panels in the Client Area to suit your needs.
For examples of customizing Client Area Homepage panels, see:
- Add a Promotional Offer Panel
- Add an Informational Panel
- Create a Two-Column Panel
- Modify an Existing Panel
- Rearrange Panels
- Remove a Panel
Last modified: October 30, 2024