blog tips html techno tidbits

Techno Tidbits

I don’t know if you’ve noticed, but there have been a few changes going on around here. I’m trying to freshen up the look and format of my blog. I don’t have the cash-ola to pay someone to do it for me, so I’m off the beaten path looking for solutions to my own problems.
But, my searching won’t benefit only me- you’re in for some little bloggy nuggets yourselves. I plan on sharing my new-found wisdom with all of you in a series of posts called “Techno Tidbits”. Little things that are just nice to know when you want to make some changes to your blog.

So, up today are two of my latest finds. The first is kind of silly, but nice to know all the same.

1. I had changed my header a couple weeks ago and was frustrated with how large it looked. I didn’t want so much white space on the top of my blog- it’s just a waste really. I searched high and low for ways to change the height of my header and felt like I was going around in circles. Then, I finally found the bit of information that saved my poor little head{er}- the size of your header is proportional to the size of the image you put into it!!! Light-bulb! Could this really be this simple? Yes indeedy! If you think your header is too big- edit your image to be shorter. When I made this new header last night I changed the size of the graphic to 900 pixels wide by 250 pixels high*. And BAM!!! the right size header for me. [note: this is true for the new blogger templates] *all pixels are approximations- see your template for the width dimensions of your blog.

2. You have a great project, you’re excited to link it up all over blogland, you are copying and pasting button code hand over fist and your post doubles in size because of all the extra baggage hanging on behind. Well, my dears I have the code you need to tame those button beasts. It’s as simple as adding a width=”100″ height=”100″ inside the img code. {or whatever numbers you want to put in} To explain- the image (img) code refers to the picture that makes up the button. Usually it’s a link to an online photo storage location which hosts the image. I knew you could change the size, but the instructions I had seen only explained how to do it if it already had a width/height space in it. So, now you know that even if it doesn’t already have those phrases in the code- you can add it yourself. Just look for the img {with a < width="{whatever number you want}" height="whatever number you want" id="SPELLING_ERROR_8" class="blsp-spelling-corrected">some one’s button is being silly and wants to land itself in the middle of your page, you just have to do a little trimming of the button code. Go to the Edit Html screen and look for their button code. find the center code {it will say center and be surrounded by <>} and delete it- you will need to look for it in two places- the beginning of the code and the end of the code. {don’t worry if you forget to delete both you won’t be able to publish the post because the code will be incomplete- and you will be able to figure out what you’re missing}

So, get out there and modify girls! Stay tuned for more groovy information coming your way.
p.s. sorry about lack of pictures in this post, I’m too lazy to go look up someone else’s picture and save and link and blah, blah, blah… yup- La-zy!

  • Gwen @ Gwenny Penny
    February 20, 2011 at 3:53 am

    Great tips! So nice of you to share everything you've discovered. The blog looks great, by the way:)

  • Amy @ Increasingly Domestic
    February 20, 2011 at 4:57 am

    Love the new header! I have been wanting to redo my blog design and I would be doing everything on my own as well. I look forward to future posts on the subject:)

  • Christina @ AccomplishingMotherhood
    February 24, 2011 at 9:27 pm

    Oh I need to do this, because those buttons lose control and try to take over my world!!!!

  • Christina @ AccomplishingMotherhood
    February 24, 2011 at 9:31 pm

    Wait….. I LOVE LOVE LOVE LOVE LOVE the new header! That really rocks!