# Menu Manager WHMCS Addon

# Description

### Menu Manager addon **[WHMCS](https://puqcloud.com/link.php?id=77)**

##### [Order now](https://puqcloud.com/store/whmcs-addon-modules) | [Download](https://download.puqcloud.com/WHMCS/addons/PUQ_WHMCS-Menu-Manager/) | [FAQ](https://community.puqcloud.com/)

## PUQ Menu Manager — WHMCS Addon

**PUQ Menu Manager** is a standalone WHMCS addon module for customizing the client area Primary Navbar. It provides a full-featured drag-and-drop menu editor with multi-language support, display rules, mega menus, customizable navbar styles with live preview, and ready-to-use menu presets.

- - - - - -

## Key Features

- **Drag-and-Drop Menu Editor** — visually reorder, nest, and organize menu items with up to 3 levels of nesting
- **Multi-Language Labels** — translate menu item names into 27 languages for international client areas
- **Display Rules** — control item visibility per menu item: Always, Existing Client only, or Guest Client only
- **Mega Menu Support** — create wide dropdown panels with custom HTML content instead of standard dropdowns
- **Mega Menu Templates** — 5 built-in quick templates: Columns with Icons, Feature Cards, Services Grid, Contact & Info, Promo Banner
- **Font Awesome 5 Icon Picker** — built-in icon picker with search for selecting menu item icons
- **Nav Dividers** — add horizontal dividing lines between dropdown menu items
- **10 Navbar Styles** — choose from Default WHMCS, Modern Shadow, Dark Elegant, Gradient Wave, Minimal Underline, Rounded Pill, Glass Morphism, Neon Glow, Flat Material, and Classic Bordered
- **Style Customization** — edit colors, shadows, transitions, border radius, opacity, blur, and more for each style with live preview
- **5 Menu Presets** — quickly load Standard, Business Pro, Hosting Provider, Full Mega, or Minimal Clean menu configurations
- **Set Default / Reset** — restore the original WHMCS navbar with one click
- **License system** — online/offline license verification with graceful degradation
- **English language interface**

- - - - - -

## Use Cases

- **Branding** — customize the navbar to match your company's design and color scheme
- **Navigation Optimization** — reorganize menu items for better user experience
- **Multi-Language Sites** — provide translated menu labels for international clients
- **Mega Menus** — create rich dropdown panels with contact info, quick links, feature cards, and promotional banners
- **Visual Themes** — apply modern navbar styles like Glass Morphism, Neon Glow, or Dark Elegant
- **Quick Setup** — use menu presets to get a professional navbar configuration in seconds

- - - - - -

## System Requirements

<table id="bkmrk-requirement-minimum-"><thead><tr><th>Requirement</th><th>Minimum</th></tr></thead><tbody><tr><td>**WHMCS**</td><td>8.x, 9.x</td></tr><tr><td>**PHP**</td><td>8.1, 8.2+</td></tr><tr><td>**ionCube Loader**</td><td>v13 or newer (v14, v15)</td></tr></tbody></table>

- - - - - -

## Links

