La navigation d'une application n'est jamais un détail. ac_sidebar gère les menus et sous-menus, filtre automatiquement ce que chaque rôle a le droit de voir, et s'adapte au design existant de votre page, sans une ligne de CSS à écrire.

Cette page utilise ac_sidebar pour sa propre navigation, à gauche. La démo ci-dessous tourne dans un cadre séparé, pour que vous puissiez essayer toutes les positions sans perturber la vraie navigation du site.

Position

Thème

Rôle utilisateur

Repli

Fonctionnalités

Menus et sous-menus

2 niveaux : un menu peut contenir des options directes et/ou un sous-menu. Un sous-menu ne peut pas lui-même contenir un sous-menu, la classe le signale en console si ça arrive.

Filtrage par rôle

Chaque option porte un droitMinimum (1 à 5). Un menu ou sous-menu sans aucune option visible pour le rôle courant se masque automatiquement, sans configuration supplémentaire.

Mode libre magnétique

Glissez la barre n'importe où à l'écran. Rapprochez-la d'un bord : elle s'y ancre et redevient une navigation classique, bouton épingler et burger inclus.

Repli intelligent

Rail d'icônes ou burger seul, déploiement automatique au survol de la souris, et un vrai point de rupture responsive intégré, pas de bricolage JS à ajouter pour le mobile.

Thème système

Aucune couleur imposée : la classe observe le fond, le texte et la couleur des liens de votre page, et en déduit une palette cohérente. Zéro convention à documenter pour vos clients.

Zéro dépendance

Un seul fichier JavaScript. CSS et jeu de 45 icônes SVG embarqués. Pas de jQuery, pas de build, pas de framework. Multi-instances, plusieurs sidebars indépendantes sur la même page.

Intégration en 3 minutes

1

Incluez le fichier

<script src="ac_sidebar.js"></script>

2

Placez un conteneur et instanciez

<div id="ma_sidebar"></div>

const sb = new AcSidebar('#ma_sidebar', {
    roleUtilisateur: 2,
    entete: { titre: 'Mon application' },
    menus: [
        { libelle: 'Accueil', icone: 'maison',
          chemin: '/accueil.php', droitMinimum: 5 },
        {
            libelle: 'Administration', icone: 'bouclier',
            enfants: [
                { libelle: 'Utilisateurs', icone: 'groupe',
                  chemin: '/utilisateurs.php', droitMinimum: 2 },
            ],
        },
    ],
});

3

C'est tout

Lien actif, repli, survol, mémorisation : tout est géré. Le JSON ne pilote que l'affichage, chaque page listée dans un chemin doit continuer à vérifier elle-même le droit d'accès côté serveur.

Options principales

Option	Type	Défaut	Description
`theme`	string	'clair'	'clair' \| 'sombre' \| 'systeme'
`position`	string	'gauche'	'gauche' \| 'droite' \| 'haut' \| 'bas' \| 'libre'
`roleUtilisateur`	number	5	1 à 5, plus petit = plus de pouvoirs
`pointRupture`	number	768	Largeur (px) sous laquelle la navigation se réplie automatiquement
`couleurs`	objet	null	Surcharge manuelle de 7 couleurs, prioritaire sur le thème

Liste complète des options et de l'API publique dans la documentation téléchargeable en bas de page.

ac_sidebar : 99€ TTC

Licence unique, utilisation illimitée, mises à jour incluses 1 an

La licence comprend :

Le fichier source ac_sidebar.js (code lisible, non obfusqué)
Le jeu de 45 icônes SVG intégré, enrichi au fil des mises à jour
La documentation complète au format PDF
Support technique par email pendant 1 an

Commander

Paiement sécurisé par PayPal. Livraison immédiate par email (code source, documentation et facture).

Télécharger la documentation complète (PDF)

Découvrir les autres classes

Composants JavaScript/PHP autonomes, zéro dépendance

149€

ac_sidebar : Barre de navigation JS configurable 99€

Aperçu confiné