Version site classique versus version site mobile

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

  • [RÉGLÉ] Version site classique versus version site mobile

    Bonjour,

    Je travaille avec le module J2Store pour le webshop.
    Sur le site classique les produits se présentent bien, mais sur le site mobile, les titres et textes ne s'adaptent pas à l'écran.

    Par exemple cette page sur le site classique: http://www.la-haut-pro.ch/produits-e...es-accessoires

    Et voir en annexe la version du site mobile.

    Comment pouvons nous redéfinir le site mobile, par exemple mettre sur la version mobile 1 article par colonne?

    Merci beaucoup d'avance pour le retour!

    Cliquez sur l'image pour l'afficher en taille normale

Nom : Site classique.jpg 
Affichages : 1 
Taille : 169,4 Ko 
ID : 1823937Cliquez sur l'image pour l'afficher en taille normale

Nom : Site mobile.jpg 
Affichages : 1 
Taille : 23,4 Ko 
ID : 1823936 .

  • #2
    Re : Version site classique versus version site mobile

    Bonjour,

    Le style par défaut choisi pour le rendu dans la config J2Store est elle Default ou Bootstrap ?

    Default utilise des tableaux, et donne ce type de rendu sur un mobile.
    Pas de demande de support par MP.
    S'il n'y a pas de solution, c'est qu'il n'y a pas de problème (Devise Shadok)

    Commentaire


    • #3
      Re : Version site classique versus version site mobile

      Bonjour,

      Merci pour votre réponse.

      Voir en annexe. Si ca c'est bien le style, c'est sur Boostrap oui..

      Merci d'avance!


      Cliquez sur l'image pour l'afficher en taille normale

