Install Feed With Marquee Effect

If we install the feed in the blog, we can provide marquee effect on feed, so feed it to move. This will make it more dynamic. To install a Marquee effect on feed, we need to edit your blog template. If you are interested to install on your blog, follow the steps below.

1. Log in with your BLogger account.
   
2. Go to Layout.
   
3. Click Page Element.
   
4. Select Feed.
   
5. Type your Blog Feed Address in the blank box beside URL Feed. Example your blog address is http://andreas.blogspot.com, than your Feed URL is http://andreas.com/atom.xml.
   
6. Click Save Changes.
   
7. Next Steps is make marquee effect in yoru template.
   
8. Click Edit HTML.
   
9. Mark on Expand Template Widget.
   
10. Find this code.
    
    <b:widget id='Feed1' locked='false' title='Recent Post' type='Feed'>
    
    <b:includable id='main'>
    <h2><data:title/></h2>
    
    <div class='widget-content'>
    
    <ul expr:id='data:widget.instanceId + "_feedItemListDisplay"'>
    
    <b:loop values='data:feedData.items' var='i'>
    
    <li>
    
    
    <span class='item-title'>
    
    <a expr:href='data:i.alternate.href'>
    
    <data:i.title/>
    
    </a>
    
    </span>
    
    <b:if cond='data:showItemDate'>
    
    <b:if cond='data:i.str_published != ""'>
    
    <span class='item-date'>
    
    &#160;-&#160;<data:i.str_published/>
    
    
    </span>
    
    </b:if>
    
    </b:if>
    
    <b:if cond='data:showItemAuthor'>
    
    <b:if cond='data:i.author != ""'>
    
    <span class='item-author'>
    
    &#160;-&#160;<data:i.author/>
    
    </span>
    
    
    </b:if>
    
    </b:if>
    
    </li>
    
    </b:loop>
    
    </ul>
    
    <b:include name='quickedit'/>
    
    </div>
    
    </b:includable>
    
    </b:widget>
    
    
11. Add marquee code as shown below.
    
    <b:widget id='Feed1' locked='false' title='Recent Post' type='Feed'>
    
    <b:includable id='main'>
    <h2><data:title/></h2>
    
    <marquee align='center' direction='up' height='150' onmouseout='this.start()' onmouseover='this.stop()' scrollamount='2' width='100%'>
    
    <div class='widget-content'>
    
    <ul expr:id='data:widget.instanceId + "_feedItemListDisplay"'>
    
    <b:loop values='data:feedData.items' var='i'>
    
    <li>
    
    
    <span class='item-title'>
    
    <a expr:href='data:i.alternate.href'>
    
    <data:i.title/>
    
    </a>
    
    </span>
    
    <b:if cond='data:showItemDate'>
    
    <b:if cond='data:i.str_published != ""'>
    
    <span class='item-date'>
    
    &#160;-&#160;<data:i.str_published/>
    
    
    </span>
    
    </b:if>
    
    </b:if>
    
    <b:if cond='data:showItemAuthor'>
    
    <b:if cond='data:i.author != ""'>
    
    <span class='item-author'>
    
    &#160;-&#160;<data:i.author/>
    
    </span>
    
    
    </b:if>
    
    </b:if>
    
    </li>
    
    </b:loop>
    
    </ul>
    
    <b:include name='quickedit'/>
    
    </div>
    </marquee>
    </b:includable>
    
    </b:widget>
    
    
12. Click Save Template button.
    
13. Finished.
    

Need to know in that, the marquee code will less good if viewed in a browser mozilla, this code works well when viewed on the internet explorer browser.