AVADA : Soucis d’affichage sur mobile (Créer un compte)

  • WordPress :5.4
  • Statut : non résolu
7 sujets de 1 à 7 (sur un total de 7)
  • Auteur
    Messages
  • #2351958
    AXIOME
    Participant
    Initié WordPress
    15 contributions

    Bonjour,

    Ma configuration WP actuelle

    • Version de PHP/MySQL : Ionos… last one ? 🙂
    • Thème utilisé : AVADA
    • Extensions en place : Rien de spécial
    • Nom de l’hébergeur : Ionos
    • Adresse du site : http://s822237296.onlinehome.fr/

    Problème(s) rencontré(s) :

    Bonjour,

    J’ai réalisé pour une amie un site pour son activité d’ostéopathe. Seulement, la version mobile s’adapte trés mal. Les photos en haut de chaque page disparaissent sur la version mobile……. et certaines (notamment tarifs, contact), comportent des infos très importantes. Sauriez-vous m’aider à régler ce problème svp ?

    ACCUEIL

    Merci beaucoup pour votre retour, j’ai hâte de vous lire !

    Maxime

    #2352083
    Rock4Temps
    Participant
    Chevalier WordPress
    288 contributions

    Bonjour,

    Le théme Avada a son propre constructeur de page.

    Je ne connais pas Avada mais je pense que comme tous les contructeurs il doit y avoir des options avancées  de visibilté pour masquer certains éléments sur mobile.

    C’est ce qui apparait quand on inspecte le  code , certains éléments sont masqués par la régle CSS:

    Display: none

    Cordialement

    #2352167
    Rock4Temps
    Participant
    Chevalier WordPress
    288 contributions

    Bonjour

    A partir du back office de WordPress
    menu Apparence > personnaliser > css additionnel entrez le code ci dessous:

    @media screen and (max-width: 640px)
    body:not(.fusion-builder-ui-wireframe) .fusion-no-small-visibility {
        display: block !important;
    }

    cordialement

    #2352263
    AXIOME
    Participant
    Initié WordPress
    15 contributions

    Bonjour Rock4Temps,

    Merci beaucoup pour votre temps, c’est super sympa… ! Hélas, ça ne marche pas… 🙁

    Apparemment ce sont les images de fond (méthode que j’ai utilisé en tant que novice…) qui disparaissent dès que la taille d’écran est réduite.

    J’essaye de trouver mais je ne vois aucun tuto pour le moment…

    Merci en tout cas pour votre réponse.

    A bientôt,

    Maxime

    #2352269
    ferman
    Participant
    Maître WordPress
    3785 contributions

    Bonjour,

    Je n’ai pas vérifié l’incidence sur tout le site mais chez moi ça marche avec ce code CSS.

    @media screen and (max-width: 640px) {
     body #wrapper:not(.fusion-builder-ui-wireframe) .fusion-no-small-visibility {
      display: block !important;
     }
    }

    Il faut ajouter une précision (#wrapper) pour surpasser le code initial, déjà avec un !important.

    • Cette réponse a été modifiée le il y a 6 mois et 3 semaines par ferman.
    #2352273
    AXIOME
    Participant
    Initié WordPress
    15 contributions

    Génial, cela fonctionne. Merci mille fois ! 🙂

    #2360936
    Kler
    Participant
    Initié WordPress
    29 contributions

    Bonjour,

    La méthode de ferman est correcte, mais elle surpasse le code CSS de Fusion Builder. Dans Avada, tu as la possibilité de chosir si un élément s’affiche ou non sur la version mobile, voire de changer l’apparence complète d’un conteneur et de tous les éléments qu’il contient. Je sais je suis un peu en retard mais ton problème venait certainement de là. Première question à se poser : est-ce que ton conteneur était réglé sur “flex” ou “legacy” ? Deuxième question : avais-tu vérifié les option de visibilité de ton conteneur : “small screen” et “all screen” ?

7 sujets de 1 à 7 (sur un total de 7)
  • Vous devez être connecté pour répondre à ce sujet.