{Scrolling Buttons Box for Blogger}

Have you ever wanted one of those boxes with the scrolling buttons on your Blogspot/Blogger blog. Here is an example of one with two of our Smart and Trendy Moms Buttons:

Since we are dealing with a widget, if you already have buttons in your widget, you will want to cut and paste that code into a text file and save it.  (You NEED a backup. Its really a pain to set up all your buttons again if something doesn't go right the first time.)

Here's how to add the scrolling button box:

AS ALWAYS BEFORE YOU MAKE ANY CHANGES, BACK UP YOUR CURRENT TEMPLATE & WIDGETS

1. Go to Layout

2. Click "Add a Gadget" in the area that you want to add the box

3. When the Add a Gadget box comes up, choose HTML/JavaScript

4. Here is the code you will paste into the box. You need to add the html for your buttons in between the two pieces of code.

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

THE HTML FOR YOUR BUTTONS GOES HERE

</marquee>
</center>


In the top piece of above the button code, you can customize things:

direction="up" can be changed to control which way the buttons move - "up", "down", "right", or "left"

height="350" controls how tall the area that the buttons scroll through is - "number"

width="175" controls the width of the box - "number" (this cannot be larger than the column it is in)

scrollamount="4" this controls the speed the buttons move, the higher the number the faster they go.


I hope you enjoyed this post! Never miss a post-Subscribe by Reader or Email!Smart and Trendy Moms finds products, ideas, projects, recipes, and other information that we have personally found helpful or interesting.  As always, it is up to you to determine what is appropriate for you, your children, and your situation.  See our Disclosure