Comment configurer les menus verticaux et les onglets mobiles dans Flatsome : le guide complet

0332315

Flatsome La dernière version introduit de nouvelles fonctionnalités intéressantes, notamment Éléments de l'en-tête du menu vertical répondre en chantant Menu superposé mobile à onglets. Ces fonctionnalités sont particulièrement adaptées aux sites de commerce électronique de grande taille. Elles facilitent la navigation et permettent d'organiser et de présenter le contenu, en particulier sur les appareils mobiles. Ce tutoriel vous guidera pas à pas dans la mise en place de menus verticaux et de menus à onglets mobiles afin d'améliorer l'expérience de navigation de l'utilisateur.

Enseigner le thème Flatsome

Pourquoi ai-je besoin d'un menu vertical et d'un menu à onglets mobiles ?

La mise en place de menus verticaux et de menus mobiles à onglets peut aider les sites de commerce électronique à offrir une expérience de navigation plus intuitive, plus propre et plus efficace, améliorant ainsi l'image de marque du site.Performances en matière de référencementCes menus permettent d'assurer la cohérence de l'image de marque et la réactivité du site. Ces menus optimisent non seulement l'expérience d'accès aux ordinateurs de bureau et aux téléphones portables, mais ils renforcent également l'aspect professionnel général du site. Pour les sites de commerce électronique comportant un grand nombre de produits ou de contenus, il est essentiel d'avoir les deux types de menus.

Image [2] - Comment mettre en place des menus verticaux et des onglets mobiles dans Flatsome : un guide complet

Étape 1 : Ajouter l'élément d'en-tête du menu vertical

Accès aux paramètres de l'en-tête

Suivez les étapes ci-dessous pour accéder au menu vertical et le configurer :

  • Dans le backend de WordPress, allez dans Flatsome > Tête.
Image [3] - Comment mettre en place des menus verticaux et des onglets mobiles dans Flatsome : un guide complet
  • commandant en chef (militaire) menu vertical est glissé dans la disposition de l'en-tête.
Image [4] - Comment mettre en place des menus verticaux et des onglets mobiles dans Flatsome : un guide complet
  • Cliquez sur l'icône Paramètres à côté de l'élément de menu vertical pour ouvrir les options de personnalisation du menu.
Image [5] - Comment mettre en place des menus verticaux et des onglets mobiles dans Flatsome : un guide complet

Menu vertical personnalisé

existent Options du menu vertical Les paramètres suivants peuvent être ajustés dans le menu

  • Taille de l'icôneRedimensionner les icônes du menu vertical : Redimensionner les icônes du menu vertical.
Image [6] - Comment mettre en place des menus verticaux et des onglets mobiles dans Flatsome : un guide complet
  • Hauteur et largeur du bouton: Modifie la hauteur et la largeur du bouton.
Image [7] - Comment mettre en place des menus verticaux et des onglets mobiles dans Flatsome : un guide complet
  • copiesLes catégories : Vous pouvez choisir d'afficher les catégories par défaut ou de ne les afficher qu'en cas de clic.
Image [8] - Comment mettre en place des menus verticaux et des onglets mobiles dans Flatsome : un guide complet
  • Couleur du texte et arrière-plan: vous pouvez personnaliser la couleur du texte (par exemple, texte noir sur fond blanc ou texte blanc sur fond noir) et définir le menu vertical de la page d'accueil.couleur de fond.
Image [9] - Comment mettre en place des menus verticaux et des onglets mobiles dans Flatsome : un guide complet

Options du menu contextuel

Il est également possible d'activer menu contextuelqui permet aux menus verticaux de se développer automatiquement sur la page d'accueil. Cette approche peut ne pas fonctionner en conception et il est généralement recommandé de ne pas la cocher. Pour l'instant, elle peut rester décochée.

Image [10] - Comment mettre en place des menus verticaux et des onglets mobiles dans Flatsome : un guide complet

Étape 2 : Définition de la catégorie de menu

  • entrer dans Apparence > Menu.
Image [11] - Comment mettre en place des menus verticaux et des onglets mobiles dans Flatsome : un guide complet
  • Créez un nouveau menu et cochez menu vertical Options.
Image [12] - Comment mettre en place des menus verticaux et des onglets mobiles dans Flatsome : un guide complet
  • Ajouter des catégories et des liens qui s'affichent dans le menu vertical.
Image [13] - Comment mettre en place des menus verticaux et des onglets mobiles dans Flatsome : un guide complet
  • Veillez à ce que les éléments du menu soient présentés dans l'ordre que vous souhaitez.
Image [14] - Comment mettre en place des menus verticaux et des onglets mobiles dans Flatsome : un guide complet

Étape 3 : Configuration du menu de l'onglet mobile

Activer le menu à onglets

La dernière version de Flatsome ajoute Menu superposé mobile à onglets Caractéristiques. Il est parfait pour améliorer l'expérience de navigation sur mobile. La méthode pour l'activer est la suivante :

  • commutateur à Flatsome > Options du Thème > En-tête > Déplacer.
  • Faites défiler vers le bas jusqu'à onglet (d'une fenêtre) (informatique) sélectionnez 2 étiquettes.
