Modifier les modèles de Blogger

Changer la taille des modèles de Blogger

Blogger fournit plus d'une quinzaine de modèles (template) différents accessibles par Paramètres / Mise en Page / Sélectionner un nouveau modèle :





Les dimensions proposées consistent en une colonne principale d'environ 410 pixels et une colonne de liens et gadgets d'environ 220 pixels.

Nous allons modifier le modèle du blog, pour augmenter ces dimensions d'environ 150 pixels pour la colonne principale et d'environ 50 pixels pour la colonne des gadgets.


Sauvegarder le modèle

Avant de modifier le modèle, en faire une copie par Paramètres / Mise en Page / Modifier le code HTML et un clic sur Télécharger le modèle dans son intégralité.



Sommaire

• 565


• 897


• Denim


• Harbor


• Minima


• Minima Lefty


• Rounders


• Rounders 2


• Rounders 3


• Rounders 4


• Scribe


• Thisaway


• Tic-tac


• Washed Denim

Le Modèle 565 - Douglas Bowman




Les dimensions passent de 254 - 460 - 744 à 304 - 610 - 944.

Il n'y a pas d'images de fond à modifier.


Les corrections

Cliquer pour voir les corrections

#outer-wrapper
{
...
width: 944px; /* 744 */
}

#main-wrapper
{
...
width: 610px; /* 460 */
...
}

#sidebar-wrapper
{
...
width: 304px; /* 254 */
...
}

• Retour au sommaire

Le Modèle 897 - Douglas Bowman




Les dimensions passent de 254 - 460 - 744 à 304 - 610 - 944.

Il n'y a pas d'images de fond à modifier.


Les corrections

Cliquer pour voir les corrections

#outer-wrapper
{
...
width: 944px; /* 744 */
}

#main-wrapper
{
...
width: 610px; /* 460 */
...
}

#sidebar-wrapper
{
...
width: 304px; /* 254 */
...
}

• Retour au sommaire

Le Modèle Denim - Darren Delaye




Les dimensions passent de 240 - 464 - 760 à 290 - 614 - 960.

Il n'y a pas d'images de fond à modifier.


Les corrections

Cliquer pour voir les corrections

#header
{
width: 960px; /* 760 */
...
}

#content-wrapper
{
width: 960px; /* 760 */
...
}

#main-wrapper
{
width: 614px; /* 464 */
...
}

#sidebar-wrapper
{
...
width: 290px; /* 240 */
...
}

• Retour au sommaire

Le Modèle Harbor - Douglas Bowman




Les dimensions passent de 180 - 650 - 890 à 228 - 802 - 1090.

Il n'y a pas d'images de fond à modifier.


Les corrections

Cliquer pour voir les corrections

#wrap
{
...
min-width: 940px; /* 740 */
...
}

#outer-wrapper
{
max-width: 1090px; /* 890 */
...
}

#sidebar-wrapper
{
width: 28%; /* 32% */
...
}

body#layout #sidebar-wrapper
{
width: 228px; /* 180 */
...
}

body#layout #wrap4, body#layout #outer-wrapper
{
width: 802px; /* 650 */
}

.Header .description
{
...
max-width: 900px; /* 700 */
...
}

• Retour au sommaire

Le Modèle Minima - Douglas Bowman




Les dimensions passent de 220 - 410 - 660 / 700 à 270 - 560 - 860 / 900.

Il n'y a pas d'images de fond à modifier.


Les corrections

Cliquer pour voir les corrections

#header-wrapper
{
width: 860px; /* 660 */
...
}

#header .description
{
...
max-width: 900px; /* 700 */
...
}

#outer-wrapper
{
width: 860px; /* 660 */
...
}

#main-wrapper
{
width: 560px; /* 410 */
...
}

#sidebar-wrapper
{
width: 270px; /* 220 */
...
}

#footer
{
width: 860px; /* 660 */
...
}

• Retour au sommaire

Le Modèle Minima Lefty - Douglas Bowman



Les dimensions passent de 220 - 410 - 660 / 700 à 270 - 560 - 860 / 900.

Il n'y a pas d'images de fond à modifier.


Les corrections

Cliquer pour voir les corrections

#header-wrapper
{
width: 860px; /* 660 */
...
}

#header .description
{
...
max-width: 900px; /* 700 */
...
}

#outer-wrapper
{
width: 860px; /* 660 */
...
}

#main-wrapper
{
width: 560px; /* 410 */
...
}

#sidebar-wrapper
{
width: 270px; /* 220 */
...
}

#footer
{
width: 860px; /* 660 */
...
}

• Retour au sommaire

