How To Change Blogger Simple Template Sidebar Background Color Part 2

Previously, I shared a little tip on how to change your sidebar background color with the new blogger interface's simple template. I was going to share more infos on that but I got really sleepy LOL!

Anyway, I will get into a little bit more details today and share how to change the background color of a certain widget only rather than the whole sidebar.

Again, this is for the New Blogger Interface "Simple Template"...

First: Go to Template >> Edit HTML >> Proceed

Second: Press "ctrl+f" for windows or "command+f" for mac and find the code below
<b:section-contents id='sidebar-right-1'>

Third: Right below that code, look up the widget id name for that particular widget you wanted to change the background color on. For example, if it's the followers widget, then the widget id is "Followers1"... Take note: It is case sensitive.

Fourth: Once you got your widget id, find this code below again to start working on your css.
]]></b:skin>

Fifth: Right above that code, copy and paste this code below
#Followers1{ background:#ffffff; }
*Remember to replace your widget id where it says Followers1 and change the color where it says ffffff*

Last: Click Preview or Save Template and you're done! :)

So there you go! Hope this has helped in some way... somehow! LOL! Please be advised, that again, I'm no expert... I'm just sharing what worked for me! So if ever, do take your bitterness elsewhere! LOL! Thank you and have a good day/night :)

How To Change Blogger Simple Template Sidebar Background Color Part 1

This is so random but a friend of mine was having troubles changing her blog's sidebar color using the new blogger interface's "Simple Template" and have asked me for help since I'm also using the new blogger interface's simple template for my biz blog. Well, ok, so I'm no expert LOL, but I thought I'd share how I edited mine just in case anybody else out there is having the same problem.

Again, this is for the New Blogger Interface "Simple Template"...

First: Go to Template >> Edit HTML >> Proceed

Second: Press "ctrl+f" for windows or "command+f" for mac and find the code below
]]></b:skin>

Third: Right above that code, copy and paste this code below
#sidebar-right-1{ background:#ffffff; }

Fourth: So it should look like this
#sidebar-right-1{ background:#ffffff; } ]]></b:skin>

Last: Click Preview or Save Template and you're done! :)

And yes, it is just a simple css code but with this simple code, you can really do so much more! Change the background color to your desire, add border if you wish and all that jazz! LOL!

Nothing fancy but hopefully, it's how you want it and will work for you too! Good luck! :)

For more details: Check Out Part 2!