Plugin WP Mega Menu : fonctionnalité, installation, configuration. Max Mega Menu – Plugin de menu WordPress polyvalent Mega Menu WordPress

domicile / Installation d'appareils

Lecture 8 min. Publié le 01.11.2016

Hé! Nous continuons à analyser les plugins WordPress les plus intéressants et les plus utiles ! Aujourd'hui, vous découvrirez un plugin super utile qui vous permettra de créer un menu déroulant horizontal. Vous pouvez insérer n'importe quel widget, texte, éditeur, photo, vidéo, formulaires, code html dans le menu déroulant.

Vous pourrez entièrement personnaliser l'apparence du menu et personnaliser le menu déroulant. Vous pouvez ajouter jusqu'à 8 huit colonnes au menu déroulant horizontal. Vous pouvez désactiver le menu déroulant pour appareils mobiles. Un plugin très flexible, vous pouvez faire un Super Menu !


Vous pouvez installer le Super Plugin directement depuis le panneau d'administration de WordPress. Allez sur la page : Plugins - Add New , entrez le nom du plugin dans le formulaire de recherche, appuyez sur Entrée, installez et activez le plugin.



réglages généraux .

Cliquez sur Comportement de l'événement, comportement de clic. Ici, vous avez le choix entre deux options :

  • Le premier clic ouvrira un sous-menu, le deuxième clic fermera le sous-menu, le premier clic ouvre le sous-menu, le deuxième clic ferme le sous-menu ;
  • Le premier clic ouvrira un sous-menu, le deuxième clic suivra le lien, le premier clic ouvre le sous-menu, le deuxième clic ouvre le lien.
  • Laissez la valeur par défaut, ne changez rien.

Comportement du menu mobile, comportement sur le menu mobile,

  • Standard - Les sous-menus ouverts resteront ouverts jusqu'à leur fermeture par l'utilisateur, Standard - un sous-menu ouvert restera ouvert jusqu'à ce que l'utilisateur le ferme.
  • Accordéon - Les sous-menus ouverts se fermeront automatiquement lorsqu'un autre sera ouvert, Accordéon - les sous-menus ouverts se ferment automatiquement lorsqu'un autre est ouvert.

sortie css, laissez la valeur par défaut, rien ne doit être changé ici.

Descriptions des éléments de menu, activer ou désactiver la description des éléments de menu.

Instances de menu actives, Certains thèmes afficheront l'emplacement du menu plusieurs fois sur la même page. Par exemple, votre thème peut afficher un emplacement de menu après le menu principal, puis à nouveau pour le menu mobile. Ce paramètre peut être utilisé pour garantir que le Max Mega Menu ne s'applique qu'à l'une de ces instances.

.

Thèmes de menus .

sélectionner le thème à modifier, c'est le menu que vous allez éditer. Vous pouvez créer et sélectionner un autre menu.

Titre du thème, laissez le titre du thème du menu par défaut.

Flèche, vous pouvez sélectionner la flèche affichée dans l'élément de menu avec un menu déroulant.

hauteur de la ligne, ligne de hauteur.

Indice Z, L'index Z peut être laissé par défaut.

Ombre, l'ombre du menu peut être personnalisée.

Transitions de survol, activer les transitions de survol sur les éléments de menu.

Réinitialiser le style du widget, désactiver les styles de widget Mega Menu.

barre de menu .

Hauteur des menus, hauteur des menus.

Fond de menu, couleur de fond des menus.

Remplissage de menu, couverture des menus.

Rayon de bordure de menu, rayon de bordure de menu.

Alignement des éléments de menu, emplacement des éléments de menu.

Arrière-plan de l'élément de menu, couleur d'arrière-plan des éléments de menu.

Arrière-plan de l'élément de menu (survol), couleur d'arrière-plan de l'élément de menu au survol.

Espacement des éléments de menu, espacement des éléments de menu.

Police de caractère, options de police, couleur, taille, position, famille, etc.

Police (Survol), survolez les options de police.

Rembourrage des éléments de menu,éléments de menu de rembourrage.

Bordure d'élément de menu, options de bordure d'élément de menu.

Bordure de l'élément de menu (survol), options de bordure d'élément de menu au survol.

Rayon de la bordure de l'élément de menu, paramètres de rayon de bordure d'élément de menu.

Diviseur d'élément de menu, séparateur de menus.

Mettez en surbrillance l'élément actuel, mettre en surbrillance l'élément de menu actuel.

Méga menus .

Fond de panneau, la couleur de fond du menu déroulant.

Largeur du panneau, la largeur du menu déroulant.

