Documentation

System - NicePanel Documentation

Overview

System - NicePanel is a Joomla system plugin that adds sliding top and bottom tabbed panels to your site. Modules assigned to specific positions are rendered as collapsible tabs, styled with Bootstrap 5 and powered by pure JavaScript. Fully integrated with Joomla’s core, it offers flexible tab styles, alignments, and positioning options—all while keeping your template’s design in control.

Installation

  1. Download: Obtain the latest package from richeyweb.com (#) or the update server.  
  2. Install: In Joomla Administrator, go to System > Install > Extensions, upload the package, and install.  
  3. Enable: Navigate to System > Manage > Plugins, search for "System - NicePanel," and enable it.

How It Works

NicePanel transforms Joomla modules into tabbed, sliding panels at the top or bottom of your site:  

  1. Assign modules to custom positions (e.g., nicepaneltop or nicepanelbottom).  
  2. Module titles become clickable tabs.  
  3. Clicking a tab toggles the panel open or closed, revealing the module content.  
  4. Customize appearance and behavior via plugin settings.

The plugin hooks into Joomla’s rendering process, injecting panels into the <body> and loading minimal CSS/JS from /media/plg_system_nicepanel/.

Configuration

Configure NicePanel in System > Manage > Plugins > System - NicePanel. Settings are split into three fieldsets:

Basic Settings

  • Hide in Template(s)  
    • Select templates where NicePanel should not appear. Useful for excluding specific layouts or mobile views.

Top Modules

  • Module Position  
    • Enter the position (e.g., nicepaneltop) for top panel modules.
  • Tab Type
    • Choose between Bootstrap 5 tabs or pills for tab style.
  • Align Tabs
    • Set tab alignment (Bootstrap 5 classes: justify-content-*, nav-fill, nav-justified).
  • Panel Position
    • Define the CSS positioning. Sticky or relative recommended; fixed/absolutemay need extra styling.
  • Panel Margin  
    • Toggle a margin around the panel content.
    • Useful for instances when a module might not display correctly if given a margin.

Bottom Modules

Identical to top settings.  For Module Position, choose the correct position (e.g. nicepanelbottom)

Usage

  1. Create Module Positions: In your template or module manager, define positions like nicepaneltop or nicepanelbottom.  
  2. Assign Modules: Go to Content > Site Modules, create or edit modules, and assign them to your chosen positions.  
  3. Set Titles: Each module’s title becomes its tab label.  
  4. Configure Plugin: Adjust tab type, alignment, and positioning in the plugin settings.  
  5. Test: View your site—click tabs to toggle panels open/closed.

Notes

  • Panels won’t appear in the administrator backend, non-HTML pages, the component template (popups), or if the template is excluded.  

Dependencies

  • Joomla 5

Customization

  • CSS: Override styles in your template’s stylesheet—NicePanel uses minimal CSS by design.  
    • Guide coming soon