Image [15] - Comment mettre en place des menus verticaux et des onglets mobiles dans Flatsome : un guide complet
  • Personnalisez le texte de l'étiquette. Par exemple, vous pouvez remplacer "Menu" par "Menu principal" ou "Catégorie".
Image [16] - Comment mettre en place des menus verticaux et des onglets mobiles dans Flatsome : un guide complet
  • Réglez l'étiquette pour qu'elle indique votre menu verticalCela permet aux utilisateurs d'accéder facilement à toutes les catégories sur mobile.
Image [17] - Comment mettre en place des menus verticaux et des onglets mobiles dans Flatsome : un guide complet

effet du test

Vous pouvez voir que vous avez réussi à configurer le menu vertical et le menu de l'onglet mobile. Il ne vous reste plus qu'à enrichir les catégories et le contenu du menu.

Image [18] - Comment mettre en place des menus verticaux et des onglets mobiles dans Flatsome : un guide complet

résumés

En mettant en place des menus verticaux et des menus mobiles à onglets, les sites de commerce électronique peuvent non seulement améliorer l'expérience de l'utilisateur sur ordinateur et sur mobile, mais aussi rendre le site plus facile à naviguer et plus réactif, ce qui est particulièrement adapté aux plates-formes de commerce électronique avec une large gamme de produits. Grâce à ces nouvelles fonctionnalités de Flatsome, le contenu du site web peut être organisé et présenté plus efficacement, ce qui augmente le temps d'attente des utilisateurs et leur envie d'acheter.

Pour plus de tutoriels et d'informations sur WordPress, suivez les liens suivantsRéseau de fluctuation des photonsavec les tutoriels WordPress les plus complets et les plus actifs.Communauté d'échange WordPress.


Contactez nous
Vous ne pouvez pas lire l'article ? Contactez-nous pour une réponse gratuite ! Aide gratuite pour les sites personnels et les sites de petites entreprises !
① Tel : 020-2206-9892
② QQ咨询：1025174874
(iii) Courriel : info@361sale.com
④ Horaires de travail : du lundi au vendredi, de 9h30 à 18h30, jours fériés.
© Déclaration de reproduction
Cet article a été rédigé par Early Season

Lien vers cet article :https://www.361sale.com/fr/49977
L'article est protégé par le droit d'auteur et doit être reproduit avec mention.

LA FIN
Tutoriel WordPressConstructeur de site web autodidacte WPWordPressConstructeur de site web autodidacte WordPress
# WordPress# Tutoriel du thème Flatsome
Si vous l'aimez, soutenez-le.
félicitations15 partager (joies, avantages, privilèges, etc.) avec les autres
Avatar de début de saison - Photon Flux | Service professionnel de réparation de WordPress, dans le monde entier, réponse rapideMembre Diamant
Recommandé
commentaires achat de canapé

Veuillez vous connecter pour poster un commentaire

    Pas de commentaires

Couvercle de l'utilisateur
Avatar de début de saison - Photon Flux | Service professionnel de réparation de WordPress, dans le monde entier, réponse rapideMembre Diamant
文章目录
鲜嫩爽口大肥蛆的头像-光子波动网 | 专业WordPress修复服务，全球范围，快速响应

鲜嫩爽口大肥蛆4月21日 15:140

通过 FTP 禁用插件： 重命名 wordfence 插件文件夹，解除封锁。 后台解封 IP： 若能进入后台，去 Wordfence → Tools → Live Traffic 解封被拦 IP。 调整防火墙设置： 设置为“学习模式”，并将自己 IP 加入白名单。 必要时更换插件： 替换为 iThemes Security 或 All In One WP Security。
Le voleur sera l'avatar des tripes de rat - Photon Fluctuation | Service professionnel de réparation de WordPress, dans le monde entier, réponse rapideMembre Diamant

lit. un voleur aura les tripes d'un ratBadge - Peu connu - Photon Fluctuation Network | Service professionnel de réparation de WordPress, dans le monde entier, réponse rapide18 avril 16:430

C'est un bon nom.
Kind rural people's avatar - Photon Fluctuation | Service professionnel de réparation de WordPress, dans le monde entier, réponse rapide

Des ruraux bienveillants18 avril, 11:390

Lorsqu'un plugin est en conflit avec un thème, ce qui entraîne un chargement lent de la page, vous pouvez vérifier les conflits en désactivant les plugins un par un, en mettant à jour les versions des plugins et des thèmes, en ajustant les paramètres des plugins pour réduire la consommation de ressources, en utilisant des outils de vérification de la compatibilité tels que "Health Check & Troubleshooting" pour résoudre le problème, et en activant les plugins de mise en cache et les outils d'optimisation pour améliorer les performances du site web et assurer la compatibilité des plugins et des thèmes ainsi que le chargement rapide du site. compatibilité des plugins et des thèmes et le chargement rapide du site.
Rouler sur l'avatar d'une grand-tante - Photon Fluctuations | Services professionnels de réparation de WordPress, dans le monde entier, réponse rapide

