Posted by / 8/04/2011 / No comments / ,

Blog DIY- make your own floating sidebar.

Want to make fun scrolling page tabs for your blog? Here's how I did mine!

1. Design your button(s). On mine, "About me", "Sponsor" and "Tutorials" are 3 separate buttons. (I used photoshop, but you could use paint, picnik, etc.) Mine are 125 px wide, but you can make them as small or large as you want.

2. Download this code into a program like notepad.

3. Enter the link your want your button to go to in the spot where it says LINK HERE in between the two " "

4. Type the name of your button where it says TITLE. This is just what your button will say when someone hovers their mouse over it.

5. Upload your button into a website like photobucket or flickr and grab the 'Direct Link' and paste it into the code where it says DIRECT IMAGE LINK.

Here's what my code looks like now---

Now go to blogger and click "design" and then click "add a gadget" and add a HTML/Javascript. Copy and paste your edited code into it. View your blog and it should now have your button on the left side. :)

If you want to do more than one button (like mine) then you will need to change the code for each button, (changing the link, title, and image link) and you will also need to change This portion of the code--

Change it to whatever your button pixel height is, and add 10 to it. for example, My button is 30 px in height, so I changed 10px to 40px. This is so that your 2nd button floats above your 1st button, not the same place. Make sense?
For every button you do, you will need to change that number, adding to it whatever the height your button is.

If you use this tutorial, please leave me a link to your blog- I would L-O-V-E to see how it turned out! And, if you have any questions let me know. I'm no expert, but I know a little (tiny) bit.
Share This Post :
Tags : ,

About Me

Hi, Welcome to my blog!

I'm Katie, the artist behind the blog Punk Projects. I love everything crafty, I drink tea all day long, I'm a bit of a nerd, and I usually have ink or paint on my hands.

Blog Archive



Tombow Affiliate

Popular Posts