Le modèle Rounders - Douglas Bowman




Les dimensions passent de 240 - 485 - 740 à 290 - 635 - 940.

Les images de fond doivent être modifiées, quant à leur taille :

corners_cap_bot.gif
corners_cap_top.gif

corners_main_bot.gif
corners_main_top.gif

corners_prof_bot.gif
corners_prof_top.gif

corners_side_bot.gif
corners_side_top.gif

rails_main.gif

Ces images doivent être enregistrées chez un hébergeur acceptant le format *.gif

Elles sont disponibles en téléchargement sur les Liens du Vin.


Les corrections

Cliquer pour voir les corrections

#outer-wrapper
{
width: 940px; /* 740 */
...
}

#main-wrap1
{
width: 635px; /* 485 */
...
background:#ffffff url("http://URL/corners_main_bot.gif") no-repeat left bottom;
...
}

#main-wrap2
{
...
background:url("http://URL/corners_main_top.gif") no-repeat left top;
...
}

#main
{
background:url("http://URL/rails_main.gif") repeat-y left;
...
width: 635px; /* 485 */
}

#sidebar-wrap
{
width: 290px; /* 240 */
...
}

.main .widget
{
...
width: 618px; /* 468 */
...
}

.main .Blog
{
...
width: 634px; /* 484 */
}

#header-wrapper
{
background:#445566 url("http://URL/corners_cap_top.gif") no-repeat left top;
...
}

#header
{
background:url("http://URL/corners_cap_bot.gif") no-repeat left bottom;
...
}

#sidebartop-wrap
{
background:#ccddcc url("http://URL/corners_prof_bot.gif") no-repeat left bottom;
...
}

#sidebartop-wrap2
{
background:url("http://URL/corners_prof_top.gif") no-repeat left top;
...
}

#sidebarbottom-wrap1
{
background:#ffffff url("http://URL/corners_side_top.gif") no-repeat left top;
...
}

#sidebarbottom-wrap2
{
background:url("http://URL/corners_side_bot.gif") no-repeat left bottom;
...
}

#footer-wrap2
{
background:#445566 url("http://URL/corners_cap_top.gif") no-repeat left top;
...
}

#footer
{
background:url("http://URL/corners_cap_bot.gif") no-repeat left bottom;
...
}

body#layout #outer-wrapper
{
width: 930px; /* 730 */
}

• Retour au sommaire

Le modèle Rounders 2 - Douglas Bowman




Les dimensions passent de 240 - 485 - 740 à 290 - 635 - 940.

Les images de fond doivent être modifiées, quant à leur taille :

consulter la liste des images du modèle Rounders

Ces images doivent être enregistrées chez un hébergeur acceptant le format *.gif

Elles sont disponibles en téléchargement sur les Liens du Vin.


Les corrections

Cliquer pour voir les corrections

#outer-wrapper
{
width: 940px; /* 740 */
...
}

#main-wrap1
{
width: 635px; /* 485 */
...
background:#ffffff url("http://URL/corners_main_bot.gif") no-repeat left bottom;
...
}

#main-wrap2
{
...
background:url("http://URL/corners_main_top.gif") no-repeat left top;
...
}

#main
{
background:url("http://URL/rails_main.gif") repeat-y left;
...
width: 635px; /* 485 */
}

#sidebar-wrap
{
width: 290px; /* 240 */
...
}

.main .widget
{
...
width: 618px; /* 468 */
}

.main .Blog
{
width: 634px; /* 484 */
}

#header-wrapper
{
background:#771100 url("http://URL/corners_cap_top.gif") no-repeat left top;
...
}

#header
{
background:url("http://URL/corners_cap_bot.gif") no-repeat left bottom;
...
}

#sidebartop-wrap
{
background:#999999 url("http://URL/corners_prof_bot.gif") no-repeat left bottom;
}

#sidebartop-wrap2
{
background:url("http://URL/corners_prof_top.gif") no-repeat left top;
}

#sidebarbottom-wrap1
{
background:#ffffff url("http://URL/corners_side_top.gif") no-repeat left top;
...
}

#sidebarbottom-wrap2 {
background:url("http://URL/corners_side_bot.gif") no-repeat left bottom;
...
}

#footer-wrap2
{
background:#771100 url("http://URL/corners_cap_top.gif") no-repeat left top;
}

#footer
{
background:url("http://URL/corners_cap_bot.gif") no-repeat left bottom;
...
}

body#layout #outer-wrapper
{
width: 930px; /* 730 */
}

• Retour au sommaire

Le modèle Rounders 3 - Douglas Bowman




