How To Change Background In Blogger For Posts And Pages - Social Media News

Latest News and updates about social media

July 26, 2012

How To Change Background In Blogger For Posts And Pages


You might have noticed that some sites and blogs have different background images for different pages or posts. The reason is that they have separate background image attached with particular post or page. You can easily add different background images in your blog. Before editing your template it is wise to take a back up of existing template at your local hard disk, 

Note:- Be careful  while adding any codes or modifying existing codes in html mode of template, any wrong space, quotation mark can result in serious problems, so take a preview before saving template.


How to change body background-

1. Log in Blogger Dashboard.
2. Enter in Design » Edit Html » Expand Widget Template.
3. Now search out </head>  in your template. For fast searching hit Ctrl + F, by using search function of your browser.
4. Now just before </head>   paste codes-


<b:if cond='data:blog.url == &quot;URL of your post or page&quot;'><style>body {background-image: url(Source link address of your Desired background image);background-position: center; background-repeat:repeat; background-attachment: fixed;}</style></b:if>

5. Now replace URL of your post or page  with the public URL address of your desired page or post. 
6. Replace Source link address of your Desired background image with direct link of your desired background image. You can upload your image at some free image hosting sites like Photobucket or and take direct link of image. 



How to Change only post area background-

To change background image only at post area, use this one-


<b:if cond='data:blog.url == &quot;URL of your post or page&quot;'><style>.post {background-image: url(Source link address of your Desired background image);background-position: center; background-repeat:repeat; background-attachment: fixed;}</style></b:if>

 Replace two things, URL address of page or post and direct link of background image. Take a preview and save your template to finish the process. Now your desired page or post has a separate background image !


So now you have learned how to have different backgrounds for different posts and pages in your blogger blog.

No comments:

Post Top Ad

Your Ad Spot