Themler et le Menu Vertical

Mise à jour : 4 avril 2016

Présentation du Menu Vertical

Le Menu Vertical est normalement utilisé pour permettre aux visiteurs du site web de naviguer entre les pages.

Le Contrôle Menu Vertical est généralement placé dans la barre latérale (sidebar) de gauche ou de droite.

Ajout du Menu Vertical

1. Dans votre template Themler, vous devez ajouter le contrôle dans lequel vous voulez afficher le Menu Vertical (Onglet Insert > More > Add Control).

2. Dans le backend de votre CMS, vous devez ajouter le Menu Vertical dans la position choisie.

Si par exemple vous créez un template WordPress et que vous voulez afficher votre Menu Vertical dans la position WP Secondary Widget Area, alors dans Themler vous ajoutez le contrôle WP Secondary Widget Area dans la seconde sidebar, et dans le backend WordPress vous ajoutez le widget Vertical Menu dans la position WP Secondary Widget Area.

Une fois ajouté dans le backend du CMS, le Menu Vertical est alors visible dans Themler.

Pensez à vérifier que vous avez bien activé l’affichage de la sidebar, dans laquelle vous avez ajouté le Menu Vertical, dans Themler (onglet Layout > Right Sidebar (ou Left Sidebar) > Show On Template), autrement vous ne verrez pas le Menu Vertical.

Il vous suffit de cliquer sur le Menu Vertical pour le sélectionner et ainsi activer l’onglet Vertical Menu du ruban.

menu vertical Themler

Vous avez alors accès à toutes les options de paramétrage du Menu Vertical.

Menu Vertical Themler

Paramétrage du Menu Vertical

En utilisant les options Levels (niveaux), vous pouvez choisir la manière dont les sous-éléments du Menu Vertical doivent s’ouvrir :

  • No submenu (pas de sous-menu) : Les sous-éléments ne sont pas affichés.
  • Expanded (étendu) : Tous les sous-éléments s’affichent dans le menu.
  • On hover (au survol) : Au survol de la souris, une liste de sous-éléments s’ouvre, mais la page de l’élément parent n’est pas chargée.
  • With Reload (avec recharge) : Au survol de la souris, une liste de sous-éléments et la page de l’élément parent sont chargées.

Vous devez utiliser les options Item et Subitem pour définir l’apparence des éléments et des sous-éléments du Menu Vertical pour les états default (par défaut), active et hovered (survolé).

L’option Icon (pour les options Item et Subitem) vous permet de mettre une icône à côté du texte de chaque élément de menu.

Dans la section Responsive (mode adaptatif), vous pouvez activer l’affichage de l’icône pour le Menu Vertical en mode adaptatif et paramétrer le mode d’affichage approprié pour le sous-élément sur de plus petits écrans :

  • No submenu (pas de sous-menu) : Les sous-éléments ne sont pas affichés en mode adaptatif.
  • Expanded (étendu) : Tous les sous-éléments s’affichent ouverts dans le menu vertical lorsque la page est chargée.
  • On Click (sur clic) : En cliquant sur un élément parent, la liste des sous-éléments s’ouvre, mais la page de l’élément parent n’est pas chargée.
  • With Reload (avec recharge) : En survolant l’élément parent, une liste de sous-éléments et la page de l’élément parent sont chargées.