l
l
blogger better. Powered by Blogger.

Search

Labels

blogger better

Followers

Blog Archive

Total Pageviews

Labels

Download

Blogroll

Wednesday, December 21, 2011

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/AVvXsEjdZGlvOQ5Jh4x8ANTjAMbMGF69dbBQKw-X8xZny5zcYMlMo4ZjaCG_-c-EOnsPDO845KdkWfaMDqxKv1-DCGgkJ0TraHAGZ9VpGEUK77_6Y55ORjAXeDDkztTJw2k_-2QVk5DFEDaN-Mg/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/AVvXsEjdZGlvOQ5Jh4x8ANTjAMbMGF69dbBQKw-X8xZny5zcYMlMo4ZjaCG_-c-EOnsPDO845KdkWfaMDqxKv1-DCGgkJ0TraHAGZ9VpGEUK77_6Y55ORjAXeDDkztTJw2k_-2QVk5DFEDaN-Mg/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/AVvXsEjdZGlvOQ5Jh4x8ANTjAMbMGF69dbBQKw-X8xZny5zcYMlMo4ZjaCG_-c-EOnsPDO845KdkWfaMDqxKv1-DCGgkJ0TraHAGZ9VpGEUK77_6Y55ORjAXeDDkztTJw2k_-2QVk5DFEDaN-Mg/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/AVvXsEjdZGlvOQ5Jh4x8ANTjAMbMGF69dbBQKw-X8xZny5zcYMlMo4ZjaCG_-c-EOnsPDO845KdkWfaMDqxKv1-DCGgkJ0TraHAGZ9VpGEUK77_6Y55ORjAXeDDkztTJw2k_-2QVk5DFEDaN-Mg/s400/digg1.jpeg);
Save the template and refresh your site.

0 comments

Post a Comment

blogger better Headline Animator