Wednesday, February 25, 2009

Marquee for your banner space solution

As we know the ad is for the life of Monetized Blogger, because it is a source of ad revenue for the blogger who monetize his/her blog. For those of you who join various affiliate programs on the internet certainly want to display all the banners from the affiliate program on your blog and hope you have a visitor interested in the program and become your referral.

Unfortunately, your blog will probably look very "commercial" if the appearance is dominated by the banners, this can provide the bad impact for your blog, because your visitors will not feel comfortable with the number of banner. In addition to inconvenience visitors, the blog with dozens of banner will also result in the limited space for articles. One solution to this problem is to display the banners on a particular area alternately in a sequence, that is using the <marquee> tag.

The <marquee> tag can be used for text or image. Here is a written format.

<marquee width=”x” height=”y” direction=”up/down/right/left” scrollamount=”z” bgcolor=”color”>Text/gambar</marquee>

Example:

<marquee width=”400” height=”15” direction=”left” scrollamount=”3” bgcolor=”yellow”>this is a marquee text, this is a marquee text</marquee>

It will appear as below:

this is a marquee text, this is a marquee text

Text above can also be replaced with a banner.

Example:

<marquee width=”468” height=”60” direction=”up” scrollamount=”2”><a href=”https://www.klikrupiah.com/index.php?ref=giantrooper><img src=”https://www.klikrupiah.com/images/klik2.gif” border=”0” height=”60” width=”468” /></a></marquee>

It will appear as below:

Do not forget to include your banner link url to remain clickable. Add a few more banner url. The result will be like a banner at the bottom of this blog.

To stop the movement when the banner is clicked, add the script onmouseover="this.stop()" and onmouseout="this.start()" in its <marquee> tag.

<marquee width=”468” height=”60” direction=”up” scrollamount=”2” onmouseover=”this.stop()” onmouseout=”this.start()”><a href=”https://www.klikrupiah.com/index.php?ref=giantrooper”><img src=”https://www.klikrupiah.com/images/klik2.gif” border=”0” height=”60” width=”468” /></a></span></marquee>

Now try to navigate your mouse pointer to the banner below and see the results.

So now you do not need to have a headache which would put your affiliate programs banner on your blog, other benefits your blog will be look more dynamic with these moving-images, you can innovate by adding more markup in the <marquee> tag. If you want to know more details you can visit www.htmlcodetutorial.com.

Have a nice try.

Read more...

1 comment:

  1. That is very nice. I didn't realize there was an html tag for a marqueue.

    ReplyDelete