Rembourrage de panneau, tapisserie.

Bordure de panneau, couleur et taille de la bordure.

Rayon de bordure de panneau, rayon de bordure.

Rembourrage de l'article, remplissant l'élément de menu dans le menu déroulant.

Widget .

police d'en-tête, options de police du titre du widget dans le menu déroulant.

rembourrage d'en-tête, rembourrage d'en-tête.

marge de cap, rembourrage à partir des bordures du titre du widget.

Bordure d'en-tête, paramètres de bordure de bordure.

Police de contenu, police dans le contenu du widget.

Éléments de menu de deuxième niveau .

Police de caractère, police des éléments de menu du deuxième niveau.

Police (Survol), police de survol.

arrière-plan (Survol), survolez la couleur d'arrière-plan.

rembourrage, tapisserie.

marge, tiret.

frontière, frontière, frontière.

Éléments de menu de troisième niveau . Les mêmes paramètres, uniquement pour les éléments de menu du troisième niveau.

Menus volants .

Fond de menu, couleur de fond du menu déroulant du deuxième ou du troisième niveau.

Largeur des menus, largeur du menu.

Remplissage de menu, tapisserie.

Bordure de menu, la frontière.

Rayon de bordure de menu, rayon de bordure.

Contexte de l'article, couleur d'arrière-plan de l'élément de menu.

Arrière-plan de l'élément (survol), survolez la couleur d'arrière-plan de l'élément.

Hauteur de l'article, hauteur de l'élément de menu.

Rembourrage d'article,élément de rembourrage.

Police de l'article, la police du texte dans l'élément de menu.

Police de l'élément (survol), police de survol.

Diviseur d'articles, séparateur d'éléments.

menu mobile .

Concepteur de barre à bascule, voici à quoi ressemble le menu sur les appareils mobiles.

Point d'arrêt réactif, largeur pour accéder au menu mobile.

Basculer l'arrière-plan de la barre, la couleur de fond du bouton d'ouverture du menu mobile.

Désactiver la bascule mobile, vous pouvez désactiver le commutateur de menu.

Basculer la hauteur de la barre, la hauteur du commutateur de menu mobile.

Méga colonnes de menu, combien de colonnes dans le menu déroulant sur le site mobile.

Fond de menu, couleur d'arrière-plan du menu mobile.

Hauteur de l'élément de menu, hauteur de l'élément de menu.

Style personnalisé. Ici, vous pouvez ajouter votre Styles CSS pour le menu.

Enregistrez vos modifications.

Emplacements des menus .

- ici, vous pouvez créer des zones de menu, dans lesquelles vous pouvez ensuite ajouter des menus. Pour créer une zone pour le menu, cliquez sur le bouton - Ajouter un autre emplacement de menu .


Zone de menus vous pouvez ajouter au site en utilisant un shortcode ou un code php.


Sur la page: Apparence- Menu - Gestion de zone, vous pourrez ajouter un menu pour la zone.


Outils .

cachette, ici, vous pouvez vider le cache CSS, ce n'est pas nécessaire, le cache est vidé automatiquement à chaque fois que vous enregistrez le menu.

Fiche de données, supprimer toutes les données de plugin stockées dans la base de données WordPress. Uniquement si le plugin est supprimé !

Thème d'exportation, vous pouvez exporter le thème du méga menu au format JSON ou PHP.

Thème d'importation, vous pouvez importer le thème du méga menu.

permettre, cochez la case ici pour activer le méga menu.

un événement, ici, vous pouvez choisir comment le menu déroulant s'ouvrira.

effet, Vous pouvez sélectionner un effet pour le menu déroulant.

thème, thème de menu, par défaut.

Après avoir activé le méga menu, dans chaque widget de la page, au survol, un bouton apparaîtra - Mega Menu . Cliquez sur ce bouton pour personnaliser le menu déroulant de cet élément de menu.


Davantage, vous ouvrirez une fenêtre. En haut à droite, appuyez sur la case large pour sélectionner un widget et l'ajouter au menu. En haut à droite, vous pouvez choisir le nombre de colonnes dans le menu déroulant. Les widgets peuvent être répartis sur le panneau déroulant, vous pouvez spécifier quelle partie le widget occupera, par exemple 1/2 ou 1/3. Cliquez sur les flèches droite et gauche pour spécifier la partie occupée par le widget.


Pour ouvrir et personnaliser le widget, ajoutez-y du contenu, etc., sur le côté droit du widget, cliquez sur l'icône de la clé. Personnalisez le widget et enregistrez-le.


Masquer le texte, masquer le texte de l'élément de menu.

