Thursday, October 11, 2007

Blogger Loyalty

I was this close to switching my whole blog over to wordpress. I had imported all my posts, set up a new url, and designed a new site. But, I wasn't totally pleased with the options over at wordpress. Their customizable headers are clearly superior, or at least more user-friendly, than the ones at blogger, because, for example, I can't figure out how to make my custom header on blogger go across the entire page. However, what I didn't like about wordpress is that it was more difficult than blogger to change the colors on the rest of the blog.

For all those reasons, including my soft-spot for blogger (it's where Bean and I started this blog as "Buttercup & Bean" - so cute! - way back in 2005), I've decided to stay for now.

It would be super-cool if some kind soul out there could help me fix my header...


soleil said...

i feel the same way about blogger. some of my friends have switched over to wordpress and swear by it but i am attached to my little place at blogspot. i wish i could help you with your header. i don't know how to do any of that custom stuff.

Starrlight said...

Been there and nearly swapped myself. What size is your image? Is Blogger shrinking it? You might try contacting Kyra at

She is crazy but talented! Tell her Starr sent you =)

Greg said...

Do you just want that image to stretch across the dark purple area? If so your image will deform. Your current image is 320 x 122 pixels. The ideal image for that space should be about 710 x 122 pixels. If you don't mind what stretching does to the image, then the easiest thing to do is resize the image and use bloggers utility to add the image to the back of the header like you probably did here.

I'll send you a copy of a resized version of your current image that should fit to the email address in your profile. It loses some to a lot of clarity in stretching. You might still like it though. It's better to shrink or trim to fit images than stretch them.

If you are looking to do something else explain more.

No Nonsense Girl said...

stay, stay, stay!!!

Buttercup said...

Thanks for the tips!

Thanks to Greg, I now have this stretched header. Thanks Greg! I'm impressed you know how to do that.

Buttercup said...

p.s. Now, if anyone knows how to get rid of the pale green bars between my posts, you're genius.

Greg said...


You'll have to go into your template script and make a minor change. So here it is step by step.

1) Go into your Blogger Dashboard and go to Manage Layout for your blog.

2) The "Template" tab should be selected at the top.

3) Select the "Edit HTML" link under this.

4) You should see the script in a textbox on this page.

(At this point you probably should save your current template. You are not changing very much, but there is a possibility that you might mess something up and then yell at me. I think you'd be over protective with your blog so therefore very careful, but who knows. This had to be said. You could always revert back to the original but if you changed colors or made any other changes you would have to redo these. If you don't know how to save a copy of this let me know. )

5a) If you are using IE and a PC: hit CTRL-F on your keyboard and bring up the find window.


5b) If you are using something other than IE and a PC and know how to bring up a find window, then do that now.


5c) If 5a or 5b doesn't work you'll have to manually scroll down the script to find what we are looking for. This isn't a big deal.

6) If you have the find window open type in: ".post-footer" (no quotes, yes period). Or just scroll down until you see the line:

.post-footer {
  background: (...)

7) Once you find the ".post-footer {" line, you want to find the entry under it (property) named "background".

8) The background property will be either set to "#ded" or it night have a word there. This is what is causing that green color. The specific color is #ddeedd which means a color mix ratio of Red=221, Green=238, Blue=221, where each has a range of 0-255.

9) Ok here is the part where you actually do something: Change only the "ded" part. Be sure to leave in the "#" if it is there. If a word is there instead you will replace the word and add a "#". The "ded" should be changed to "ffffff" which means white (total color saturation). Be sure to leave the semicolon ";" after the letters.

10) Your new version should look something like this:

.post-footer {
  background: #ffffff;
  padding:2px 14px 2px 29px;

11) Click the SAVE TEMPLATE button.

12) Declare your undying gratitude to me and erect a small shrine to me in some corner of your apartment.

Greg said...

I should mention that the way I suggest above creates the least amount of change to your original template. If you were to change your background color of your posts, then a white bar would appear where the greenish one did. You could effectively make it transparent, but then that changes the template a little bit.

Buttercup said...


Right now I kind of think you're awesome. Thanks for all of your help.


Greg said...


I like your qualifier, "right now," but I'll take what I can get.

You're very welcome.

gravelly said...

This is soooo over my head! Have a great weekend, Buttercup! Jag alskar dig!

Sparky Duck said...

typical of a woman, always changing there minds