profiter de la grande tante et de l'oncle de qqn.17 avril 19:320

Lorsque WordPress affiche "Désolé, vous n'avez pas accès à cette page", c'est généralement parce que les autorisations du compte ont été modifiées de manière incorrecte. Il y a deux façons d'y remédier : si vous pouvez accéder à la base de données, vous pouvez modifier le champ des autorisations de l'utilisateur dans phpMyAdmin pour restaurer votre statut d'administrateur ; si vous ne pouvez pas vous connecter au backend ou manipuler la base de données, vous pouvez également ajouter temporairement un code au fichier functions.php du thème via FTP pour créer un nouveau compte d'administrateur afin de vous connecter au backend et de corriger les autorisations. Les deux méthodes peuvent restaurer efficacement les droits d'accès, il est recommandé de sauvegarder les données du site web avant l'opération.
Lexer's Avatar - Photon Flux Network | Service professionnel de réparation de WordPress, dans le monde entier, réponse rapide

Rexhausen16 avril 17:391

Si l'éditeur Elementor reste bloqué dans l'écran de chargement ou apparaît vide, ne vous inquiétez pas, c'est en fait assez commun et est généralement causé par la mise en cache, les conflits de plugin, les problèmes de thème ou le manque de mémoire. Vous pouvez essayer de le vérifier étape par étape : Tout d'abord, ouvrez le "Mode sans échec" d'Elementor pour voir s'il n'y a pas de conflit de plugin ou de thème. Désactivez temporairement le plugin de mise en cache, et videz le cache de votre navigateur et de votre site web en même temps. Essayez de remplacer votre thème par le thème par défaut de WordPress, tel que Twenty Twenty-Four, et testez si l'éditeur s'ouvre correctement. Vérifiez si la mémoire PHP dans Elementor > System Info est d'au moins 256M, si ce n'est pas le cas, demandez à votre administrateur de serveur de l'augmenter. Utilisez les outils de développement de votre navigateur (appuyez sur F12) pour voir s'il y a des erreurs rouges, ce qui vous aidera à localiser le problème plus rapidement. Assurez-vous qu'Elementor et les plugins que vous avez installés sont à jour, car les différences de version peuvent parfois causer des problèmes. Enfin, cliquer sur "Régénérer CSS" dans Elementor > Outils peut parfois résoudre les problèmes de chargement. Si vous avez essayé toutes ces choses et que cela ne fonctionne pas, vous devrez consulter les journaux d'erreurs de votre serveur ou envoyer votre site au support technique d'Elementor pour qu'il y jette un coup d'œil. La plupart du temps, ce problème est résolu, alors ne vous inquiétez pas trop.
Avatar d'un petit soldat - Photon Fluctuation Network | Service professionnel de réparation de WordPress, dans le monde entier, réponse rapide

tirailleurs15 avril 16:170

Les raisons les plus courantes pour lesquelles l'éditeur WordPress perd du contenu après l'avoir sauvegardé sont les conflits de plugins ou de thèmes, les problèmes de cache, les échecs d'écriture dans la base de données, le blocage de l'API REST ou les interférences avec le navigateur. Il est recommandé de vérifier les plugins, de vider le cache, de changer le thème par défaut, de vérifier l'état du site et les journaux de débogage pour localiser le problème étape par étape.
Le voleur sera l'avatar des tripes de rat - Photon Fluctuation | Service professionnel de réparation de WordPress, dans le monde entier, réponse rapideMembre Diamant

lit. un voleur aura les tripes d'un ratBadge - Peu connu - Photon Fluctuation Network | Service professionnel de réparation de WordPress, dans le monde entier, réponse rapide14 avril 17:590

Si les polices personnalisées ne fonctionnent pas dans WordPress, cela peut être dû à des chemins d'accès incorrects aux fichiers de police, à des sélecteurs CSS mal appliqués, à un formatage de police incompatible ou à des problèmes de priorité CSS. Assurez-vous que le fichier de police est chargé correctement et dans un format compatible, et vérifiez que les règles CSS sont appliquées correctement à l'élément cible. Si les paramètres du thème ont la priorité sur les polices personnalisées, ajustez également les paramètres correspondants. Videz également le cache et utilisez les outils de développement du navigateur pour vérifier si d'autres règles CSS remplacent les paramètres de police.
Zhejiang spotted hyena avatar - Photon Fluctuation | Service professionnel de réparation de WordPress, dans le monde entier, réponse rapide

Hyène tachetée du Zhejiang14 avril 17:111

Opération sur la base de données : Utilisez une requête SQL pour supprimer toutes les métadonnées liées à All in One SEO de la table wp_postmeta. Fonction de réinitialisation du plugin : Trouver l'option de réinitialisation ou d'effacement des données dans les paramètres du plugin All in One SEO. WordPress CLI : Utilisez l'outil de ligne de commande pour supprimer en masse les métadonnées liées au plugin. Suppression manuelle : Supprimez les informations SEO une par une via la page d'édition du backend de WordPress.