Nom : Bootstrap.jpg 
Affichages : 1 
Taille : 166,8 Ko 
ID : 1805373

      Commentaire


      • #4
        Re : Version site classique versus version site mobile

        En style bootstrap, les produits devraient s'empiler et non avoir le look que tu as (un tableau classique). Donc il faudrait un accès au site pour voir ce qui cloche.
        Pas de demande de support par MP.
        S'il n'y a pas de solution, c'est qu'il n'y a pas de problème (Devise Shadok)

        Commentaire


        • #5
          Re : Version site classique versus version site mobile

          Bonjour jisse03,

          Merci pour votre réponse.
          Bon j'ai créé un autre problème. Je voulais créer une session visite pour vous, mais en essayant de me connecter, Joomla m'a refusé la connexion, et me refuse tout accès maintenant, même avec mon login habituel. Le message suivant s'affiche: "You are a spammer, hacker or an otherwise bad person." et je ne peux plus accéder l'administration...
          Une idee comment je peux résoudre ce problème?

          Merci d'avance pour votre retour et bonne journée,
          Emilie

          Commentaire


          • #6
            Re : Version site classique versus version site mobile

            Hum blocage AdminTools https://www.akeebabackup.com/support...ad-person.html
            Pas de demande de support par MP.
            S'il n'y a pas de solution, c'est qu'il n'y a pas de problème (Devise Shadok)

            Commentaire


            • #7
              Re : Version site classique versus version site mobile

              Merci, ca fonctionne à nouveau!
              Cette session invité ne fonctionne pas non plus. Je dois faire quelque chose de faux.
              Tant pis. Merci d'avoir essayé de m'aider! Je continu mes recherches pour trouver une solution.
              Bonne journée!

              Commentaire


              • #8
                Re : Version site classique versus version site mobile

                Admin tool empèche la création, ou la modification des utilisateurs...

                Commentaire


                • #9
                  Re : Version site classique versus version site mobile

                  Bonjour,


                  Envoyé par EmilieDenayer Voir le message
                  Sur le site classique les produits se présentent bien, mais sur le site mobile, les titres et textes ne s'adaptent pas à l'écran. [...] Comment pouvons nous redéfinir le site mobile, par exemple mettre sur la version mobile 1 article par colonne?
                  Vous pourriez essayer d'ajouter la directive CSS suivante — dans la feuille de style du template (= /templates/la-haut-pro/css/template.css), ou, mieux, dans une surcharge (= dans un nouveau fichier comme /templates/la-haut-pro/css/custom.css), de façon à ne pas altérer le template.css :

                  @media screen and (max-width: 767px) {
                  .row-fluid .span3 {
                  width: 100%;
                  }
                  }

                  Ou probablement mieux (mais le rendu est à vérifier sur d'autres pages que celle que vous donnez en exemple), afin que chaque produit / colonne occupe vraiment la totalité de la largeur disponible sur smartphone :

                  @media screen and (max-width: 767px) {
                  .row-fluid .span3,
                  .row-fluid .span9 {
                  width: 100%;
                  }
                  }


                  Cordialement,
                  Créateur de sites internet — Agence web indépendante http://www.e-33.fr | http://www.quali-site.fr (région de Bordeaux)

                  Commentaire


                  • #10
                    Re : Version site classique versus version site mobile

                    Bonjour PhilJ,
                    Un grand merci pour votre réponse et aide. J'ai fait comme indiqué, est ca fonctionne!
                    Mais uniquement pour les pages où il y avait 4 colonnes. Je suppose qu'il y a un autre code pour les pages à 2 et 3 colonnes? Si c'est le cas, pourriez-vous ne donner ce code?
                    Un grand merci!
                    Dernière édition par EmilieDenayer à 17/02/2016, 18h07

                    Commentaire


                    • #11
                      Re : Version site classique versus version site mobile

                      Envoyé par EmilieDenayer Voir le message
                      [...] J'ai fait comme indiqué, est ca fonctionne! Mais uniquement pour les pages où il y avait 4 colonnes. Je suppose qu'il y a un autre code pour les pages à 2 et 3 colonnes? Si c'est le cas, pourriez-vous ne donner ce code?
                      Oui. Le principe est exactement le même : sur smartphone (largeur < 768 px), on force à 100 % la largeur des spanx, où x= 2, 3, 4, 6...

                      Pour les affichages en 3 colonnes, sachant que le total doit toujours être 12, le 'x' vaut 12 ÷ 3 = 4.

                      Donc (en clair ), lorsqu'il y a 3 colonnes, chacune d'elle se trouve dans un container span4.

                      => Pour que ces containers span4 occupent toute la largeur (= 100 %) sur smartphone, il suffit donc d'avoir ceci dans les CSS :

                      @media screen and (max-width: 767px) {
                      .row-fluid .span4 {
                      width: 100%;
                      }
                      }


                      Le code qui devrait convenir pour tout arranger devrait donc être finalement :

                      @media screen and (max-width: 767px) {
                      .row-fluid .span3,
                      .row-fluid .span4,
                      .row-fluid .span9 {
                      width: 100%;
                      }
                      }

                      NB : je ne vois pas de souci d'affichage sur mobile pour les pages n'affichant que 2 colonnes, donc logées dans un span6 (si vous voyez un problème de votre côté, sur quelle page ?). Cependant, si nécessaire, vous aurez deviné qu'il vous suffit d'ajouter .row-fluid .span6 à la liste des propriétés devant occuper 100 % de la largeur de l'écran sur smartphone.



                      Cordialement,
                      Dernière édition par PhilJ à 17/02/2016, 18h54
                      Créateur de sites internet — Agence web indépendante http://www.e-33.fr | http://www.quali-site.fr (région de Bordeaux)

                      Commentaire


                      • #12
                        Re : Version site classique versus version site mobile

                        Un grand merci pour cette explication très claire
                        C'est parfait ainsi! J'ai aussi ajouté le .span6 car il y a parfois plus de texte.
                        Encore merci!

                        Commentaire


                        • #13
                          Re : Version site classique versus version site mobile

                          Bonjour,


                          Envoyé par EmilieDenayer Voir le message
                          C'est parfait ainsi! J'ai aussi ajouté le .span6 car il y a parfois plus de texte
                          Dans ce cas, je vous recommande de passer ce fil de discussion en 'RÉGLÉ' de façon à aider les autres utilisateurs du forum.


                          Bonne continuation,



                          PhilJ
                          Créateur de sites internet — Agence web indépendante http://www.e-33.fr | http://www.quali-site.fr (région de Bordeaux)

                          Commentaire

                          Annonce

                          Réduire
                          1 sur 2 < >

                          C'est [Réglé] et on n'en parle plus ?

                          A quoi ça sert ?
                          La mention [Réglé] permet aux visiteurs d'identifier rapidement les messages qui ont trouvé une solution.

                          Merci donc d'utiliser cette fonctionnalité afin de faciliter la navigation et la recherche d'informations de tous sur le forum.

                          Si vous deviez oublier de porter cette mention, nous nous permettrons de le faire à votre place... mais seulement une fois
                          Comment ajouter la mention [Réglé] à votre discussion ?
                          1 - Aller sur votre discussion et éditer votre premier message :


                          2 - Cliquer sur la liste déroulante Préfixe.

                          3 - Choisir le préfixe [Réglé].


                          4 - Et voilà… votre discussion est désormais identifiée comme réglée.

                          2 sur 2 < >

                          Assistance au forum - Outil de publication d'infos de votre site

                          Compatibilité: PHP 4.1,PHP4, 5, 6DEV MySQL 3.2 - 5.5 MySQLi from 4.1 ( @ >=PHP 4.4.9)

                          Support Version de Joomla! : | J!3.0 | J!2.5.xx | J!1.7.xx | J!1.6.xx | J1.5.xx | J!1.0.xx |

                          Version française (FR) D'autres versions sont disponibles depuis la version originale de FPA

                          UTILISER À VOS PROPRES RISQUES :
                          L'exactitude et l'exhaustivité de ce script ainsi que la documentation ne sont pas garanties et aucune responsabilité ne sera acceptée pour tout dommage, questions ou confusion provoquée par l'utilisation de ce script.

                          Problèmes connus :
                          FPA n'est actuellement pas compatible avec des sites Joomla qui ont eu leur fichier configuration.php déplacé en dehors du répertoire public_html.

                          Installation :

                          1. Téléchargez l'archive souhaitée : http://afuj.github.io/FPA/

                          Archive zip : https://github.com/AFUJ/FPA/zipball/master

                          2. Décompressez le fichier de package téléchargé sur votre propre ordinateur (à l'aide de WinZip ou d'un outil de décompression natif).

                          3. Lisez le fichier LISEZMOI inclus pour toutes les notes de versions spécifiques.

                          4. LIRE le fichier de documentation inclus pour obtenir des instructions d'utilisation détaillées.

                          5. Téléchargez le script fpa-fr.php à la racine de votre site Joomla!. C'est l'endroit que vous avez installé Joomla et ce n'est pas la racine principale de votre serveur. Voir les exemples ci-dessous.

                          6. Exécutez le script via votre navigateur en tapant: http:// www. votresite .com/ fpa-fr.php
                          et remplacer www. votresite .com par votre nom de domaine


                          Exemples:
                          Joomla! est installé dans votre répertoire web et vous avez installé la version française du fichier FPA:
                          Télécharger le script fpa-fr.php dans: /public_html/
                          Pour executer le script: http://www..com/fpa-fr.php

                          Joomla! est installé dans un sous-répertoire nommé "cms" et vous avez installé la version française du fichier FPA:
                          Télécharger le script fpa-fr.php dans: /public_html/cms/
                          Pour executer le script: http://www..com/cms/fpa-fr.php

                          En raison de la nature très sensible de l'information affichée par le script FPA, il doit être retiré immédiatement du serveur après son utilisation.

                          Pour supprimer le script de votre site, utilisez le lien de script de suppression fourni en haut de la page du script. Si le lien de suppression échoue pour supprimer le script, utilisez votre programme FTP pour le supprimer manuellement ou changer le nom une fois que le script a généré les données du site et le message publié sur le forum. Si le script est toujours présent sur le site, il peut être utilisé pour recueillir suffisamment d'informations pour pirater votre site. Le retrait du script empêche des étrangers de l'utiliser pour jeter un oeil à la façon dont votre site est structuré et de détecter les défauts qui peuvent être utilisé à vos dépends.
                          Voir plus
                          Voir moins

                          Partenaire de l'association

                          Réduire

                          Hébergeur Web PlanetHoster
                          Travaille ...
                          X