Masquer la flèche, masquer la flèche.

masquer l'élément sur mobile, masquer l'élément de menu sur les appareils mobiles.

masquer l'élément sur le bureau, masquer l'élément de menu sur les ordinateurs.

Alignement des éléments de menu, emplacement de l'élément de menu.

Sous-menu Aligner, emplacement du menu de deuxième niveau.

Masquer le sous-menu sur mobile, masquer le menu de deuxième niveau sur les appareils mobiles.

Sauvegarder les modifications.



Tout est prêt ! Enregistrez le menu, allez sur le site et profitez du résultat !

Attention! Après avoir activé le méga menu, votre style de menu par défaut sera complètement modifié. Vous devrez personnaliser le style du menu dans les paramètres, sur l'onglet "Thèmes de menus".

Avez-vous des questions? Écrire un commentaire! Bonne chance!

Le menu est la base de toute navigation sur le site. Grâce au menu, l'utilisateur peut rapidement naviguer sur le site et trouver les informations dont il a besoin. On peut affirmer que le site "commence" par un menu, car seul cet élément peut donner à l'utilisateur une idée de la structure de la ressource Internet.

WordPress prêt à l'emploi offre une gamme assez large d'options pour travailler avec les menus. Ainsi, les outils intégrés permettent de créer un ou plusieurs menus, avec n'importe quelle imbrication, d'y ajouter des liens arbitraires, etc. Mais souvent les outils standards ne suffisent pas au propriétaire du site pour construire un menu répondant à tous ses besoins.

Méga plugin Max Mega Menu

Habituellement, les développeurs de thèmes ne fournissent aucun paramètre avancé pour personnaliser l'apparence du menu sur le site. Par exemple, les effets de survol et de clic, etc. Le puissant plugin gratuit Max Mega Menu est conçu pour étendre les outils de navigation du site Web et offre les fonctionnalités suivantes pour cet utilisateur de WordPress :

  • C'est basé sur système standard WordPress ;
  • prise en charge de plusieurs zones de menu (chacune avec sa propre configuration) ;
  • offrant un glisser-déposer pratique à l'aide Glisser-déposer;
  • capacité d'affichage Widgets WordPress au menu;
  • personnaliser les styles de menu à l'aide de l'éditeur de thème intégré ;
  • prise en charge des styles de sous-menu ;
  • Support Flotter, Intention de survol ou alors Cliquez sur ouvrir un sous-menu ;
  • effets Disparaître, s'estomper, glisser vers le haut ou alors Faire glisser lors de l'accès à un sous-menu ;
  • la possibilité d'ajouter des icônes aux éléments de menu ;
  • options d'élément de menu avancées, y compris "Masquer le texte", “Désactiver la communication", "Cachez-vous sur téléphone mobile etc.;
  • aligner les éléments de menu à gauche ou à droite de la ligne et de l'élément de menu parent ;
  • conception adaptative pour un affichage sur n'importe quel écran ;
  • prise en charge de différents filtres/hooks ;
  • grande vitesse de travail;
  • documentation détaillée et forum de support.

Paramètre de menu Max Mega

Tout d'abord, le plugin doit être installé et activé. Voyons maintenant ce qu'il peut faire. Pour cela, rendez-vous dans la section admin Apparence -> Menu. Il est à noter que si votre site ne possède pas encore de menu de navigation, alors créez-le en ajoutant les éléments nécessaires. Nous avons parlé en détail de la façon de créer un menu sur un site WordPress dans nos articles précédents. Après cela, faites attention au bloc d'options sur la gauche, qui s'appelle Paramètres du menu Max Mega.

Pour que le plugin commence à fonctionner, cochez l'option Inclus.

Examinons rapidement chacun des paramètres.

Paramètre Événement détermine quel événement déclenche les éléments de sous-menu.

Effet responsable des apparences d'animation et de sa vitesse.

En option Thème Vous pouvez choisir la conception du menu. Par défaut, il n'y a qu'un seul thème. Nous allons vous montrer comment créer le vôtre ci-dessous.

Cliquez dessus, après quoi une fenêtre contextuelle avec les paramètres s'ouvrira devant vous.

La fenêtre des paramètres est divisée en trois onglets.

Languette Méga Menu vous permet de déterminer si un menu normal ou un menu avec des widgets sera affiché. Si ce dernier est choisi, alors dans la liste Mode d'affichage des sous-menus doit être spécifié Méga menu et sélectionnez les widgets nécessaires dans la liste adjacente. Si un menu régulier est requis, sélectionnez Menu déroulant.

