Blogspot: Comment modifier la largeur des différentes sections

Voici un tutoriel simple et explicite pour changer la taille des différentes parties de votre Blog Blogger-Blogspot. J'ai pris le Templ...

Voici un tutoriel simple et explicite pour changer 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

Essayons par exemple de modifier la colonne latéral des widget. Avant toute chose, connectez-vous à votre interface 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 ...


Comprendre les Margin et Padding

Voici une petite illustration pour bien comprendre la différence entre margin et padding, très important pour calculer les dimensions de votre blog.



Comme vous pouvez le constater, un margin sert à définir des marges extérieur, et padding des marges intérieure. Mais quand on essaye par exemple de mettre un padding sur un élément de type inline (par exemple), alors le padding mettra des marges extérieur, et si on remplace padding par margin sur ce même élément, il n'y a aucune différence. 
Par contre, sur un élément de type block, margin définit bien les marges extérieures, et padding lui définit les marges intérieures (en agrandissait l'élément en question si il le faut apparemment).


COMMENTAIRES

BLOGGER: 2
Loading...
Nom

Actualités,9,Aides et Astuces,6,Amitié,1,Amour,2,Android et iOS,1,Argent,2,Boissons,2,Code HTML,2,Desserts,2,Equipe de France,1,Football,4,Gâteaux,1,Looks,1,Microsoft,1,Mode de vie,1,Mode et Beauté,5,Musique,2,my_slider,1,non classé,1,Nouveau-Tech,7,Parfums,2,Recettes,5,Relation sociales,6,Santé,1,Séduction et drague,2,Slider,3,Soins de visage,1,Sports,4,Technologie,8,Video,1,
ltr
item
MR COMMENT: Blogspot: Comment modifier la largeur des différentes sections
Blogspot: Comment modifier la largeur des différentes sections
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi5k8wiSux8GDiw0pQ1CDhJsrTwHiJnsJtgGjeAfttw0ypVPt8fuTArUZgwUQVPS4eK1LXbUKOjrqq8JLPg810VUicG4U631t-bOHLprswEZo0USlMhENdgxFcrLONSsw9hC4jU7ktC0wpm/s640/Sections-Blogger.png
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi5k8wiSux8GDiw0pQ1CDhJsrTwHiJnsJtgGjeAfttw0ypVPt8fuTArUZgwUQVPS4eK1LXbUKOjrqq8JLPg810VUicG4U631t-bOHLprswEZo0USlMhENdgxFcrLONSsw9hC4jU7ktC0wpm/s72-c/Sections-Blogger.png
MR COMMENT
https://monsieurcomment.blogspot.com/2016/01/blogspot-comment-modifier-la-largeur.html
https://monsieurcomment.blogspot.com/
https://monsieurcomment.blogspot.com/
https://monsieurcomment.blogspot.com/2016/01/blogspot-comment-modifier-la-largeur.html
true
4594178076492850495
UTF-8
Chargé tous les publications Ne trouve aucune publications VOIR TOUS En savoir plus Répondre Annuler la réponse Supprimer Par Accueil PAGES PUBLICATIONS Voir tous RECOMMANDÉ POUR VOUS LABEL ARCHIVE CHERCHER TOUS LES PUBLICATIONS Ne trouve pas de correspondance avec votre demande Retour à l'Accueil Dimanche Lundi Mardi Mercredi Jeudi Vendredi Samedi Dim Lun Mar Mer Jeu Ven Sam Janvier Février Mars Avril Mai Juin Juillet Août Septembre Octobre Novembre Décembre Jan Fév Mar Avr Mai Jun Jul Aoû Sep Oct Nov Déc Juste maintenant il y a 1 minute $$1$$ minutes ago il y a 1 heure $$1$$ hours ago Hier $$1$$ days ago $$1$$ weeks ago il y a plus de 5 semaines Abos Abonné CE CONTENU A ÉTÉ BLOQUÉ Partagez pour débloquer Copier tout le code Séléctionné tout le code Tous les codes ont été copiés sur votre presse-papiers Impossible de copier les codes / textes, appuyez sur [CTRL] + [C] (ou CMD + C avec Mac) pour copier