- **Product page:** [https://puqcloud.com/](https://puqcloud.com/)
- **Documentation:** [https://doc.puq.info/books/menu-manager-whmcs-addon](https://doc.puq.info/books/menu-manager-whmcs-addon)
- **Support:** [https://puqcloud.com/submitticket.php](https://puqcloud.com/submitticket.php?step=2&deptid=1)
- **Community:** [https://community.puqcloud.com/](https://community.puqcloud.com/)# Changelog

### Menu Manager addon **[WHMCS](https://puqcloud.com/link.php?id=77)**

##### [Order now](https://puqcloud.com/store/whmcs-addon-modules) | [Download](https://download.puqcloud.com/WHMCS/addons/PUQ_WHMCS-Menu-Manager/) | [FAQ](https://community.puqcloud.com/)

## v1.0 — 2026-02-24

First release.

### New Features

- Drag-and-drop menu editor for WHMCS client area Primary Navbar
- Up to 3 levels of menu nesting
- Multi-language menu item labels (27 languages)
- Display rules per item: Always, Existing Client, Guest Client
- Mega menu support with custom HTML content
- 5 mega menu quick templates: Columns with Icons, Feature Cards, Services Grid, Contact &amp; Info, Promo Banner
- Font Awesome 5 icon picker with search
- Nav dividers for dropdown menus
- 10 customizable navbar styles: Default WHMCS, Modern Shadow, Dark Elegant, Gradient Wave, Minimal Underline, Rounded Pill, Glass Morphism, Neon Glow, Flat Material, Classic Bordered
- Style editor with live preview — customize colors, shadows, transitions, border radius, opacity, blur, and more
- Navbar Styles management page with style cards and Edit buttons
- Settings page for selecting the active navbar style
- 5 ready-to-use menu presets: Standard, Business Pro, Hosting Provider, Full Mega, Minimal Clean
- Load Preset dropdown with confirmation dialog
- Set Default button to restore the original WHMCS Primary Navbar
- Reset to Defaults button on style editor page
- Dashboard with menu item count, active navbar style, and module version
- Quick Actions on dashboard: Edit Primary Navbar, Navbar Styles, Settings
- AJAX-based save/load for all pages
- License verification system with online/offline modes
- Dashboard accessible without active license, other pages restricted
- English language interface# Installation and Update

### Menu Manager addon **[WHMCS](https://puqcloud.com/link.php?id=77)**

##### [Order now](https://puqcloud.com/store/whmcs-addon-modules) | [Download](https://download.puqcloud.com/WHMCS/addons/PUQ_WHMCS-Menu-Manager/) | [FAQ](https://community.puqcloud.com/)

## System Requirements

<table id="bkmrk-requirement-minimum-"><thead><tr><th>Requirement</th><th>Minimum</th></tr></thead><tbody><tr><td>**PHP**</td><td>8.1, 8.2 or newer</td></tr><tr><td>**WHMCS**</td><td>8.x, 9.x or newer</td></tr><tr><td>**ionCube Loader**</td><td>v13 or newer (v14, v15)</td></tr></tbody></table>

> **Note:** The module uses ionCube encoding. Make sure ionCube Loader is installed and active on your server.

- - - - - -

## Download

The module can be ordered and downloaded from PUQ Cloud:

- **Order / Download:** [https://puqcloud.com/store/whmcs-addon-modules](https://puqcloud.com/store/whmcs-addon-modules)
- **FAQ:** [https://community.puqcloud.com/](https://community.puqcloud.com/)
- **Direct download links:**

PHP 8.1:

```
wget https://download.puqcloud.com/WHMCS/addons/PUQ_WHMCS-Menu-Manager/php81/PUQ_WHMCS-Menu-Manager-latest.zip

```

PHP 8.2+:

```
wget https://download.puqcloud.com/WHMCS/addons/PUQ_WHMCS-Menu-Manager/php82/PUQ_WHMCS-Menu-Manager-latest.zip

```

> All versions are available at: [https://download.puqcloud.com/WHMCS/addons/PUQ\_WHMCS-Menu-Manager/](https://download.puqcloud.com/WHMCS/addons/PUQ_WHMCS-Menu-Manager/)

After downloading, extract the archive:

```
unzip PUQ_WHMCS-Menu-Manager-latest.zip

```

- - - - - -

## Installation

### Step 1: Upload Files

Extract the module archive and upload the `puq_menu_manager` directory to the WHMCS addons directory:

```
/your-whmcs/modules/addons/puq_menu_manager/

```

Directory structure after upload:

```
modules/addons/puq_menu_manager/
    puq_menu_manager.php
    hooks.php
    whmcs.json
    version
    logo.png
    lib/
        puqMenuManager.php
        NavbarStyleManager.php
        MenuPresetManager.php
    lang/
        english.php
    templates/
        ...

```

### Step 2: Activate the Module

1. Log in to the WHMCS admin panel
2. Go to **Setup** &gt; **Addon Modules**
3. Find **PUQ Menu Manager** in the list
4. Click **Activate**

> On activation, the module creates two database tables: `puq_menu_manager` and `puq_menu_manager_settings`.

### Step 3: Configure the License Key

1. After activation, click **Configure** next to the module
2. Enter your license key in the **License key** field
3. Select admin role groups that should have access to the module
4. Click **Save Changes**

After saving, a verification status will appear below the license key field (e.g., `success: 2027-02-23T23:25:35+01:00`).

![Module configuration with license key and access control](https://doc.puq.info/uploads/images/gallery/2026-02/embedded-image-q3bqvuaa.png)*Module configuration page — enter your license key and select admin role groups*

### Step 4: Access the Module

Go to **Addons** &gt; **PUQ Menu Manager** to access the dashboard.

- - - - - -

## Update

### Step 1: Backup

Before updating, we recommend backing up:

- Your WHMCS database
- Module files in `modules/addons/puq_menu_manager/`

### Step 2: Upload New Files

Extract the new version and overwrite all files in:

```
/your-whmcs/modules/addons/puq_menu_manager/

```

### Step 3: Re-activate (if needed)

If the update adds new database columns, deactivate and re-activate the module:

1. Go to **Setup** &gt; **Addon Modules**
2. Click **Deactivate**, then **Activate** again

> This is safe — the module only creates tables/columns if they don't already exist. Your menu configuration and settings are preserved.

### Step 4: Verify

1. Go to **Addons** &gt; **PUQ Menu Manager**
2. Check the version number in the top-right corner of the navigation bar (e.g., `v1.0`)

- - - - - -

## Deactivation

1. Go to **Setup** &gt; **Addon Modules**
2. Click **Deactivate** next to PUQ Menu Manager
3. Confirm the deactivation

> **Warning:** Deactivation drops the module's database tables (`puq_menu_manager`, `puq_menu_manager_settings`). All your menu configuration, navbar style settings, and customizations will be lost.

- - - - - -

## License

The module requires an active license for full functionality. The license is verified through the PUQ Cloud license server.

### How License Verification Works

- The module periodically checks license validity at `https://license.puqcloud.com/`
- Verification results are cached in the database for 5 days
- If the license server is temporarily unreachable, the module uses the last cached result

### Without an Active License

- **Dashboard** (Home page) remains fully accessible
- **All other pages** (Primary Navbar, Navbar Styles, Settings) display a license required page
- **All AJAX controllers** (except Dashboard data) return a 403 error
- **The navbar continues to render** on the frontend — it is not disabled without a license

### After Activating a License

1. The warning banner disappears
2. All pages and features become accessible
3. Enter your license key in **Setup** &gt; **Addon Modules** &gt; **PUQ Menu Manager** &gt; **Configure**

### Purchase a License

**[https://puqcloud.com/store/whmcs-addon-modules](https://puqcloud.com/store/whmcs-addon-modules)**

For license-related questions, please contact us via the ticket system:

**[https://puqcloud.com/submitticket.php](https://puqcloud.com/submitticket.php?step=2&deptid=1)**# Dashboard

### Menu Manager addon **[WHMCS](https://puqcloud.com/link.php?id=77)**

##### [Order now](https://puqcloud.com/store/whmcs-addon-modules) | [Download](https://download.puqcloud.com/WHMCS/addons/PUQ_WHMCS-Menu-Manager/) | [FAQ](https://community.puqcloud.com/)

## Overview

The Dashboard is the main page of the PUQ Menu Manager module. It provides a quick overview of your current menu configuration and shortcuts to key features.

![Dashboard page with metrics and quick actions](https://doc.puq.info/uploads/images/gallery/2026-02/embedded-image-chwycqpv.png)*Dashboard — overview of menu item count, active navbar style, and module version*

- - - - - -

## Metrics

The dashboard displays three key metrics:

<table id="bkmrk-metric-description-t"><thead><tr><th>Metric</th><th>Description</th></tr></thead><tbody><tr><td>**Total Menu Items**</td><td>The total number of menu items currently configured in the Primary Navbar (including all nesting levels)</td></tr><tr><td>**Navbar Style**</td><td>The currently active navbar style applied to the client area (e.g., Glass Morphism, Dark Elegant, etc.)</td></tr><tr><td>**Module Version**</td><td>The installed version of the PUQ Menu Manager module</td></tr></tbody></table>

- - - - - -

## Quick Actions

Below the metrics, the dashboard provides quick action buttons:

<table id="bkmrk-button-description-e"><thead><tr><th>Button</th><th>Description</th></tr></thead><tbody><tr><td>**Edit Primary Navbar**</td><td>Opens the drag-and-drop menu editor</td></tr><tr><td>**Navbar Styles**</td><td>Opens the navbar styles management page</td></tr><tr><td>**Settings**</td><td>Opens the module settings page</td></tr></tbody></table>

- - - - - -

## Navigation

The module navigation bar at the top provides access to all pages:

- **Dashboard** — current page with overview metrics
- **Primary Navbar** — drag-and-drop menu editor
- **Navbar Styles** — manage and customize navbar styles
- **Settings** — select the active navbar style
- **Help** — links to documentation and support# Primary Navbar

### Menu Manager addon **[WHMCS](https://puqcloud.com/link.php?id=77)**

##### [Order now](https://puqcloud.com/store/whmcs-addon-modules) | [Download](https://download.puqcloud.com/WHMCS/addons/PUQ_WHMCS-Menu-Manager/) | [FAQ](https://community.puqcloud.com/)

## Overview

The Primary Navbar page is the main menu editor. It provides a visual drag-and-drop interface for building and managing the WHMCS client area navigation bar.

![Primary Navbar editor with menu structure and item editor](https://doc.puq.info/uploads/images/gallery/2026-02/embedded-image-mduwg7mm.png)*Primary Navbar editor — drag-and-drop menu structure on the left, item editor on the right*

- - - - - -

## Action Buttons

At the top of the page, three action buttons are available:

<table id="bkmrk-button-description-s"><thead><tr><th>Button</th><th>Description</th></tr></thead><tbody><tr><td>**Save Changes**</td><td>Saves the current menu structure to the database and applies it to the client area</td></tr><tr><td>**Load Preset**</td><td>Opens a dropdown with 5 ready-to-use menu presets</td></tr><tr><td>**Set Default**</td><td>Resets the menu to the original WHMCS default Primary Navbar</td></tr></tbody></table>

![Load Preset dropdown menu](https://doc.puq.info/uploads/images/gallery/2026-02/embedded-image-njnf69fl.png)*Load Preset dropdown — choose from Standard, Business Pro, Hosting Provider, Full Mega, or Minimal Clean*

- - - - - -

## Menu Structure

The left panel shows the current menu tree. Items can be:

- **Dragged and dropped** to reorder or change nesting level
- **Nested** up to 3 levels deep (parent &gt; child &gt; grandchild)
- **Expanded/collapsed** using the +/- buttons
- **Moved** up and down using the arrow buttons
- **Edited** by clicking the edit (pencil) button
- **Deleted** by clicking the delete (trash) button

![Menu structure with expanded nested items](https://doc.puq.info/uploads/images/gallery/2026-02/embedded-image-6pwhs7fh.png)*Menu Structure — example with Products, Resources, Support, Promotions, and My Account items with nested children*

- - - - - -

## Item Editor

The right panel contains the form for adding and editing menu items.

![Item Editor form with all fields](https://doc.puq.info/uploads/images/gallery/2026-02/embedded-image-wlkaylkm.png)*Item Editor — configure menu name, link, target, display rule, divider, and mega menu settings*

### Fields

<table id="bkmrk-field-description-me"><thead><tr><th>Field</th><th>Description</th></tr></thead><tbody><tr><td>**Menu Name**</td><td>The display text for the menu item. Must be unique. Includes an icon picker button for selecting a Font Awesome 5 icon.</td></tr><tr><td>**Menu Link**</td><td>The URL for the menu item. Use relative paths for internal pages (e.g., `cart.php`) or full URLs with `https://` for external links.</td></tr><tr><td>**Open in new tab?**</td><td>Whether the link opens in a new browser tab (`_blank`) or the same tab (`_self`).</td></tr><tr><td>**Display Rule**</td><td>Controls when the menu item is visible: **Always** (all visitors), **Existing Client** (logged-in clients only), or **Guest Client** (guests only).</td></tr><tr><td>**Nav divider**</td><td>Adds a horizontal dividing line before this item in dropdown menus.</td></tr><tr><td>**Mega menu**</td><td>Enables mega menu mode — displays a wide dropdown panel with custom HTML content instead of a standard dropdown.</td></tr><tr><td>**Mega menu text**</td><td>The HTML content for the mega menu panel. Supports any valid HTML including columns, images, links, and styled content.</td></tr></tbody></table>

### Buttons

<table id="bkmrk-button-description-u"><thead><tr><th>Button</th><th>Description</th></tr></thead><tbody><tr><td>**Update**</td><td>Updates the currently selected menu item with the form values (enabled only when an item is selected for editing)</td></tr><tr><td>**Add**</td><td>Adds a new menu item using the current form values</td></tr></tbody></table>

- - - - - -

## Multi-Language Labels

Click the **Show all languages** button below the Menu Name field to expand the translations panel. You can enter a translated menu name for each of the 27 supported languages.

![Multi-language labels panel with 27 language fields](https://doc.puq.info/uploads/images/gallery/2026-02/embedded-image-1jj42ecz.png)*Multi-language labels — enter translated menu names for Arabic, Azerbaijani, Catalan, Chinese, Croatian, Czech, Danish, Dutch, Estonian, Farsi, French, German, Hebrew, Hungarian, Italian, Macedonian, Norwegian, Polish, Portuguese-BR, Portuguese, Romanian, Russian, Spanish, Swedish, Turkish, and Ukrainian*

When a client visits the client area with a specific language selected, the matching translated label is displayed instead of the default Menu Name.

- - - - - -

## Mega Menu Templates

Below the Mega menu text field, 5 quick templates are available:

<table id="bkmrk-template-description"><thead><tr><th>Template</th><th>Description</th></tr></thead><tbody><tr><td>**Columns with Icons**</td><td>Multi-column layout with Font Awesome icons and grouped links</td></tr><tr><td>**Feature Cards**</td><td>Card-based layout for highlighting features or services</td></tr><tr><td>**Services Grid**</td><td>Grid layout for displaying service categories</td></tr><tr><td>**Contact &amp; Info**</td><td>Contact information panel with phone, email, and quick action buttons</td></tr><tr><td>**Promo Banner**</td><td>Promotional banner with call-to-action</td></tr></tbody></table>

Click any template button to insert its HTML into the Mega menu text field. You can then customize the content as needed.

- - - - - -

## Menu Presets

The **Load Preset** dropdown provides 5 ready-to-use menu configurations:

<table id="bkmrk-preset-description-s"><thead><tr><th>Preset</th><th>Description</th></tr></thead><tbody><tr><td>**Standard**</td><td>Default WHMCS menu structure with Products, Resources, Support, Promotions, and My Account</td></tr><tr><td>**Business Pro**</td><td>Professional business-oriented menu with enhanced navigation</td></tr><tr><td>**Hosting Provider**</td><td>Optimized for web hosting companies with hosting-specific menu items</td></tr><tr><td>**Full Mega**</td><td>Menu with mega menu panels enabled for rich dropdown content</td></tr><tr><td>**Minimal Clean**</td><td>Simplified, minimalist menu with essential items only</td></tr></tbody></table>

> **Note:** Loading a preset replaces the current menu structure. A confirmation dialog is shown before applying. After loading a preset, the page reloads to reflect the changes.# Navbar Styles

### Menu Manager addon **[WHMCS](https://puqcloud.com/link.php?id=77)**

##### [Order now](https://puqcloud.com/store/whmcs-addon-modules) | [Download](https://download.puqcloud.com/WHMCS/addons/PUQ_WHMCS-Menu-Manager/) | [FAQ](https://community.puqcloud.com/)

## Overview

The Navbar Styles page displays all available navbar styles as cards. Each style card shows the style name, icon, description, and an **Edit** button for customization.

![Navbar Styles list with all 10 styles](https://doc.puq.info/uploads/images/gallery/2026-02/embedded-image-hp89kbn0.png)*Navbar Styles — all 10 available styles with descriptions and Edit buttons*

- - - - - -

## Available Styles

<table id="bkmrk-style-description-de"><thead><tr><th>Style</th><th>Description</th></tr></thead><tbody><tr><td>**Default WHMCS**</td><td>Standard WHMCS navbar appearance with no modifications. No customization available.</td></tr><tr><td>**Modern Shadow**</td><td>Clean design with subtle shadows, smooth hover transitions and refined typography</td></tr><tr><td>**Dark Elegant**</td><td>Dark background navbar with light text, elegant hover effects and premium feel</td></tr><tr><td>**Gradient Wave**</td><td>Vibrant gradient backgrounds on hover, colorful and eye-catching transitions</td></tr><tr><td>**Minimal Underline**</td><td>Ultra-clean design with animated underline effects on hover, no borders</td></tr><tr><td>**Rounded Pill**</td><td>Rounded pill-shaped items with soft shadows and friendly, approachable design</td></tr><tr><td>**Glass Morphism**</td><td>Frosted glass effect with blur, transparency and modern glassmorphism aesthetic</td></tr><tr><td>**Neon Glow**</td><td>Vibrant neon glow effects on hover with dark background and luminous accents</td></tr><tr><td>**Flat Material**</td><td>Google Material Design inspired with elevation shadows and ripple-like effects</td></tr><tr><td>**Classic Bordered**</td><td>Traditional bordered design with clean lines, separators and classic aesthetics</td></tr></tbody></table>

- - - - - -

## Editing a Style

Click the **Edit** button on any style card to open the style editor page.

> **Note:** The Default WHMCS style has no customization options — it uses the standard WHMCS navbar without any CSS modifications.

- - - - - -

## Style Editor

The style editor provides a live preview and property controls for customizing the selected style.

![Style editor with live preview and property controls](https://doc.puq.info/uploads/images/gallery/2026-02/embedded-image-cpf5ixk6.png)*Style Editor — Glass Morphism style with live preview showing dropdown menu and customizable properties*

### Live Preview

The top section shows a live preview of the navbar with the current style settings applied. The preview includes sample menu items (Home, Services, Domains, Support) with a dropdown example, so you can see how the style looks in real-time as you adjust the properties.

### Style Properties

Each style has its own set of customizable properties. Common properties include:

<table id="bkmrk-property-description"><thead><tr><th>Property</th><th>Description</th></tr></thead><tbody><tr><td>**Background Color**</td><td>The background color of navbar items</td></tr><tr><td>**Background Opacity**</td><td>Opacity of the background color</td></tr><tr><td>**Border Color**</td><td>Color of the item borders</td></tr><tr><td>**Border Opacity**</td><td>Opacity of the borders</td></tr><tr><td>**Text Color**</td><td>Color of the menu item text</td></tr><tr><td>**Shadow Color**</td><td>Color of box shadows</td></tr><tr><td>**Hover Background Opacity**</td><td>Opacity of the background on hover</td></tr><tr><td>**Blur Amount**</td><td>Blur intensity for glass effects</td></tr><tr><td>**Dropdown Blur**</td><td>Blur intensity for dropdown menus</td></tr><tr><td>**Transition Duration**</td><td>Animation speed for hover effects (in seconds)</td></tr></tbody></table>

> Properties vary between styles. For example, Glass Morphism includes blur controls, while Gradient Wave includes gradient angle and colors.

### Action Buttons

<table id="bkmrk-button-description-s"><thead><tr><th>Button</th><th>Description</th></tr></thead><tbody><tr><td>**Save Changes**</td><td>Saves the current style properties to the database</td></tr><tr><td>**Reset to Defaults**</td><td>Restores the default values for all properties of this style</td></tr></tbody></table>

- - - - - -

## Client Area Examples

Below are examples of how different navbar styles appear in the WHMCS client area.

### Glass Morphism

![Glass Morphism style — mega menu](https://doc.puq.info/uploads/images/gallery/2026-02/embedded-image-r519dauh.png)*Glass Morphism — frosted glass effect with mega menu showing Get Help and Quick Actions*

![Glass Morphism style — dropdown menu](https://doc.puq.info/uploads/images/gallery/2026-02/embedded-image-aqr4acd4.png)*Glass Morphism — dropdown menu with transparent blur effect*

### Modern Shadow

![Modern Shadow style — mega menu](https://doc.puq.info/uploads/images/gallery/2026-02/embedded-image-j9zvbnno.png)*Modern Shadow — clean design with subtle shadows and mega menu*

![Modern Shadow style — dropdown menu](https://doc.puq.info/uploads/images/gallery/2026-02/embedded-image-xx53gkbf.png)*Modern Shadow — dropdown menu with smooth hover transitions*

### Dark Elegant

![Dark Elegant style — mega menu](https://doc.puq.info/uploads/images/gallery/2026-02/embedded-image-880cndzi.png)*Dark Elegant — dark background navbar with mega menu*

![Dark Elegant style — dropdown menu](https://doc.puq.info/uploads/images/gallery/2026-02/embedded-image-kwvnf99m.png)*Dark Elegant — dark navbar with dropdown menu and light text*

### Gradient Wave

![Gradient Wave style — mega menu](https://doc.puq.info/uploads/images/gallery/2026-02/embedded-image-mb1zz6gh.png)*Gradient Wave — vibrant gradient backgrounds with mega menu*

![Gradient Wave style — dropdown menu](https://doc.puq.info/uploads/images/gallery/2026-02/embedded-image-ltyk9in7.png)*Gradient Wave — colorful gradient effects with dropdown menu*

### Minimal Underline

![Minimal Underline style — mega menu](https://doc.puq.info/uploads/images/gallery/2026-02/embedded-image-4d0hztfn.png)*Minimal Underline — ultra-clean design with mega menu*

![Minimal Underline style — dropdown menu](https://doc.puq.info/uploads/images/gallery/2026-02/embedded-image-ubj1rzzs.png)*Minimal Underline — animated underline effect with dropdown menu*

### Neon Glow

![Neon Glow style — mega menu](https://doc.puq.info/uploads/images/gallery/2026-02/embedded-image-me87sk70.png)*Neon Glow — dark background with luminous mega menu columns*

![Neon Glow style — dropdown menu](https://doc.puq.info/uploads/images/gallery/2026-02/embedded-image-pldfuf68.png)*Neon Glow — neon accent colors with dropdown menu*

### Classic Bordered

![Classic Bordered style — mega menu](https://doc.puq.info/uploads/images/gallery/2026-02/embedded-image-nnlaabij.png)*Classic Bordered — traditional bordered design with mega menu*

![Classic Bordered style — dropdown menu](https://doc.puq.info/uploads/images/gallery/2026-02/embedded-image-wytcs9nt.png)*Classic Bordered — classic borders and separators with dropdown menu*# Settings

### Menu Manager addon **[WHMCS](https://puqcloud.com/link.php?id=77)**

##### [Order now](https://puqcloud.com/store/whmcs-addon-modules) | [Download](https://download.puqcloud.com/WHMCS/addons/PUQ_WHMCS-Menu-Manager/) | [FAQ](https://community.puqcloud.com/)

## Overview

The Settings page allows you to select the active navbar style for the WHMCS client area.

![Settings page with navbar style selector](https://doc.puq.info/uploads/images/gallery/2026-02/embedded-image-z6qu284r.png)*Settings — select the active navbar style from 10 available options*

- - - - - -

## Navbar Style

The main section of the Settings page displays all available navbar styles as selectable cards. Each card shows:

- **Style icon** — a colored icon representing the style
- **Style name** — the name of the style
- **Description** — a brief description of the visual effect

Click on a style card to select it. The currently active style is highlighted with a border.

### Available Styles

<table id="bkmrk-style-description-de"><thead><tr><th>Style</th><th>Description</th></tr></thead><tbody><tr><td>**Default WHMCS**</td><td>Standard WHMCS navbar appearance with no modifications</td></tr><tr><td>**Modern Shadow**</td><td>Clean design with subtle shadows, smooth hover transitions and refined typography</td></tr><tr><td>**Dark Elegant**</td><td>Dark background navbar with light text, elegant hover effects and premium feel</td></tr><tr><td>**Gradient Wave**</td><td>Vibrant gradient backgrounds on hover, colorful and eye-catching transitions</td></tr><tr><td>**Minimal Underline**</td><td>Ultra-clean design with animated underline effects on hover, no borders</td></tr><tr><td>**Rounded Pill**</td><td>Rounded pill-shaped items with soft shadows and friendly, approachable design</td></tr><tr><td>**Glass Morphism**</td><td>Frosted glass effect with blur, transparency and modern glassmorphism aesthetic</td></tr><tr><td>**Neon Glow**</td><td>Vibrant neon glow effects on hover with dark background and luminous accents</td></tr><tr><td>**Flat Material**</td><td>Google Material Design inspired with elevation shadows and ripple-like effects</td></tr><tr><td>**Classic Bordered**</td><td>Traditional bordered design with clean lines, separators and classic aesthetics</td></tr></tbody></table>

- - - - - -

## Saving

After selecting a style, click the **Save Settings** button at the bottom of the page. The selected style is immediately applied to the WHMCS client area.

- - - - - -

## Customize Styles

Click the **Customize Styles** link below the style cards to navigate to the Navbar Styles page, where you can edit colors, shadows, and other properties for each style.