Languette Paramètres vous permet de personnaliser les éléments du menu. Il existe des options de texte, des liens, des icônes, une adaptabilité et plus encore.

Sur l'onglet icône vous pouvez définir une icône pour les éléments de menu.

On peut en conclure que les paramètres présents dans le plugin vous permettent de configurer de manière flexible chaque élément de navigation individuellement.

Maintenant, nous devrions considérer des paramètres de plug-in plus globaux. Max Méga Menu. Pour cela, rendez-vous dans le menu admin dans la rubrique Mega Menu -> Paramètres de base. On peut voir qu'il existe toutes sortes d'options techniques pour le plugin. En principe, ils peuvent être laissés par défaut. Ici aussi, vous pouvez définir le comportement du menu lorsque la souris est cliqué, son adaptabilité, les paramètres CSS etc.

Au chapitre Méga Menu -> Thèmes menu, vous pouvez modifier un thème existant ou créer un nouveau thème. On voit qu'il y a assez un grand nombre de une variété de paramètres, y compris la couleur, la taille, l'ombre, l'animation, le rembourrage, l'orientation pour le bureau et le mobile. De plus, si nécessaire, vous pouvez utiliser votre propre CSS-règlements. Les thèmes ainsi créés peuvent être appliqués dans l'éditeur de menu.

Au chapitre Mega Menu -> Emplacements des menus Vous pourrez créer de nouvelles zones pour placer le menu. Après la création, vous recevrez un spécial PHP-code qui permet de publier des zones n'importe où sur le site, dans des fichiers thématiques, ainsi qu'un shortcode, grâce auquel des zones de menu peuvent être ajoutées directement aux articles/pages.

Chapitre Méga Menu -> Outils sert à exporter/importer des thèmes précédemment créés, et il y a aussi plusieurs options plus techniques (cache clearing, suppression complète toutes les données du plug-in).

Comme conclusion

brancher Max Méga Menu dispose d'un grand nombre de paramètres, grâce auxquels vous pouvez faire une navigation originale et colorée sur votre site.

Veuillez cliquer sur l'un des boutons pour savoir si vous avez aimé l'article ou non.

J'aime 1 Je n'aime pas

Hé! Dans ma vie, comme toujours, il y a beaucoup d'événements, il est donc très difficile de trouver du temps pour un blog. Hier nous avons acheté des billets pour le Sri Lanka et nous allons bientôt nous envoler pour 4 mois, venez nous rendre visite ! Et maintenant je cherche la plus belle robe de mariée :))
Aujourd'hui, nous allons parler de la création d'un menu dans WordPress, ainsi que de l'ajout de ces blocs dans des zones arbitraires du modèle.
Nous apprendrons à personnaliser le menu et à le modifier comme bon nous semble.

Modification et personnalisation des menus dans WordPress

Tout d'abord, analysons les fonctionnalités disponibles dans le panneau d'administration du blog. Dans les nouveaux templates, compatibles avec les dernières versions de WordPress, l'affichage des menus est assez simple et la personnalisation n'est pas trop difficile.

Après avoir créé un thème enfant qui peut être modifié sans affecter le thème principal, ajoutons la fonction suivante à son fichier function.php.

1 2 3 register_nav_menus( array ( "menu supplémentaire" => __( "Menu supplémentaire" , "Votre nom de sujet" ) ) ) ;

register_nav_menus(array("additionalmenu" => __("Menu supplémentaire", "Votre nom de thème")));

Si vous ne créez pas de thème enfant, ajoutez-le au fichier de fonctions principal de votre thème.

Cette fonctionnalité nous permettra d'ajouter un menu WordPress supplémentaire à notre modèle et de créer une autre zone pour celui-ci.

Après l'ajout, rendez-vous dans le panneau d'administration dans la section "Gérer les zones":

Une zone de sujet supplémentaire devrait apparaître avec le titre que nous avons donné dans la fonction.

Cliquez sur "Utiliser le nouveau menu" si vous souhaitez modifier les sections de la zone supplémentaire ou sélectionnez "Accueil". Ensuite, les mêmes sections seront affichées dans la nouvelle zone comme dans le menu principal.

Dans notre cas, nous créons un nouveau menu appelé Supplémentaire :

Sélectionnez la zone de thème "Menu supplémentaire" pour cela.

Mais maintenant, nous devons lier cette zone aux blocs de modèle. Par exemple, nous devons créer un menu supplémentaire sous l'en-tête d'un site WordPress. Accédez au fichier header.php ou copiez-le dans le thème enfant. Ajoutez ce qui suit après la balise body :

