Comment agrandir la largeur du site (Créer un compte)

  • WordPress :5.8
  • Statut : non résolu
13 sujets de 1 à 13 (sur un total de 13)
  • Auteur
    Messages
  • #2410111
    shihoo
    Participant
    Chevalier WordPress
    207 contributions

    Bonjour,

    Ma configuration WP actuelle

    • Version de PHP/MySQL : 8.1/5.7
    • Thème utilisé : Envo magazine
    • Extensions en place : Jetpack par WordPress.com, TinyMCE Advanced, Loco translate, WP fatest cache, Yoast seo
    • Nom de l’hébergeur : 1and1
    • Adresse du site : blog.dautek.fr

    Problème(s) rencontré(s) : Je souhaiterais agrandir la largeur du site en enlevant soit le bord blanc à gauche ou des deux côtés si possible (voir la capture). Merci pour votre aide.

    Fichiers joints :
    Vous devez être connecté pour voir les fichiers joints.
    #2410175
    Flobogo
    Modérateur
    Maître WordPress
    18496 contributions

    Bonjour,

    Le site étant inaccessible (extension de maintenance), on ne peut pas vous aider. Il faut pouvoir consulter le CSS en ligne.

    #2410233
    shihoo
    Participant
    Chevalier WordPress
    207 contributions

    Bonjour merci de me répondre, j’ai débloqué le site.

    #2410314
    Flobogo
    Modérateur
    Maître WordPress
    18496 contributions

    Dans le menu admin, Themes > Personnaliser > CSS additionnel, vous pouvez mettre le code suivant :

      @media (min-width: 1200px)
    .container {
      width: 1270px;
      max-width: 97%;
    }

    N’oubliez pas d’enregistrer.

    Ce code agrandit de 100px la largeur du site pour les écrans de plus de 1200px de large (15″ environ), tout en limitant à 95% de large, histoire de garder un peu de marge pour « respirer ». Vous pouvez adapter si vous voulez, mais gardez à l’esprit que les marges sont nécessaires, l’oeil humain ne peut pas englober une trop grande largeur de site, sinon, c’est comme au musée : plus le tableau est grand, plus il faut s’éloigner  … mais ce n’est pas prévu pour les écrans d’ordi.

    #2410364
    shihoo
    Participant
    Chevalier WordPress
    207 contributions

    Bonjour merci pour le code mais cela ne fonctionne pas. Il y a aucun changement.

    #2410522
    Flobogo
    Modérateur
    Maître WordPress
    18496 contributions

    Le site est à nouveau hors ligne. Mais j’ai testé à partir de la démo du thème.

    Mon code fonctionne, mais si vous voulez, vous pouvez aller un peu plus loin dans la valeur pour la largeur, et supprimer la valeur maxi en pourcentage, ça donne :

      @media (min-width: 1200px)
    .container {
      width: 1370px;
    }

    Ou alors, vous regardez votre site sur un écran très large … mais il faut penser à ceux qui ont un 15″ ou 17″ comme moi.

     

    #2410613
    shihoo
    Participant
    Chevalier WordPress
    207 contributions

    Bonjour en fait je veux pas que sa change en fonction de l’écran mais élargir sur la gauche le panneau central dans la partie blanche.

    #2410617
    shihoo
    Participant
    Chevalier WordPress
    207 contributions

    En fait je voudrai enfin si c’est possible que le site soit comme full width avec la barre latérale à droite.

    #2410636
    Flobogo
    Modérateur
    Maître WordPress
    18496 contributions

    Faites une capture d’écran et montrez dessus ce que vous voulez, parce que là, ce n’est pas très clair.

    « full with », c’est pleine largeur, sans barre latérale.

    #2410707
    shihoo
    Participant
    Chevalier WordPress
    207 contributions

    J’aimerai mais cela n’est peut être pas possible mais que l’article fasse la largeur du carré rouge.

    Fichiers joints :
    Vous devez être connecté pour voir les fichiers joints.
    #2410737
    Flobogo
    Modérateur
    Maître WordPress
    18496 contributions

    Donc non, ce n’est pas possible. Les marges gauche et droite (les « parties blanches ») sont définies automatiquement selon la largeur de l’écran, par rapport au « container » principal qui contient l’article et la barre latérale. On ne peut donc « jouer » que sur la largeur globale du container, avec un mix des 2 codes que je vous ai donnés, par exemple :

     @media (min-width: 1200px)
    .container {
      width: 1370px;
      max-width: 97%;
    }

    Votre capture d’écran montre des marges gauche et droite (« bandes blanches ») relativement larges parce que vous regardez votre site sur grand écran, et que la largeur est limitée à 1170px. Mais tous vos visiteurs n’auront pas un écran aussi grand.

    C’est pourquoi vous pouvez agrandir à 1370px, mais il faut limiter à 97%, sinon ça pose problème pour des écrans taille 15″ comme je vous disais.

    #2410780
    shihoo
    Participant
    Chevalier WordPress
    207 contributions

    Bonjour merci d’avoir pris du temps pour mon problème. En effet j’ai tester avec un autre écran pour voir en 15″ et dans ce cas le site prend en effet tout l’écran.

    #2411515
    momofr@free.fr
    Modérateur
    Maître WordPress
    4781 contributions

    Salut, tu as des options d’affichage dans tous les webdevelopper tools des navigateurs (Chrome, Safari, Firefox, Brave…), cela te permet de simuler à l’écran différentes résolution. Pas besoin de changer d’écran.

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