Les dimensions passent de 240 - 485 - 740 à 290 - 635 - 940.

Les images de fond doivent être modifiées, quant à leur taille :

consulter la liste des images du modèle Rounders

Ces images doivent être enregistrées chez un hébergeur acceptant le format *.gif

Elles sont disponibles en téléchargement sur les Liens du Vin.


Les corrections

Cliquer pour voir les corrections

#outer-wrapper
{
width: 940px; /* 740 */
...
}

#main-wrap1
{
width: 635px; /* 485 */
...
background:#eeeecc url("http://URL/corners_main_bot.gif") no-repeat ...
}

#main-wrap2
{
...
background:url("http://URL/corners_main_top.gif") no-repeat left top;
...
}

#main
{
background:url("http://URL/rails_main.gif") repeat-y left;
width: 635px; /* 485 */
}

#sidebar-wrap
{
width: 290px; /* 240 */
...
}

.main .widget
{
...
width: 618px; /* 468 */
...
}

.main .Blog
{
...
width: 634px; /* 484 */
}

#header-wrapper
{
background:#335577 url("http://URL/corners_cap_top.gif") no-repeat left top;
...
}

#header
{
background:url("http://URL/corners_cap_bot.gif") no-repeat left bottom;
...
}

#sidebartop-wrap
{
background:#558866 url("http://URL/corners_prof_bot.gif") no-repeat left bottom;
...
}

#sidebartop-wrap2
{
background:url("http://URL/corners_prof_top.gif") no-repeat left top;
...
}

#sidebarbottom-wrap1
{
background:#335577 url("http://URL/corners_side_top.gif") no-repeat left top;
...
}

#sidebarbottom-wrap2
{
background:url("http://URL/corners_side_bot.gif") no-repeat left bottom;
...
}

#footer-wrap2
{
background:#335577 url("http://URL/corners_cap_top.gif") no-repeat left top;
...
}

#footer
{
background:url("http://URL/corners_cap_bot.gif") no-repeat left bottom;
...
}

body#layout #outer-wrapper
{
width: 930px; /* 730 */
}

• Retour au sommaire

Le modèle Rounders 4 - Douglas Bowman




Les dimensions passent de 240 - 485 - 740 à 290 - 635 - 940.

Les images de fond doivent être modifiées, quant à leur taille :

bg_hdr_bot.jpg

corners_cap_bot.gif
corners_cap_top.gif

corners_main_bot.gif
corners_main_top.gif

corners_prof_bot.gif
corners_prof_top.gif

corners_side_bot.gif
corners_side_top.gif

rails_main.gif
rails_side.gif

Ces images doivent être enregistrées chez un hébergeur acceptant le format *.gif

Elles sont disponibles en téléchargement sur les Liens du Vin.


Les corrections

Cliquer pour voir les corrections

#outer-wrapper
{
width: 940px; /* 740 */
...
}

#main-wrap1
{
width: 635px; /* 485 */
...
background:#446666 url("http://URL/corners_main_bot.gif") no-repeat left bottom;
...
}

#main-wrap2{
...
background:url("http://URL/corners_main_top.gif") no-repeat left top;
...
}

#main{
background:url("http://URL/rails_main.gif") repeat-y left;
...
width: 635px; /*485 */
}

#sidebar-wrap
{
width: 290px; /* 240 */
...
}

#header-wrapper
{
background: #476 url("http://URL/corners_cap_top.gif") no-repeat left top;
...
}

#header
{
background:url("http://URL/bg_hdr_bot.jpg") no-repeat left bottom;
...
}

#sidebartop-wrap
{
background:#99bb55 url("http://URL/corners_prof_bot.gif") no-repeat left bottom;
...
}

#sidebartop-wrap2
{
background:url("http://URL/corners_prof_top.gif") no-repeat left top;
...
}

#sidebarbottom-wrap1
{
background: #ffffff url("http://URL/corners_side_top.gif") no-repeat left top;
...
}

#sidebarbottom-wrap2
{
background: url("http://URL/corners_side_bot.gif") no-repeat left bottom;
...
}

#sidebar
{
background:url("http://URL/rails_side.gif") repeat-y;
}

#footer-wrap2
{
background:#447766 url("http://URL/corners_cap_top.gif") no-repeat left top;
...
}

#footer
{
background:url("http://URL/corners_cap_bot.gif") no-repeat left bottom;
...
}

body#layout #outer-wrapper
{
width: 930px; /* 730 */
}

• Retour au sommaire

Le modèle Scribe - Todd Dominey




Les dimensions passent de 150 - 430 - 700 à 250 - 580 - 950.