1 2 3 <div id = "menu supplémentaire" > ( array( "theme_location" =>"menu supplémentaire")); ?></div>

"menu supplémentaire")); ?>

Voyons le résultat :

Nous avons un menu supplémentaire au-dessus de l'en-tête. Nous devons maintenant lui définir des styles, aligner les éléments sur une ligne et abaisser le bloc sous l'en-tête.

Nous apportons les modifications suivantes au fichier style.css :

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 #navigation de menu supplémentaire ( largeur : 940px ; /* largeur du conteneur */ marge : 0 auto ; ) #additionalmenu li ( display : inline ; padding : 10px ; /* padding */ margin : 20px 0 ; ) #additionalmenu ( width : 100% ; top : 420px ; /* Retrait à partir du bord supérieur */ couleur de fond : #000 ; /* couleur de fond */ position : relative ; )

#additionalmenu nav ( width: 940px; /*container width */ margin: 0 auto; ) #additionalmenu li ( display: inline; padding: 10px; /* padding */ margin: 20px 0; ) #additionalmenu ( width: 100% ; haut : 420 px ; /* marge supérieure */ couleur d'arrière-plan : #000 ; /* couleur d'arrière-plan */ position : relative ; )

Voyons ce qui se passe:

L'affichage du menu que nous avons créé est encore loin d'être idéal, mais avec les précautions nécessaires, vous pouvez l'amener au look approprié pour votre blog.

Widgets et plugins pour ajouter des menus à WordPress

Je suggère de regarder une vidéo sur la création d'un menu dans WordPress :

Dans l'article sur le widget "Menu personnalisé" a été mentionné. Analysons-le plus en détail.

Allez dans "Apparence" - "Widgets", trouvez le widget "Menu personnalisé" et faites-le glisser vers la zone disponible pour votre thème et adaptée au blog :

Dans notre cas, le bloc de menu est ajouté à la barre latérale. Pour cela, nous avons sélectionné des sections du bloc supplémentaire que nous avons créé.

En conséquence, le bloc suivant sera affiché dans la barre latérale à droite :

En plus du widget standard intégré au thème, il existe également de nombreux plugins supplémentaires conçus pour créer différents types de menus : verticaux, horizontaux, déroulants, etc.

Par exemple, voici un plugin pour créer un menu multiniveau vertical dans WordPress : Navgoco Vertical Multilevel Slide Menu.

Ou le widget de menu déroulant plus personnalisable.

Les widgets avec des effets JQwery pour les menus sont également populaires, par exemple : JQuery Slick Menu Widget.

Prenons un exemple de la façon dont cela fonctionne.

Après avoir installé le widget jQuery Slick Menu, allez dans "Apparence" - "Widgets".

Parmi la liste des widgets disponibles, un nouveau, installé par nos soins, devrait apparaître. Déplacez-le vers une zone accessible, dans notre cas la barre latérale :

Ouvrons ses paramètres :

Nous sélectionnons le nom du menu (sections que nous avons créées), Tab Text - le nom du bloc qui sera affiché sur le site, l'emplacement (nous sélectionnerons Left - à gauche), Offset - le retrait du haut bord en pixels, Vitesse d'animation - vitesse d'animation (Rapide). Vous pouvez sélectionner le menu de fermeture automatique pour faire disparaître automatiquement le bloc. Et choisissez la couleur du bloc. Cliquez sur enregistrer et voyez le résultat :

Un menu déroulant est apparu sur le côté gauche de l'en-tête. Lorsque vous cliquez sur la langue, les sections apparaissent :

Lorsque vous cliquez à nouveau, le bloc disparaît à nouveau.

Ce n'est qu'un des moyens d'installer, de modifier et d'afficher des menus dans WordPress.

Choisissez le moyen le plus approprié et le plus pratique de créer un menu pour votre blog WordPress. Bonne chance!

Il est bien connu que WordPress 3.0 a ajouté la prise en charge des menus personnalisés (menus personnalisés). La chose, à mon avis, est extrêmement pratique et utile. En fait, c'est de là que vient cet article.

La commodité réside dans le fait que vous pouvez désormais créer et configurer des menus directement à partir du panneau d'administration, en ajoutant des liens en cliquant sur les cases à cocher et en modifiant l'ordre des liens par simple glisser-déposer. Vous pouvez ajouter des liens vers des pages, des catégories et des publications individuelles au menu. Peut créer menus en couches, vous pouvez également ajouter vos propres liens arbitraires au menu, ce que WordPress ne connaît pas. En général, totale liberté d'action.

