Softaculous

Topic : menu site mobile

Posted By: ramaougeriesdepomme on April 1, 2021, 4:54 pm

Bonjour,
Mon site est quasiment fini.
www.lesramaougeries.fr
Par contre, le menu principal ne s'affiche pas quand je passe en mode mobile.
Pouvez vous m'aider ?
Merci
Cordialement
Marie-Claude Laizé

Posted By: MicroDrie on April 2, 2021, 8:12 am | Post: 1

Bonjour Marie-Claude Laizé,

Quel dommage maintenant que vous avez créé un beau site Web et le plus important, le menu déroulant ne fonctionne pas.

Si le navigateur prend en charge JavaScript (js), la page Web le verra. Lorsque la largeur de l'écran devient plus petite, le balisage CSS entraîne le remplacement de la liste de menu horizontale par un bouton de menu "Hamburger". Avec ce bouton hamburger, vous pouvez ouvrir le menu sous forme de liste verticale à l'écran.

L'intention est que lorsque vous cliquez sur le bouton hamburg, la classe CSS sur le bouton hamburger sera remplacée par la classe qui formate votre menu sous forme de liste verticale. Et quelque chose ne va pas dans l'environnement js.

Je pense que le moyen le plus simple est de vérifier d'abord si votre modèle "propre" prêt à l'emploi (sans rien changer) fonctionne. En particulier, le fichier functions.js contient la routine d'ouverture / fermeture du menu. Vous avez peut-être (inconsciemment) ajusté quelque chose là-bas pour qu'il contienne une erreur.

Cordialement
MicroThree

Posted By: ramaougeriesdepomme on April 2, 2021, 1:30 pm | Post: 2

Bonjour MicroDrie,
merci pour cette réponse.

Mais dans ce domaine, c'est complètement en dehors de mes capacités.
Pouvez-vous m'aider d'une autre façon ?

Le bouton "sandwich" apparaît sur le mobile.
Mais il ne se passe rien quand je clique dessus.

Utilisé : Thème "fischer" de SitePad

Posted By: ramaougeriesdepomme on April 2, 2021, 1:48 pm | Post: 3

(suite du précédent message)
Une fois sur le code source de ma page, comment trouver le code qui gère ce "bouton sandwich" ?

Merci

cordialement
Marie-Claude

Posted By: MicroDrie on April 2, 2021, 3:15 pm | Post: 4

Malheureusement, je ne trouve pas le modèle "fischer" dans ma version de SitePad que j'utilise.

Avec les classes CSS, assurez-vous que le menu est affiché horizontalement sur un grand écran (PC). Si vous réduisez la largeur de votre navigateur, le bouton de menu hamburger apparaîtra. Le formatage CSS fonctionne donc. Je vois aussi que javascript (js) voit que mon navigateur prend en charge js. Comme js fonctionne dans le navigateur, cliquer sur le bouton de menu hamburger devrait démarrer un script js. Ce script js (nommé functions.js) devrait provoquer l'ouverture (et la fermeture à nouveau) du menu vertical sous le bouton de menu hamburger. C'est là que ça va mal.

J'ai transféré votre site sur mon PC et j'essaye de découvrir ce qui ne va pas.

Posted By: ramaougeriesdepomme on April 2, 2021, 3:41 pm | Post: 5

merci Micro Drie.

en pièce jointe les captures d'écran du header (version pc, version tablette, version mobile)

avez vous besoin du code ?

Cordialement

Marie-Claude

Posted By: MicroDrie on April 2, 2021, 9:02 pm | Post: 6

Chère Marie-Claude,

Je n'ai besoin d'aucun code car j'ai téléchargé votre site Web sur mon PC et je peux l'ajuster et le tester là-bas. Votre site est conçu de manière à pouvoir fonctionner avec et sans Java Script. Le problème est que le bouton hamburger apparaît, mais ne transmet probablement pas le clic. Je dois savoir comment et où ce processus se déroule et tourne mal. Malheureusement, cela prend du temps.

Pouvez-vous me donner le lien de votre modèle que vous utilisez?

