How to change/insert BlogSpot background color/image

It is so easy to change /insert BlogSpot background color or image. But if, you are not expert in changing code or do not know how to change it, where to change it. Don’t worry Blogger Shaon with you always. Just put a comment on his blog about your problem. He will be trying to solve you. Now come to the point, Blogger Shaon’s today’s topic is for How to change /insert BlogSpot background color or image? Let’s go...

Sign In & go to you blog. Then go to Design > Edit HTML and check the box (Expand Widget Templates) at HTML editor page.

Add/Change a background color

Search the code below from the body selector. 

background-color{color code here}

You will surely getting this code from body sector in CSS past of BlogSpot. Look the image below, You will have the same image.

Change the color code. Here you should need to know the HTML color code. Here is the sample color code to use. White- #FFFFFF, Black-#000000, Red- #FF0000, Blue- #002AFF, Purple- #E911CD etc. you can get more about by searching.

Replace the color code you choice. Then Click Save template.

If all was ok. Then, the template will save successfully.

Now Refresh your blog & enjoy.

---

Here is an other topic. If you need to change or insert an image as background of you blog. So, follow the instruction below.

Add/Change a background image

the code to insert is this:-

body {

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

Remember, to insert the URL address of your image in the brackets. If you would like to have a feel of how a background picture will look like, I have uploaded a test image at this address – http://i905.photobucket.com/albums/ac252/Shaonbd2020/bgpic.jpg

Insert the URL of this test image into the above brackets (URL address of your image) save the template and Preview your blog.

You can also have a background image just only for your sidebar. Located in the style and add the background image code accordingly.

#sidebar-wrapper {

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

For a background image to your main post body only, add the code here:-

#main-wrapper {

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

Here a think, the maximum number or BlogSpot blogger wish to change only the background image. Because changing the sidebar image or main content image is make this blog heavy to load. It need too time to load. That’s why Blogger Shaon make a suggestion for his audiences, that is do not want to insert image whole of your blog part, it look like so ugly. Can just change background image.

Repeat the background image

By default, the image is repeated to fill up the entire background of the page. If you have a small or tile-sized image, it will appear like a print pattern in the background. Sometimes, you may choose not to have the image repeated. If that is the case, you can insert this code for repeat you background image in different angel:-

background-repeat: no-repeat;

Alternatively, you may only want the image to be repeated horizontally. The code is this:-

background-repeat: repeat-x;

To have the image repeated vertically, the code is this:-

background-repeat: repeat-y;

Hope It will help you much. Wish you happy blogging... :d