Sunday, 15 August 2010

Blogging Tips: Creating a Scrolling Blog Button Viewer

In case you don't know what that is, it's the scrolling (moving) gadget on my side bar. The one displaying all my blog buttons. Many have asked me how to do it and so I'm going to give a tutorial now.

1) Go to your 'dashboard'
2) Click 'Design' under your blog
3) Under the 'Page Elements' tab, click add gadget where you want a gadget
4) Select the add HTML

5) Copy and paste the text below into an HTML


<center>

<div class="textwidget">

<marquee direction="up" width="200" onmouseover="this.stop()" scrollamount="5" onmouseout="this.start()" height="400" align="center">

<center>
<a href="http://clarissadraper.blogspot.com/" target="_blank"><img src="http://lh6.ggpht.com/_ED_xmanimDQ/S89LMEL-GXI/AAAAAAAAAGM/gEI3YBlF4Q8/LTTV.JPG" /></a>
</center>

</marquee>

</div>

</center>


You'll notice in red some numbers. You can change those if you like to make the width of the scroll bar wider or taller depending on the size of your sidebar.

I put my button as one of the buttons for demonstration. I hope you keep it but you don't have to.

6) Visit blogs and where it says "Take my button" take the code and place it between the </center> and the </marquee>

If you have any questions, you can always leave a comment or email me and I'll help you through it.

18 comments:

Boonsong said...

Boy am I ever pleased that I found your blog! This is another really useful post. Thanks for this.

All the best from Gushingly Grateful Boonsong

Alex J. Cavanaugh said...

I might try this.

Clarissa Draper said...

Boonsong and Alex, I'm glad you liked it and I hope it helps you create one. If you have any problems, let me know.

CD

Talli Roland said...

That's awesome, Clarissa - thank you!

Margot Kinberg said...

Clarissa - Thanks for these clear instructions! I've always wondered how people do that; now I know! You're a very helpful blogger :).

Clarissa Draper said...

Talli, glad you liked it.

Margot, it's really not hard to do, especially if you know what to do.

CD

Madeleine said...

Ooh, I've wanted to make one of these for a while. There are some great blogs out there (including this one) that I want to share with people! Thanks Clarissa.

Clarissa Draper said...

Madeleine, I'm so glad you find it useful. Please, let me know if it works out.

CD

Mason Canyon said...

Very helpful. You make it seem so easy. Thanks.

Mason
Thoughts in Progress

Little Tesoro said...

Cool! I think I may try this, thank you so much.

Helen Ginger said...

Very interesting. I'll come back. I'm on my husband's iPad and don't see anything scrolling. Yes, my computer has crashed yet again.

Chuck said...

Thanks Clarissa! I have seen this on several blogs and it is very eye-catching. Thanks again and I will take your button!

Clarissa Draper said...

Mason, it's really not so difficult.

Little Tesoro, you're so welcome and I'm now a follower of your blog.

Helen, well, when you get your computer back, hopefully you can get it working.

Chuck, thank you. If you have any questions, you can email me.

CD

arlee bird said...

That's pretty cool info. I still have to get to modifying my page view. I'll keep this in mind for future reference.

Lee
Tossing It Out

Lynda Young said...

I always wondered about that. Thanks for the info :)

Jules said...

Thank you for posting this. I'm trying to re-work a lot of things on my layout and that was one of them. I'm learning just enough code to screw things up and then fix them. :D
Trying To Get Over The Rainbow

SugarScribes said...

Well I did it, but I do not think it looks anything like what it is supposed to. You will have to take a look at my blog, please. I do see your button, but it is on both sides and well , you will have to see for yourself. I cannot explain it. I am a techno idiot.

I will work on it more when I have had more sleep. Please take a look when you have a chance/

Andrea said...

This is the first code I've found that works! Thank You!!!!

Popular Posts

Blog Archive