MicroThree

Posted By: MicroDrie on April 2, 2021, 9:54 pm | Post: 7

Chère Marie-Claude,

Je pense que ce n'est pas le modèle "fischer" modèle, mais le modèle "Fishing". Vos pages Web modifiées sont assez différentes de ce modèle.

Souhaitez-vous faire ce qui suit:

Créez une nouvelle page Web par défaut vide sans rien changer ni ajouter quoi que ce soit d'autre.
Ouvrez ensuite cette page dans le navigateur.
Réduisez la largeur de votre navigateur afin que le bouton hamburger s'affiche.
Cliquez sur le bouton hamburger et voyez si le menu s'ouvre ou non.

Quel est le résultat?

MicroThree

Posted By: ramaougeriesdepomme on April 3, 2021, 6:49 am | Post: 8

Bonjour MicroDrie,

je viens de faire les étapes demandées.
Quand la page est au format "mobile", le bouton hamburger apparaît.
Quand je clique dessus, il ne se passe rien.

Cordialement

Marie-Claude

Posted By: MicroDrie on April 4, 2021, 10:59 am | Post: 9

Quand je regarde le code d'une page Web "Allons à la pêche", je vois qu'elle est basée sur l'utilisation de pagelayer avec des lignes blanches. Ceux-ci manquent sur votre site et sont très différents.

Avez-vous ajouté d'autres éléments au modèle?

Posted By: ramaougeriesdepomme on April 4, 2021, 11:22 am | Post: 10

Bonjour,
si je me souviens bien :
- j'ai déplacé le menu principal
- j'ai remplacé le diaporama d'image dans le header par une image fixe
- j'ai ajouté notre logo
- j'ai supprimé le bouton "contact"

Je ne vois rien d'autre... désolée....

Cordialement
Marie-Claude

Posted By: MicroDrie on April 5, 2021, 7:30 am | Post: 11

Chère Marie-Claude,

Le problème est que le résultat de vos pages actuelles est très différent de ce que je considère comme le résultat initial du modèle "Pêche".
La seule chose à laquelle je peux penser pour vous maintenant est que vous essayez d'ajouter une section du modèle "Pêche" à une page de test. J'espère qu'alors toutes les routines nécessaires seront rechargées et écrasées. Ensuite, la question est de savoir si le menu de cette section fonctionne ou non.

MicroDrie

Posted By: ramaougeriesdepomme on April 5, 2021, 10:43 am | Post: 12

Bonjour,
J'ai réussi !
Je n'osais pas , j'ai essayé et ça fonctionne ! Yesssss

J'ai changé de thème ; j'ai vérifier l'affichage et le fonctionnement du bouton "hamburger".
Puis je suis revenue sur mon thème initial "fishing" -> tout fonctionne impeccablement.

Je n'ai plus qu'à traduire mon footer en français.

Génial.

Merci beaucoup pour votre aide et Joyeuses Pâques

Cordialement

Marie-Claude

Posted By: MicroDrie on April 5, 2021, 2:44 pm | Post: 13

Bonjour Marie-Claude,

Génial que nous ayons réussi avec l'aide de Google translate, l'option de traduction dans le navigateur Chrome et l'option de débogage dans le navigateur Web Firefox et une poignée d'outils de programmation, car malheureusement je ne parle pas la langue Française!

Cela a probablement mal tourné lorsque vous avez ajouté quelque chose à votre site Web (comme un menu ou une autre fonctionnalité).

Après toutes ces batailles, vous comprendrez certainement pourquoi il vous est conseillé de faire une sauvegarde de votre site. Cela peut être fait au niveau du site via le fournisseur d'hébergement où votre site Web est hébergé.

Ce qui est également pratique, c'est que vous enregistrez simplement toutes les pages Web pour vous-même localement via votre navigateur. Si vous rencontrez à nouveau des problèmes, vous saurez au moins ce que vous aviez sur votre site. Vous disposez également des textes utilisés que vous pouvez remettre lorsque vous recommencez avec un thème.

Cordialement

MicroTrois