Comment modifier (et choisir) la largeur des différentes sections de votre Blogspot

Voici un tutoriel simple et explicite pour modifier la taille des différentes parties de votre Blog Blogger-Blogspot. J'ai pris le Template par défaut de Blogger Minima comme exemple.
Blogger Template
Par exemple pour élargir la colonne latéral des widget, connectez vous à Blogger, Allez dans "Mise en page", "Modifier le code HTML" et recherchez le code suivant #sidebar-wrapper Vous trouverez quelques chose comme ça:
#sidebar-wrapper {
  width: 220px;
  float: $endSide;
  word-wrap: break-word;
  overflow: hidden;
}
Il suffit de modifier la valeur de la ligne width.
Bien sûr, si vous changez la largeur d'une section il faut modifier toutes les autres.
Si vous n'utilisez pas une des Template par défaut de Blogger, il faut chercher les noms des sections correspondantes dans votre modèle.

Comment choisir la largeur du blog

Je vous conseil de choisir une largeur inférieur à 1000px ainsi votre blog sera facilement consultable sur la majorité des écrans: 10 pouces, 12 pouces, 15 pouces ...
Blogspot Template

Margin et Padding

Voici une petite illustration pour comprendre la différence entre margin et padding, très important pour calculer les dimensions de votre blog.
Blogger margin padding
Libellés : Publié le mercredi, mars 03, 2010
21 Commentaires
  1. Salut,
    Super comme article, ça va forcement me servir. Ton blog est vraiment super parce-que tous ce qu'on as besoin est dans ton blog. ^^

    Twitter: http://twitter.com/FlorentGardan

    RépondreSupprimer
  2. Merci Soufiane,
    super cette astuce que je vais m'empresser d'exécuter pour mon blog.

    Merci A+

    RépondreSupprimer
  3. salut Soufiane et merci pour ton billet. sur mon blog, j aimerais remplacer la colonne de gauche (commentaires, etc) par une colonne normal de la même taille pourrais tu me dire comment faire car je vois pas trop comment ?

    RépondreSupprimer
  4. bonsoir soufiane
    peux tu faire un tour sur : http://select-ddl.blogspot.com/
    j'ai procédé comme tu l'as expliqué mais sur ma colonne de droite ca déraille
    peux tu m'aider svp ?
    (comme mon blog est une vraie expérimentation de tes trucs et astuces je t'ai inséré en lien utile)

    RépondreSupprimer
  5. @Afternow
    Ok, faut trouver les noms des sections dans ta Template...

    RépondreSupprimer
  6. @SELECT-MU
    Comme tu as des arrière plans en image, il faut adapter tout cela ...

    RépondreSupprimer
  7. @Basto
    Il faut modifier toutes les sections et adapter l'arrière plan (image) ...

    RépondreSupprimer
  8. une question idiote ... Comment faire ?
    merci

    RépondreSupprimer
  9. Merci, mais par ou commencer ?

    RépondreSupprimer
  10. J'aimerais simplement augmenter la hauteur du cadre dans lequel apparaissent mes libellés à la fin de chaque message. Lorsqu'il y a trop de libellés, cela déborde (ex. : http://www.chouquinette.com/2010/02/bouchees-chocolatees-au-lait-de-coco-et.html) et j'aimerais donc agrandir cet encadré. Que dois-je modifier dans mon code HTML et à quel endroit ?
    Merci d'avance.

    RépondreSupprimer
  11. @SELECT-MU
    @Basto
    @Chouquinette
    J'ai vraiment pas assez de temps pour regarder chaque Blog ...

    RépondreSupprimer
  12. Helloo Soufiane as tu mis un article pour mettre des couleurs dans ces différentes parties : body ou sidebar ou ailleurs, si l'on veut que cela ne soit pas uniforme....
    grand fred

    RépondreSupprimer
  13. Bonjour Soufiane,
    Je viens d'expérimenter cette astuce. Sur un blog "essais"
    J'ai pu changer les largeurs mais il reste "désespérément" un cadre gris
    du côté main-wrapper. Je ne trouve pas le code à changer`d'avance merci si tu arrives à me donner
    l'info ...
    :p

    RépondreSupprimer
  14. salut tout le monde je veux mettre un fond d'ecran pour mon blogspot tu peux m'aidé stp ?

    RépondreSupprimer
  15. Bonjour Soufiane, tout d'abord bravo pour ton site,, il m'est très utile.

    Par contre, j'ai une question: comment faire pour monter ou descendre les sections?
    et aussi comment faire pour ajouter une nouvelle section? pas au niveau de "ajouter un gadget" comme il y a déjà, mais ajouter une section entière?

    J'espère que me tu répondras pacque j'ai quelque soucis avec ça en ce moment.

    Merci d'avance

    RépondreSupprimer
  16. Bonjour,

    Comment modifier le code pour éviter que le bouton "enregistrer un commentaire" ne soit pas caché par la boite de commentaire ? voici l'adresse de l'article concerné pour mon blog: http://bernard-dollet-photo.blogspot.com/2012/01/portrait-de-famille-catherine-julien-et_03.html

    Merci d'avance pour vos réponses
    Bernard

    RépondreSupprimer
  17. Bonjour,

    Premièrement merci pour toutes vos astuces concernant blogger sur votre site, ce qui m'a permis de modifier un certains nombre de petites choses.

    Seulement voilà, ce tutoriel concernant la tailles des différents colonnes, je ne parviens pas à faire ce que je veux.
    Je ne trouve simplement pas les " main-wrapper " ," outer-wrapper", c'est introuvable dans le code

    Le code de mon thème doit être écrit différemment. (hypothèse ?)

    Je veux simplement diminuer la taille de la "zone texte" à la lecture de l'article, trouvant que les lignes sont trop longues.

    Je cherche désespérément plusieurs astuces, mais j'en viens toujours aux mêmes tutos que celui que vous proposez sur votre site.

    Seriez vous m'indiquer l'endroit de mon blog ou je dois modifier les chiffres car je ne parviens jamais à faire ce que je veux.

    Merci d'avance,

    Adrien.

    RépondreSupprimer

Copyright 2015 Soufiane.fr