Les images de fond doivent être modifiées, quant à leur taille :

bg_paper_bot.jpg
bg_paper_mid.jpg
bg_paper_top.jpg

divider.gif

Ces images doivent être enregistrées chez un hébergeur acceptant le format *.gif

Elles sont disponibles en téléchargement sur les Liens du Vin.


Les corrections

Cliquer pour voir les corrections

#outer-wrapper
{
...
width: 950px; /* 700 */
...
}

#main-top
{
width: 950px; /* 700 */
...
background:#FFF3DB url("http://URL/bg_paper_top.jpg") no-repeat top left;
...
}

#main-bot
{
width: 950px; /* 700 */
...
background:#FFF3DB url("http://URL/bg_paper_bot.jpg") no-repeat top left;
...
}

#wrap2
{
width: 950px; /* 700 */
background:#FFF3DB url("http://URL/bg_paper_mid.jpg") repeat-y;
...
}

#main
{
width: 580px; /*430 */
...
}

#sidebar
{
width: 250px; /* 150 */
...
}

#footer
{
...
background:url("http://URL/divider.gif") no-repeat top left;
}

#header
{
background:url("http://URL/divider.gif") no-repeat bottom left;
}

• Retour au sommaire

Le modèle Thisaway - Dan Rubin




Les dimensions passent de 269 - 483 - 760 à 319 - 633 - 960.

Les images de fond doivent être modifiées, quant à leur taille :

bg_footer_top.gif
bg_header_bottom.gif

bg_main_wrapper.gif

Ces images doivent être enregistrées chez un hébergeur acceptant le format *.gif

Elles sont disponibles en téléchargement sur les Liens du Vin.


Les corrections

Cliquer pour voir les corrections

body
{
...
min-width: 960px; /* 760 */
...
}

#outer-wrapper
{
...
width: 960px; /* 760 */
...
}

#header-wrapper
{
...
background: url(http://URL/bg_header_bottom.gif) no-repeat left bottom;
}

#content-wrapper
{
...
width: 960px; /* 760 */
background: #f7f0e9 url(http://URL/bg_main_wrapper.gif) repeat-y left top;
}

#main-wrapper
{
...
width: 633px; /* 483 */
...
}

#sidebar-wrapper
{
...
width: 319px; /* 269 */
}

#footer-wrapper
{
...
background: url(http://URL/bg_footer_top.gif) no-repeat left top;
...
}

• Retour au sommaire

Le modèle Tic-tac - Dan Cederholm




Les dimensions passent de 259 - 460 - 763 à 309 - 580 - 939.

Les images de fond doivent être modifiées, quant à leur taille :

bottom_sash_left.gif
bottom_sill.gif

sidebar_bg.gif

tile_left.gif

top_div_left.gif
top_h1.gif

Ces images doivent être enregistrées chez un hébergeur acceptant le format *.gif

Elles sont disponibles en téléchargement sur les Liens du Vin.


Les corrections

Cliquer pour voir les corrections

#outer-wrapper
{
width: 1020px; /*847 */
...
background: url(http://URL/tile_left.gif) repeat-y;
}

#content-wrapper
{
...
width: 939px; /* 763 */
}

#main
{
...
width: 580px; /* 460 */
}

#sidebar
{
...
width: 309px; /* 259 */
...
background: url(http://URL/sidebar_bg.gif) no-repeat left top;
}

#header-wrapper
{
...
background: #e0e0e0 url(http://URL/top_div_left.gif) no-repeat left top;
}

#header
{
...
background: url(http://URL/_tic-tac/top_h1.gif) no-repeat bottom left;
}

#footer-wrapper
{
...
background: url(http://URL/bottom_sill.gif) no-repeat bottom left;
}

#footer
{
...
background: url(http://URL/bottom_sash_left.gif) no-repeat top left;
}

body#layout #outer-wrapper, body#layout #content-wrapper
{
width: 940px; /* 740 */
}

• Retour au sommaire

Le modèle Washed Denim - Darren Delaye



Les dimensions passent de 240 - 468 - 760 à 290 - 618 - 960.

Il n'y a pas d'images de fond à modifier.

Les corrections

Cliquer pour voir les corrections

#content-wrapper
{
width: 960px; /* 760 */
...
}

#main-wrapper
{
...
width: 468px; /* 618 */
...
}

#sidebar-wrapper
{
...
width: 240px; /* 290 */
...
}

• Retour au sommaire

Autres Modèles

A suivre...


Pour aller plus loin

Le Site du Forum d'Aide Google

Le Forum d'aide de Blogger

Le Blog d'aide de Blogger