Wednesday, July 18, 2012

Add a Moving Text Bar on Your Blog

Visit Marks PC Solution to get more interesting Tips n Tricks!

Today I will give you a code that is really useful for bloggers. You have already noticed that this post has been started with a moving text. And from this post you'll learn how to add this on your blog. 

Before starting I wanna say you, this bar can be used as news headline or notice bar. Or you can use this for any purpose. It's simply an html code that can be placed anywhere of your blog. If you place it at the top then it can be used as news bar. You can also put it on the side or bottom of your blog. But make sure you're customizing the size and using the bar properly with the place where you wanna insert it. 

Let's start. (Make sure you're using new interface of blogger)
  1. First, go to the design option from your blogger page. 
  2. Then hit on Layout option from the left panel.
  3. Now click on Add a Gadget. I suggest to select gadget somewhere from top.  
  4. Now scroll down and choose Html/Java Script then copy and paste the code below.
  5. You're done. Save the code and refresh your blog page. 
<!-- This Script is from, Coded by:  Md. Abdur Rahaman--> <div align="center"><font color="#ffffff" size="+1"><marquee bgcolor="#000080"direction="left"loop="20" width="100%"><strong>Visit <a href=>Marks PC Solution</a> to get more interesting Computer and Internet Tips! </strong></marquee></font color="#ffffff"></div> <font face="Arial"><a target="_blank" href=""><span style="font-size: 7pt; text-decoration: none">Visit Marks PC Solution for Computer and Internet Tips</span></a></font>

You can customize the code as below : 
  • Replace the red text of the code with your text. 
  • Loop is 20. That means your text will be shown for 20 times. You can either increase or decrease the loop. But if you want the text to be shown for unlimited time then you should delete the this part of the code:  loop="20"
  • Div align center. You can use right or left.  
  • Font color is  #ffffff. You can choose any font color by changing the value. 
  • Background color is "#000080". You can choose any color by changing the value. 
  • Direction is left. You can also use right. 
  • Width is 100%. You can use 40, 50 or 70% too.  

Stay with Marks PC Solution to get more interesting IT topics!


  1. coller code pabeo kotai

    1. Plz use English, as the readers of this blog come from more than 150 different countries!

      If you have HTML knowledge then you can easily find out the color code. Another easy way is to find out the color code is Photoshop!

      If you use Photoshop then you may see that each color has its own code. U can choose the color from Photoshop.

      If you like this blog then plz like us on Facebook, +1 our posts.

      Thanks you for staying with us.

  2. how can i add in my joomla site??? plz tell me the procedure.... whether m a begaineer of Joomla....

    1. Thanks for contacting us.

      Actually this code is not tested in Joomla Sites. But if there is any place to place HTML/ JavaScript on Joomla then you can test it.

      Stay with us to get more . . .

  3. i need to put it with new Posts , i mean it grabs the new posts automatically ?
    How can i do that ... thx

    1. You're lucky buddy :)
      I have that code too! This will help you to show recent posts as news headlines at the top -

  4. Everything is there. See at the end of post.