How To Do 
     Useful Stuff 
         In Easy Steps..

Wednesday, September 9, 2009

How to add a twitter like fixed background image to blogger



Ever wanted to add a fixed background to your blog where your background stays fixed even if you scroll. This could be seen in all Twitter pages You can check out the freesoftware-coolsites.blogspot.com blog for the preview of what you are going to get when you are done after following the steps shown below.


Step 1 - Go to a Twitter Profile page and get the permission of the owner to use this background image OR Find a suitable background image with the optimum resolution to fit the blogger page size.


Step 2 - Right Click on the twitter page and View the Page Source.


Step 3 - Copy the background: element seen after the body { tag.
Ex: From IceTweets profile Copy background: #0099B9 url('http://a3.twimg.com/profile_background_images/33368149/
TwitterBG.jpg') fixed no-repeat top left;


Step 4 - Go to the image by pasting the image URL(Shown within Quotes 
above) in the address bar of the browser and Save the Image in you 
computer.


Step 5 - Upload this image to a free image hosting site and copy the URL 
of the Image you uploaded.

Step 6 - Now replace the new image URL with the one shown in Step 3.
Ex: background: #0099B9 url('newImageURL') fixed no-repeat top left;


Step 7 - Now log in to Blogger and go to Layout > Edit HTML and search for the body { tag.


Step 8 - Now replace the existing background: #; element with the new background: #0099B9 url('newImageURL') fixed no-repeat top left; element in Step 6 and Click on 'Save Template' button and then 'View Blog'.


Thats It.. You got your self a cool Twitter like fixed image background for your blog . Congrats....


I would like to see your blogs ones you are done...

Useful Blogs

Design by araba-cı | Blogger Template by GosuBlogger