How to Add Background Image Without Increasing The Blog's Load Time?

When We add background of our blog as a color, It look dull. Right? Yeah! Now, When we add a background image, It increase blog load time. So what should we do if we want to add a background image without reducing the blog's load time? Today Again I come with a new and latest trick for your blog that help you to add a background Image to your blog and give it a professional look without reducing your blog's load time.Here, I used a set CSS codes to do this trick. Our this trick will help you to add a cool background image to your blog without increasing your blog's load time.

Now You might thinking that how we have done this trick? We have used a 1cm x 1cm image and then give it command to repeat itself according to the device's screen. Not a simple trick? We have also created some cool images for you. You just need to choose one of them and add it as your blog's background image! Start the Process of Implementation.

Let's Implement!

Now, How to implement? Here, we have listed some simple steps to implement it on your blog.

• Go to Blogger Dashboard > Template > Edit HTML
• Now, search for bellow piece of code:

]]></b:skin> 

Now, Here are some images that you can use as your blog's background picture.

1. MBT's Background Image

You might heard MBT (MyBloggerTricks), a famous blog that get thousands of pageviews per day. MBT's Background image is made of some effects of waves that give a Professional look the blog. Now, You can implement their background image on your blog by using following code:

body{background:#fff url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgBCQ27RpAXl9-ibZAbiXmjbmZx5eI-FXUH8KpK3Mzl3qywId8LlbQusH00GEJvFERkiu6ut3musoU3Yf0oEamw7L41llQbzeZVVMIGZhArDo-pm9xgbCarxtBD8qOixukUE-MxGQCHfhKM/s1600/bg5.png) 0% 0% repeat scroll}

2. Blogger Guiders' Background Image

Do you saw our Background image? If you are a new reader, of-course not! In our previous template, we have used background image that is a background image with effects of shutter and also with some shadow effects. Now, You can use it on your blog by using following code:

body{background:#fff url(http://s12.postimg.org/5q5kn9ux5/Untitled.png) 0% 0% repeat scroll}  

3. Set Your Own Blogger Background

Have your own picture? Want to set it as background on your blog with repeating? Here's How. You just need to replace IMAGE_URL in the following code and rest work will be automatically complete. Here is the code:

body{background:#fff url(IMAGE_URL) 0% 0% repeat scroll}

In Addition, You will get a cool and Professional touch on your blog. Check by Scrolling Your Blog After Implementing above code on your blog.

Final Words

I hope you will like these background images and surely implement these on your blog. If you felt, that our code have some type of error or you need some type of help like more background images, mention it in comments. Keep Sharing! Thank You!

Share this post