Organize Your Sidebar With A Scrolling Sidebar Gadget

Do you heart so many blogs that your sidebars are looking a little cluttered? Here’s a lovely solution to keep all those beautiful buttons and organize your blog all at the same time! Below is a quick tutorial on how to install a scrolling gadget:

1. Get the html code for all your buttons in one neat nice list~ you can copy and paste them onto Text Edit or Google Docs just long enough to hold them while you do the next few steps.

2. Go to your Dashboard and click “Add a Gadget”. Select “HTML Javascript” from the list.

3. Copy and paste the red text below into the box:


<marquee direction=”up” onmouseover=”this.stop()” width=”200″ scrollamount=”4″ onmouseout=”this.start()” height=”350″ align=”center”>



4. Go back to your list of the button codes and copy and paste it into the above code where it says “YOUR BUTTON CODES HERE”

*the great thing is that you can always add more!

5. You’re done here unless you’d like a little customization :)

- To center your buttons in the gadget use these tags before and after each button code:

<center> YOUR BUTTON CODE </center>

- To add spaces between your buttons insert <p> between the each code

- You can change the direction it goes by changing “up” to “down”, “right” or “left”

- You can change the size depending on the width of your sidebars… where it says “width” and “height”. Most blog sidebars are 180 px wide, but you always check the width of your sidebars by going into your Dashboard-> Design-> Edit HTML.

- You can also change the speed of the scrolling by adjusting the number next to “scrollamount”, the higher the number the faster your buttons will zip by :)

6. You did it! You are on your way to becoming a bloggy expert! ;)

Let me know if you give this a try, I’d love to see your very own scrolly gadget!


more blogger tips here

Related Posts Plugin for WordPress, Blogger...

facebook comments:

Subscribe by email:
Preview | Powered by FeedBlitz

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

CommentLuv badge