Cependant, pour qu'une telle "liberté" soit disponible, disons, avec un léger mouvement de la souris, vous devez configurer la sortie d'un menu arbitraire dans le modèle.

L'utilisation de tels menus sera extrêmement pratique si vous utilisez un multisite Fonctionnalité WordPress, car il sera possible de configurer différents menus pour différents sites et d'utiliser un modèle pour eux.

Remarque : le menu fonctionne via la taxonomie WordPress (nav_menu) et des liens arbitraires (externes) sont écrits dans la table de base de données des articles principaux. Cette approche est plus souple et dynamique, mais nécessite la génération constante de tels menus.

Register_nav_menus(array("top" => "Top menu", //Nom de l'emplacement du menu dans le template "bottom" => "Bottom menu" //Nom d'un autre emplacement du menu dans le template));

Nous avons maintenant enregistré 2 menus avec les identifiants "top" et "bottom" avec leurs noms respectifs. Des identifiants sont nécessaires pour les utiliser dans le thème, pour indiquer l'endroit où, via la fonction de sortie wp_nav_menu() , le menu créé dans le panneau d'administration sera affiché. Nous verrons les noms des emplacements enregistrés dans le panneau d'administration lorsque nous irons dans la section Apparence -> Menu.

Une fois les menus enregistrés, accédez au panneau d'administration et créez nos propres menus (dans cet exemple, 2 menus):

    Définissez le nom du menu (le menu dans le modèle peut être affiché sous le nom spécifié à l'aide de la fonction wp_nav_menu()

    Création d'éléments de menu On utilise le bloc de gauche : pages de liens, rubriques

  1. Nous choisissons où sera situé le menu, puisque nous avons enregistré 2 menus, nous aurons 2 options : "Top Menu" et "Lower Menu".

La prise en charge des menus personnalisés dans WordPress est activée pour chaque thème séparément, avec cette ligne dans le fichier functions.php add_theme_support("menus"); Cependant, cette ligne n'est pas nécessaire si nous enregistrons le menu. Dans ce cas, le support sera activé automatiquement.

Afficher des menus personnalisés via la fonction wp_nav_menu

Les menus sont enregistrés et créés, il reste à les ajouter au modèle. Ceci est fait par la fonction wp_nav_menu(), qui peut prendre les paramètres suivants :

Wp_nav_menu(array("menu" => "", // (string) Le nom du menu affiché (spécifié dans le panneau d'administration lors de la création du menu, // est prioritaire sur emplacement spécifié theme_location - si spécifié, le paramètre theme_location est ignoré) "container" => "div", // (chaîne) Conteneur de menu. Emballage ul. La balise du conteneur est spécifiée (par défaut dans la balise div) "container_class" => "", // (chaîne) classe du conteneur (balise div) "container_id" => "", // (chaîne) id du conteneur (balise div) "menu_class " => "menu", // (chaîne) classe du menu lui-même (balise ul) "menu_id" => "", // (chaîne) id du menu lui-même (balise ul) "echo" => true, // (boolean ) Affichage ou retour pour traitement "fallback_cb" => "wp_page_menu", // (string) Fonction (de secours) utilisée si le menu n'existe pas (échec de l'obtention) "before" => "", // (chaîne) Texte avant chaque lien "après" => "", // (chaîne) Texte après chaque lien "link_before" => "", // (string) Texte avant l'ancre (text) du lien "link_after" => "", // (string) Texte après l'ancre (text) du lien "depth " => 0, // (entier) Profondeur d'imbrication (0 - illimité, 2 - menu à deux niveaux) "walker" => "", // (objet) Classe qui collecte le menu. Par défaut : new Walker_Nav_Menu "theme_location" => "" // (chaîne) L'emplacement du menu dans le modèle. (la clé est indiquée par laquelle le menu a été enregistré dans la fonction register_nav_menus)));

Dans cet exemple, vous devez insérer dans le modèle approximativement (selon les paramètres dont vous avez besoin) les 2 codes suivants :

#1. Afficher le menu par emplacement

Menu principal. Insérez dans l'en-tête du modèle (header.php), où le menu supérieur (top) sera affiché :

"menu", "theme_location"=>"top", "after"=>" /")); ?>

Affiche le menu créé dans l'admin, attaché à l'emplacement "Top Menu" avec une structure similaire :

Menu inférieur. Insérez dans le pied de page du modèle (footer.php), où le menu du bas (du bas) sera affiché :

Affiche le menu créé dans l'admin, attaché à l'emplacement "Bottom Menu". La structure sera identique à la première.

Veuillez noter que dans la première variante, les paramètres étaient passés via un tableau (array). En seconde ligne. Les deux options sont correctes. Ceci est courant pour les fonctions WordPress - les paramètres peuvent être passés sous forme de tableau ou de chaîne (la chaîne est ensuite convertie en tableau).

#2 Afficher le menu par nom

Pour afficher un menu par son nom, vous pouvez utiliser l'argument "menu". Le nom est indiqué, celui qui a été défini lors de la création du menu dans le panneau d'administration. Dans notre exemple (voir photo) "Menu principal". L'argument menu a priorité sur theme_location , ce qui signifie que si nous affichons par nom, le paramètre theme_location sera ignoré.

Vous pouvez spécifier un ID de menu au lieu d'un titre. Ainsi, si vous modifiez le nom du menu, le code continuera de fonctionner. L'ID du menu peut être affiché dans l'URL lors de la modification du menu :

Remarques

Supprimer l'emballage Div

Vous avez peut-être remarqué que le menu est souvent "enveloppé" d'une balise div inutile. Il peut être supprimé en spécifiant un paramètre vide "container"=>"" dans les arguments de la fonction wp_nav_menu().

Modification des paramètres par défaut

Afin de ne pas spécifier constamment le même paramètre pour les menus insérés, ils peuvent être remplacés dans functions.php . Cela se fait via le filtre wp_nav_menu_args :

Register_nav_menus(array("top" => "Menu du haut", "bottom" => "Menu du bas")); add_filter("wp_nav_menu_args", "mon_wp_nav_menu_args"); function my_wp_nav_menu_args($args="")( $args["container"] = ""; return $args; )

Par analogie, vous pouvez créer vos propres arguments par défaut : $args["argument"] = "value" .

Vérifier si un menu est enregistré

WordPress a également une fonction de condition : has_nav_menu("top") - vérifie si l'emplacement du menu supérieur a été enregistré. Si le menu n'est pas spécifié, alors la fonction wp_nav_menu() fonctionnera comme wp_list_pages() , mais la div "wrapper" restera, malgré le fait que nous l'ayons supprimée dans les arguments. Vous pouvez résoudre ce problème comme ceci :

Si (has_nav_menu("top"))( wp_nav_menu(array("container" => "", "theme_location" => "top", "menu_class" => "menu")); ) else ( echo "

"; }

Méga menus déroulants- une belle trouvaille de design. Naviguer sur le site contenant un grand nombre de pages a toujours été un problème. Les menus statiques classiques à la sitemap se développent rapidement à mesure que le nombre de pages augmente et prennent beaucoup de place. Les menus déroulants dynamiques peuvent considérablement économiser de l'espace sur la page, mais la convivialité est sacrifiée - la navigation nécessite un travail de souris actif et assez précis. Légèrement manqué et le mauvais menu est révélé.

L'impulsion pour le développement du concept de méga-menu était probablement l'interface ruban Microsoft Office 2007. Ce concept est à mi-chemin entre un simple menu statique et une liste déroulante dynamique. D'une part, un tel menu est assez informatif et intuitif, d'autre part, il réduit considérablement les manipulations de souris nécessaires. S'ouvrant, il peut tout utiliser espace disponibleécran, qui permet à l'utilisateur de jeter un œil à tous les éléments proposés dans ce contexte, et, si nécessaire, est masqué.

Quoi qu'il en soit, le méga-menu est désormais, comme on dit, à la mode, et si vous ne l'avez pas encore utilisé, alors vous devriez y regarder de plus près.

UberMenu : Plugin WordPress Mega Menu

Ce plugin multifonctionnel peut être placé en toute sécurité à la première place de cette revue : il crée méga menu complet, a une quantité incroyable d'options différentes, y compris le contrôle de la couleur d'arrière-plan et de la police, la taille de la police, etc. Et tout cela se fait à partir d'un panneau de paramètres puissant et pratique.

En outre, le menu propose également un certain nombre d'autres fonctionnalités intéressantes, telles que :

  • Grille réactive intégrée
  • Réglage individuel de la largeur de chaque colonne ainsi que définition de la largeur par défaut
  • Combiner des éléments de menu en groupes
  • Centrage des éléments de menu sur des lignes horizontales
  • Images d'arrière-plan personnalisées
  • Sous-menus déroulants contenant un grand nombre d'éléments.
Dans l'ensemble, un plugin très puissant que je recommande vivement.

Coût : 19 $

Menu principal méga

Plugin très populaire et largement utilisé Menu principal méga sait trouver un équilibre entre fonctionnalité et simplicité. Plus de 10 outils différents sont à votre disposition pour créer des menus déroulants, qui peuvent contenir texte, images, liens et widgets. De plus, des paramètres de couleur illimités et plus de 600 polices Google.

Coût : 15 $

Liquida Méga Menu

Liquida Méga Menu- un plugin moderne et multifonctionnel qui conviendra à la fois utilisateurs ordinaires, et développeurs - il peut être facilement intégré dans votre propre thème développé.

Le plugin offre un large éventail d'options pour création de menus avec un design moderne et élégant : orientation verticale ou horizontale, possibilité d'inclure des éléments de menu des liens, des images et même des cartes de produits WooCommerce ou Easy Digital Downloads, qui peuvent être utiles lors du développement de boutiques en ligne.

Coût : 19 $

Sky Méga Menu

Trois options de conception mobile, 9 combinaisons de couleurs, une grille personnalisée, des formes et 360 icônes vectorielles. Cet ensemble permet à Sky Mega Menu de prendre la place qui lui revient parmi les siens.

Coût : 6 $

WP Méga Menu

Plugin de la catégorie incontournable. De nombreux paramètres et options, fonctionnent avec des catégories, des sous-catégories et des messages, Optimisation du référencement et deux schémas de couleurs prédéfinis (sombre et clair), qui peuvent cependant être facilement modifiés à votre guise.

Coût : 29 $

NOO Menu

Afin de comprendre le panneau de configuration NOO Menu vous n'avez même pas besoin de lire la documentation - tout est tellement intuitif. Avec un aperçu en direct à portée de main, vous pouvez simplement modifier les valeurs et déplacer les curseurs pour voir l'effet. Le jeu de couleurs peut être modifié de manière complètement arbitraire et chaque option peut être enregistrée sous son propre nom, et le nombre de ces options est illimité.

Le contenu des éléments de menu peut être du texte, des liens, des images, des vidéos, des formulaires et divers widgets. Il utilise sa propre grille à 12 colonnes pour tout accueillir.

Coût : 15 $

Menu Héros – Plugin WordPress Mega Menu Responsive

Hero Menu vous permet de lier des liens vers des articles, des catégories, des URL externes à des éléments de menu, et également d'y afficher des articles de blog avec une image en vedette. À dernière version a annoncé un support complet pour la plate-forme WooCommerce. Pour un travail pratique, il dispose d'un éditeur glisser-déposer intégré.

Le design est moderne et élégant et bien sûr complètement.

Coût : 19 $

Superfly - Plugin de menu WordPress réactif

La dite menu volant- la dernière tendance dans le monde de la conception de sites Web. Un tel menu «sommeille» tranquillement dans le coin de la page sous la forme d'une icône, ne prenant presque pas de place, et lorsque vous le survolez, il s'ouvre, déplaçant les éléments de la page et ne les chevauchant pas.

L'un des représentants de ce type de méga-menu est Superfly - Responsive WordPress Menu Plugin. Un instrument impressionnant à la fois en termes de design et de fonctionnalités.

Coût : 22 $

Basculer le menu

Avec la popularité croissante des appareils mobiles, les menus contextuels (ou contextuels) deviennent importants, car ils peuvent économiser beaucoup d'espace sur l'écran.

Le menu bascule est très simple, menu minimaliste, qui, néanmoins, remplit parfaitement sa fonction principale.

Coût : 5 $

Menu flottant WP Pro

Menu flottant WP Pro est un plugin 2 en 1. Navigateur de menu pour un site d'une page et les étiquettes de menu. De plus, avec ce plugin, vous pouvez, au moins visuellement, transformer votre site traditionnel en un site moderne d'une page. WP Floating Menu Pro fournira un défilement fluide d'une partie de la page à une autre.

A la disposition du développeur WP Floating Menu Pro propose les 13 et 7 diverses options emplacement sur la page, options de personnalisation, couleur, contenu et nombre de points.
Pour les écrans inférieurs à 480px, il est possible de arrêt automatique menu.

Coût : 17 $

Plugin WordPress Flexi Menu

Flexi Menu, c'est 5 types de menus différents entièrement personnalisables : menu volant, large (largeur de page), large+descriptions, large+images et vertical.

Coût : 14 $

Max Méga Menu (Gratuit)

Très bon plugin avec éditeur de menu glisser-déposer et la possibilité d'intégrer presque tous les widgets dans les éléments de menu - des formulaires de contact aux cartes Google.

Capable de convertir automatiquement les menus réguliers existants en un méga menu avec un contrôle total sur le processus de conversion et la sauvegarde ou la réaffectation des actions appropriées.

© 2023 ermake.ru -- À propos de la réparation de PC - Portail d'information