problème d'affichage iPad

Réduire
X
 
  • Filtrer
  • Heure
  • Afficher
Tout effacer
nouveaux messages

  • problème d'affichage iPad

    Bonjour à tous

    J’ai remarqué, que l’article de ma première page dépasse du cadre sur un iPad Apple
    Que c’est article et coupé et que la partie coupée ne peut être affiché.
    Sur quel élément puis-je intervenir pour corriger cet état sans démonter ma page dans les autres modes de visualisation. (ordi, téléphones,ect…).

    J'utilise gantry5



    Merci D'avance

  • #2
    Re : problème d'affichage iPad

    Bonjour et bienvenu,

    un lien vers le site ?
    tu as du surement faire du copier/coller ... non ?
    Ce forum, vous l'aimez ? il vous a sauvé la vie ? Vous y apprenez chaque jour ? Alors adhérez à l'AFUJ https://www.joomla.fr/association/adherer
    Cette année, le JoomlaDay FR a lieu à Bruxelles, les 20 et 21 mai 2022, plus d'infos et inscriptions : www.joomladay.fr

    Commentaire


    • #3
      Re : problème d'affichage iPad

      Adresse du site concerné :


      J’ai tapé le texte, directement dans le champ de joomla. Et dans l’affichage du code source, il n’y a que des balises paragraphes <p>

      Sur l’image jointe on constate

      Le menu c’est décalé sur la gauche. Ce qui est très bien, il qui montre que le Template réagie a son environnement.
      Une partie du texte n’est plus accessible, oups pas bien.

      Commentaire


      • #4
        Re : problème d'affichage iPad

        Je cherche des hypothèses, de chemin possible d'action, pas forcement une réponse absolu et ultime.

        Commentaire


        • #5
          Re : problème d'affichage iPad

          Salut,
          Piece jointe non visible.
          Il faut glisser l'image uploadée dans le second tableau et tout en bas, cliquer Insérer dans le texte.
          Sinon, colle la dans n'importe quel site de partage de fichiers en ligne.

          Un petit effort d'orthographe, juste pour la compréhension de ton pb :
          Que c’est article et coupé ...
          J'imagine que c'est :
          Que cet article est coupé ...

          Opinion très perso :
          Gantry 5 est un template construit sur des principes assez différents des templates habituels, entre autres l'utilisation de YAML.
          Je pense que tu trouveras relativement peu de support ici.
          Mais il a l'air de fonctionner correctement, donc pourquoi pas.
          Cependant, la prise en main n'est pas évidente.

          Pour ton souci, effectivement, j'arrive à le voir sur mon iPad.
          Mais ma version de Hydrogen est correcte sur iPad.
          Quel éditeur ?
          Un copié /collé de Word comme le suggère manu93fr ?
          A éviter. Ou au moins vérifier le code (Word a la mauvaise habitude de rajouter des styles inline mal venus et autres joyeusetés).

          Raconte ce que tu as fait avec plus de détails pour que l'on puisse t'aider.
          Un message d’erreur sur votre site Joomla ... ayez le reflexe de consulter lla base de connaissance : https://kb.joomla.fr

          Ce forum, vous l'aimez ? il vous a sauvé la vie ? Vous y apprenez chaque jour ? Alors adhérez à l'AFUJ https://www.joomla.fr/association/adherer

          Commentaire


          • #6
            Re : problème d'affichage iPad

            Aucun problème de responsive sur ipad de mon coté

            J’ai tapé le texte, directement dans le champ de joomla. Et dans l’affichage du code source, il n’y a que des balises paragraphes <p>
            ça, c'est tout a fait normal

            pour nous envoyer des images du problème ... passer en mode avancé
            Ce forum, vous l'aimez ? il vous a sauvé la vie ? Vous y apprenez chaque jour ? Alors adhérez à l'AFUJ https://www.joomla.fr/association/adherer
            Cette année, le JoomlaDay FR a lieu à Bruxelles, les 20 et 21 mai 2022, plus d'infos et inscriptions : www.joomladay.fr

            Commentaire


            • #7
              Re : problème d'affichage iPad

              Renvoi de la Pièce jointe non visible.



              Pour l’orthographe, le problème sera à jamais insoluble, mais je suis près à reformuler indéfiniment.
              Bien que j’ai l’impression que c’est l’un de mes problème qui engendrera le plus de réponses.
              Plus que les réponses techniques, oups désolé pour le mauvais esprit.

              Pour l’utilisation de l’ YAML je ne modifie pas ce que je ne comprends pas ou j’essaie.
              La prise en main de Gantry5 n’ai pas évidente car il n’y a aucune information en français sur le mode de fonctionnement, qui reste intuitif temps que l’on ne rencontre pas de problème non traité par leur interface.

              Vu mon niveau dans la langue de Molière je vous laisse imaginé mon niveau dans la langue de
              check spire (jeux de mot shakespeare).

              Ma version Hydrogen (v / g5_hydrogen)

              Editeur de code : Dreamweaver

              Si je fais un Copier-coller de Word je vérifie le code et enlève toutes balises superflues.

              Compte-rendu des opérations.
              Agrandissement du header de la Template a 300px de haut, insertion d’une image d’arrière-plan
              Fichier : _header.scss
              Ajout des codes dans l’iD : #g-header
              background-image:url(../../custom/images/bandeau01.jpg);
              height: 300px;

              Modification de la taille du logo.
              Fichier : _core.scss
              Ajout des codes dans la classe : .gantry-logo
              width: 500px;

              Pour le menu.
              Ajout des icônes devant chaque bouton, via l’interface du module de gantry5 dans joomla

              Pour le contenue de l’article, j’ai tous supprimer
              Configuration > composant Articles > onglet Articles
              Tout en rouge sauf
              Titre de l'article positionné sur Afficher en vert.
              Fichiers joints

              Commentaire


              • #8
                Re : problème d'affichage iPad

                Si l’ipad a un affichage Retina, sa résolution 2048 x 1536
                Si c’est un iPad standard la résolution est de 1024 x 768
                Je pense fortement que le problème agit que sur cette résolution. Et que sur safari ?

                Donc la question est :
                Puis-je ciblé que les iPad dans cette résolution 1024 X 768 ?
                En créent une classe qui n’agirais que sur les articles ?
                et dans quel fichier ?

                merci.

                Heu, je regrette le temps ou on codé en dur dans le bloc-notes

                Commentaire


                • #9
                  Re : problème d'affichage iPad

                  Heu, je regrette le temps ou on codé en dur dans le bloc-notes
                  Eh oui, et les ipad et autres bidules n'existaient pas

                  Le template utilise un display flex qui n'est pas superbement géré actuellement.
                  Peut-être en ajoutant un prefixe -webkit ?
                  ou en changeant de template
                  UP, le plugin universel à découvrir sur https//up.lomart.fr
                  bgMax
                  , AdminOrder, MetaData, Zoom, ArtPlug, Custom, Memo, Filter, ... sur http://lomart.fr/extensions

                  Commentaire


                  • #10
                    Re : problème d'affichage iPad

                    @stereo02
                    si je comprends bien ton explication, tu as un pb de méthodologie p/r ton utilisation de ce template particulier.
                    Si tu commences à rajouter des width et des height n'importe où, tu n'es pas sorti de l'auberge.
                    Pourquoi ?
                    Parce que ce qui est stylé (application de style CSS) pour le desktop s"applique aux formats tablette/mobile si ce n'est pas re-stylé dans les media queries et vice-versa.
                    T'imagine bien que la width d'un élément est calculée au petit poil pour les différents affichages.

                    En outre, ce template est très précis, toute modif a des conséquences.

                    Mon conseil, vire tout ce que tu as modifié dans les fichiers.

                    Et essaie en premier de passer par le gestionnaire de template d'hydrogen pour traiter le max de modifs possible.

                    Si ça ne te suffit pas, alors applique la méthode conseillée dans la doc Gantry :

                    Adding a Custom Style Sheet | Gantry Documentation


                    Tu vas te retrouver avec un fichier custom.scss
                    dans
                    g5_hydrogen/custom/scss/custom.scss
                    dans lequel tu pourras faire tous tes essais

                    *info - mediaqueries pour iPad
                    /* iPads (portrait et paysage) ----------- */
                    @media only screen
                    and (min-device-width : 768px)
                    and (max-device-width : 1024px) {
                    /* STYLES ICI */
                    }
                    Si tu mets une width à 500px (qui n'existait pas avant) pour l'affichage desktop, tu auras à priori une width à 500px pour l'iPad.
                    Il faudra probablement corriger dans les mediaqueries

                    @lomart
                    Je ne pense pas que les devs de Rockettheme vont s'amuser à coller du flex sans workarounds/fallbacks.
                    Surtout quand IE9 ne supporte pas le bidule.
                    Probablement ici :
                    <!--[if (gte IE 8)&(lte IE 9)]>
                    <script type="text/javascript" src="/gantry_hydrogen/media/gantry5/assets/js/html5shiv-printshiv.min.js?55dda5aa"></script>
                    <link rel="stylesheet" href="/gantry_hydrogen/media/gantry5/engines/nucleus/css/nucleus-ie9.css?55dda5ab" type="text/css"/>
                    <script type="text/javascript" src="/gantry_hydrogen/media/gantry5/assets/js/matchmedia.polyfill.js?55dda5aa"></script>
                    <![endif]-->
                    En outre, flex est supporté par l'iPad depuis la version 7.1
                    web browser compatibility support html css svg html5 css3 opera chrome firefox safari internet explorer


                    Les histoires de prefixes - pff, quelle galère :
                    What CSS prefixes should I use?
                    Dernière édition par ghazal à 26/08/2015, 18h45
                    Un message d’erreur sur votre site Joomla ... ayez le reflexe de consulter lla base de connaissance : https://kb.joomla.fr

                    Ce forum, vous l'aimez ? il vous a sauvé la vie ? Vous y apprenez chaque jour ? Alors adhérez à l'AFUJ https://www.joomla.fr/association/adherer

                    Commentaire


                    • #11
                      Re : problème d'affichage iPad

                      Je ne pense pas les devs de Rockettheme vont s'amuser à coller du flex sans workarounds/fallbacks.
                      Sans doute, je ne connais pas suffisamment Gantry
                      Par contre, bricoler dans cette structure sans bien la maitriser est risqué
                      UP, le plugin universel à découvrir sur https//up.lomart.fr
                      bgMax
                      , AdminOrder, MetaData, Zoom, ArtPlug, Custom, Memo, Filter, ... sur http://lomart.fr/extensions

                      Commentaire


                      • #12
                        Re : problème d'affichage iPad

                        Bricolé, je vais quand même le faire.

                        Chaque élément a un type display par défaut.
                        Ok, je vais me servir, de vos éléments pour résoudre mon problème.

                        Des recherches sur le display et ces différents modes et compatibilités autre que inline et block
                        Flex -webkit ect ….

                        Il est fort regrettable qu’il n’y ai pas de version française pour la documentation de Gantry.
                        Mais si ça me permets de travailler dans un seul fichier CSS ( custom.scss ) ça ne peut être qu’un plus.

                        Il va valoir que je trouve une solution pour toutes les personne qui on acheter les premier iPad qui sont sous une iOS 5. X x
                        Trouver une solution sans toucher sur ce qui fonctionne, ce serait dommage.
                        Puis la poster pour tout le monde dans ce poste, merci à tous.

                        Commentaire


                        • #13
                          Re : problème d'affichage iPad

                          Problème d’affichage sur les iPad non Retina, pour afficher les articles qui dépassent

                          1) Quand on veut modifier le css pour le Template de gantry5 il faut Créer le fichier custom.scss voir le dossier scss
                          templates/g5_hydrogen/custom/scss/custom.scss

                          2) Modifier le css en ciblant une certaine résolution
                          @media only screen
                          and (min-device-width : 768px)
                          and (max-device-width : 1024px) {
                          /* STYLES ICI */
                          .g-content{
                          /*background-color: rgba(0, 255, 0, 0.5); /* un arrière-plan vert à 50%*/
                          width: 750px;
                          }
                          }
                          La couleur ma permit de voir si j’agissais sur un élément cohérent ici la class .g-content
                          La valeur 750px, est le meilleur compromit en mode portrait, et acceptable en mode paysage.
                          J’ai n’ettoyer le bordel que j’avais mis dans les autres fichiers pour le logo et la taille du header

                          3) Quand on a modifié le css, que le fichier a été envoyé sur le serveur, pour qu’il soit pris en compte il faut dans la gestion du Template sous Joomla cliqué sur le bouton Recompile CSS
                          http://www.creatodrome.com/PourInfo/recompile_css.jpg


                          Merci à tous, pour vos réponses et merci à ghazal pour le Code.

                          Commentaire

                          Annonce

                          Réduire
                          Aucune annonce pour le moment.

                          Partenaire de l'association

                          Réduire

                          Hébergeur Web PlanetHoster
                          Travaille ...
                          X