-----------Original Post----------------
I recently learned how to create a widget where all my favorite blog buttons can scroll through a smaller space on my sidebar therefore making it look less cluttered!
They scroll like this:
Here's a how YOU can make your blog buttons SCROLL too!!
1. Go into your layout page and click on Add a New Gadget
2. Choose HTML/Javascript
3. Add the following code in the text box:
<center><div class="textwidget"><marquee direction="up" width="200" onmouseover="this.stop()" scrollamount="5" onmouseout="this.start()" height="400" align="center"> THIS IS WHERE YOU ADD THE HTML CODES FOR YOUR FAVORITE BUTTONS! (You can add as many as you like!) </marquee></div>
The colors in red can be adjusted to fit the space on your sidebars.
The number 5 in yellow adjusts the speed of how quickly the buttons will scroll! The higher the number the faster they will GO!
4. Click save and Viola!!
Enjoy your scrolling buttons and a lot less clutter on your blog!
The number 5 in yellow adjusts the speed of how quickly the buttons will scroll! The higher the number the faster they will GO!
4. Click save and Viola!!
Enjoy your scrolling buttons and a lot less clutter on your blog!
62 comments:
I used this today! Thanks for the tutorial.
Oh yeah, is there a way to leave a larger space in between each button?
I am loving this for a few things on my sidebar. Thanks!
Now... to find a spare minute to actually try it out... :)
I just responded (on my blog) to your comment that you left me and decided to leave a reply on your blog,as well. Just wanted to say thank you for your contribution to the subject of "comment etiquette." I guess I just need to decide what feels right for me. I'm still researching it though and will post what I find on my blog sometime tomorrow.
I'm so excited about your blog! I've been researching lots of blogger tips and tutorials and am in the process of creating a test blog to try more widgets etc.
I recently changed my blog to 3 columns by following instructions over at cutestblogontheblock.com and it worked perfectly, so then I helped a friend change hers also. I love learning new things and trying them out on my blog, but now it will be so much better,to have my test blog to try things out on.
Can't wait to check out more of your blog....I'm so excited!
I am going to try this tomorrow or this weekend to see how it works.
I love this, but I'm having a problem... I can only see the first few buttons. They scroll up from the bottom them stop when the first button gets to the top. Then it just starts all over again with the same few buttons. It never goes through all the buttons. I notice your "example" also does the same. Am I doing something wrong?
Thanks for posting this. I've often wonder how some bloggers got their buttons to scroll like that. I'm going to bookmark this for future reference and then check out all your other bloggy tips. So glad I found you!
I love your blog!!! I cannot tell you how many people I have given your link to! I made a button the other day, and now I have 2 scrol boxes!! You are AWESOME!!!
Thank you! This was sooooo easy!
I just used this and I added your buton to the list too!
Thanks a lot! I'm really wanting to have a blog makeover so I'll look to your blog for inspiration now!
Jen,
I love this - thank you for sharing with us!! I really like the new look of your blog too! Everything you do is amazing!! Oh and I LOVED the birdy on a branch you had on your other blog - if that's what you're going to do with your other one, I can't wait to see it when it's all done!! :) Oh, I just noticed your pink daisies freebie - SO, SO cute!! Do you think you do one for a 3 column blog?? ;-))
What a great solution! I didn't know what to do with all the buttons I've collected.
I just found your blog, and love it. Have to go look around a little more, but had to say hi.
THIS IS WHERE YOU ADD THE HTML CODES FOR YOUR FAVORITE BUTTONS! (You can add as many as you like!) So is this the blog address of those you want to add or only the html for the buttons? If it's only for the buttons is there a way to make a roll for your labels and blog list only?
This is just what I've been lookin' for to declutter my sidebars! Thanks a bunch! And, of course, I'll be adding your button to my scroll!
I left you a surprise on my new blog! Thanks for all of your wonderful tutorials and ideas!
Thanks for all the wonderful tips here!
I have the same issue as Christina (Apr 16 comment) --where the scroll goes through only the first 3 buttons and repeats the same first 3... Is there any way to get a continuous, looping roll? Or did I miss anything?
(Just added your button to my blog).
I'm having the same problem as some of the other ladies with it only scrolling 3 of the blog buttons. Love the idea and would love to get it working too! :)
Jolanthe
Hey There
I have used this feature for my blog and it works like a dream! I have just mentioned you in a post. Thanks for an awesome widget:)
Thank you Thank you Thank you! I have been searching everywhere for this! It worked! Yay!!!!
I have been searching everywhere for simple instructions on how to do this....THANK YOU!!!
Thank you! This was so easy! :0)
You are wonderful!!!
I'm following you now! Thanks so much!!! You are the only one that has been able to fix my problem! Thanks a ton!!! :)
ok, now it's not working...grrrr...I'm confused!
Thanks for commenting! I have tried everything, but it still is only showing 3 for me. I have asked others and a few people have said they can see more than 3, but most people say they can only see 3. Thanks again for the comment on my blog! You are so very kind. :)
This has been tremendously helpful: thank you so much. I had the buttons listed under one another, but not scrolling. And now I have!
Here's another problem you might have a solution for:
lots of blogs say "Take this button". when what they actually mean is "Take this picture and load as a picture box, and copy my url and paste it in the address section of the picture box".
Any ideas on how to condense those? And scroll them?
The only solution I can think of is putting their buttons on my own photobucket account so I can generate the img address to write the code, so it can be scrolled per your instructions here. There must be an easier way!
May I just say again, you are AWESOME! I wish I would have found you at the beginning of my blog overhaul because your instructions are by far the easiest to follow I've found. I'll be putting this blog in my "Blogs I Heart" post for next week :D
I just used this! I have been looking for an explanation that I could understand. Thank you, Thank you, thank you!! I just played around with the size & speed & I am in love, ha!!
Just added this to my blog and it works great! Thank you so much! Following you now :-)
Thanks!! This worked perfectly for me and now I have a ton more space on my blog.
-Nikki
Thanks for the tutorial I am going to try this today!
Kristin
www.peapodcreations.blogspot.com
Thank you so much for this. I have been trying to figure this out!
http://couponmommyof2.blogspot.com/
Thanks so much for this.. I've put it to use in multiple places on my blog.
:)
Wow awesome! Was wondering how to do this! Thank you! :)
Thank you thank you so much! You explained it so well...I never thought I could do this myself!
Thank you for this post. You made a not-so-tech-savvy person like myself feel very competent. And, I really like how you provided graphics in your tutorial. I will definitely come back to this site for more tips.
I've been looking everywhere for how to do this! Thanks SO much!!!
Ashley @ simplydesigning.blogspot.com
Yay! I've been searching all over for this information. Your's finally worked. Thanks so much for posting this!
Thanks so much for the tute! My buttons look SO much better now!
-Kimberly
finally!!! super thanks! you're so helpful, your blog is great! god bless.
This is great I just implimented the code on my blog ~ works great!! Thanks so much this frees up clutter on my blog :-)
I just found his info and it worked perfectly. It wasn't the first set of directions I tried but it IS the one that worked. Thank you for posting!
I do have one question. I have 3 boxes scrolling on screen at a time. How do I make it one box at a time?
You are a life saver... thank you so much for this tutorial. You have been so much help when it comes to my blog... nice not having to google everything I wanted... everything I was looking for was already on your blog!
Keep up the awesome work and I'm definatly following your blog. Feel free to stop by and follow mine!
All the best,
Kim
http://amoroccan-acat-and-my-bigass.blogspot.com/
Thank you so much! I added this today!
Thanks! I've been dying to add this so I can "declutter!" Plus I am hoping to one day have sponsors which will be great too! I appreciate the help with this!
http://ayearwithmomanddad.blogspot.com
Thank you for this tutorial! I just did a post on this and linked back to your post and of course I have your blog button on my new blog button scroll! Check it out here: http://asliceofsmithlife.blogspot.com/2010/07/how-to-make-blog-buttons-on-your.html
Thanks again!
Tracy
http://www.asliceofsmithlife.blogspot.com
Thank You!!
So happy I found your blog I have been trying to find this code for weeks.. Thanks so much for sharing :)
I just had that happen to me this morning! only my first 3 would come!!Shall try out your version.. thanks
I'm trying to use this code and it makes the FIRST button scroll, but the 2nd button gets stuck way at the bottom behind my other widgets and never scrolls. Do you know why this might be? I've tried this NUMEROUS times!
Please help if you can!
jkrs01 @comcast.net
thank you so much for this! i have been looking for it, googled it and there you were! and your blog is wonderful! faithful follower here!
Thank you so much for your tuts! They are a blessing. I am not very html savy and you make it easy.
If you have a chance could you take a look at my blog: www.yourheartmatterstome.blogspot.com . I am scrolling, but I have a lot of space between the loop and between the next item on my page. Do you have any suggestions?
Thanks!
Bethany
Oh and by the way, I added your button for Following the Footsteps to my blog list!
Awesome! I just added this to my blog and it works perfect! Thanks so much!!
Alissia
Tips 4 Green
thank you for the tutorial!
.autumn.
Hi! I am loving your tutorials! Thank you! I was curious tho, my scroll is having a problem only showing the 1st 3 buttons, I tried to copy the codes I, had in the gadget delete it and start over like you said, but it is still doing it. I was curious if you have any updates to this or a fix? Thank you! if you want to email me my email is:
sleatherberry at gmail dot com
Hi. I just wanted to say thanks. I used this code today!
THANK YOU THANK YOU THANK YOU SO MUCH!
Georgia from Blogging Maniac @ 50!
gmissycat at yahoo dot com
Hi, thank you so much for sharing your knowledge. You taught me how to create a button with code. Now, I am trying to make the buttons I have grabbed scroll. I am only able to see two buttons scroll though, and I am wanting to place your button on my blog. I have tried it over and over like you suggested, but I am having no luck. Since it has been a while since this tutorial was posted, I wondered if you ever found a solution to why more than two buttons will not scroll...or maybe someone else who had that problem has figured it out? Ms. K www.teacherblogspot.com
Thank you! I really appreciate the free code! I used it on my site "Why We Love Green" http://whywelovegreen.blogspot.com without any problems.
Thank you soooo much! I used this on my blog!
Thank you, Thank you soooo much! I needed one of these so bad. Thanks again!
so awesome!
Post a Comment