How To Add Background images to Blogger Templates

How To Add image to the Header

log in to your dashboard--> layout- -> Edit HTML, scroll to where you see this:-

#header-wrapper {

Add immediately after that the following line:-

background-image: url(URL address of your image);

See the example below.

#header-wrapper {
background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjJRswjTppJDBv9aL1lH3zJSfX1MaJN7WFbSanTRg-h9OBVTaSAXLRRB-B6R8frKNsL7wvXYgCluq-MEQUuxyJv853LhGr369DiUPyi9RQZiwzc3GxoxoQwNgMYjbEkfrutrUR3zGuF2Vw/s400/digg1.jpeg);

Save the template and refresh your site.


How To Add image to the Main Background


log in to your dashboard--> layout- -> Edit HTML, scroll to where you see this:-


body {

Add immediately after that the following line:-

background-image: url(URL address of your image);

See the example below.

body {
background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjJRswjTppJDBv9aL1lH3zJSfX1MaJN7WFbSanTRg-h9OBVTaSAXLRRB-B6R8frKNsL7wvXYgCluq-MEQUuxyJv853LhGr369DiUPyi9RQZiwzc3GxoxoQwNgMYjbEkfrutrUR3zGuF2Vw/s400/digg1.jpeg);

Save the template and refresh your site.


How To Add image to the Posts Background

log in to your dashboard--> layout- -> Edit HTML, scroll to where you see this:-

#main-wrapper {

Add immediately after that the following line:-

background-image: url(URL address of your image);

See the example below.

#main-wrapper {
background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjJRswjTppJDBv9aL1lH3zJSfX1MaJN7WFbSanTRg-h9OBVTaSAXLRRB-B6R8frKNsL7wvXYgCluq-MEQUuxyJv853LhGr369DiUPyi9RQZiwzc3GxoxoQwNgMYjbEkfrutrUR3zGuF2Vw/s400/digg1.jpeg);

Save the template and refresh your site.


How To Add image to the Sidebar Background


log in to your dashboard--> layout- -> Edit HTML, scroll to where you see this:-

#sidebar-wrapper {

Add immediately after that the following line:-

background-image: url(URL address of your image);

See the example below.

#sidebar-wrapper {
background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjJRswjTppJDBv9aL1lH3zJSfX1MaJN7WFbSanTRg-h9OBVTaSAXLRRB-B6R8frKNsL7wvXYgCluq-MEQUuxyJv853LhGr369DiUPyi9RQZiwzc3GxoxoQwNgMYjbEkfrutrUR3zGuF2Vw/s400/digg1.jpeg);

Save the template and refresh your site.


Bookmark and Share


 

Blogroll

Site Info

Text

ProBlogger Copyright © 2010.