Easy SharePoint Newsticker with Jquery

There are many posts already out there in which is described how to make a news ticker with jquery. In this post i would like to share a really easy implementation of a possible solution. You only need to add a content query webpart and configure it. Afterwords you insert jquery into the site and it is working.

Step 1: Add a Content Query Webpart

Configure it for your needs. In my example i configured the query to use only my news list and where the display date is greater than today.


The presentation i configured like this: Display only 3 items. Formatting with title and background


I’d like to mention, that you can choose different styles for the display of the items. In this post it is described how to define your own style.

And the normal output is now like this:


It display 3 news from 4.

Step 2: Add Jquery to your site

Now open SharePoint Designer and open the page in advanced mode. In the placeholder PlaceHolderAdditionalPageHead insert the following scripts and styles:

<script type="text/javascript" src="http://code.jquery.com/jquery-1.11.0.js"></script>
<script type="text/javascript">
$('.dfwp-list li:first').slideUp( function () {
}, 5000);

<style type="text/css">
/*News **/
.dfwp-list {
height: 110px;
overflow: hidden;

.dfwp-list li {
display: block;
border-bottom: 1px dotted #fff;
height: 30px;


Afterwords it slides the newsticker. Great thing and i wanna say thanks to this post.


This is really cool.

The article or information provided here represents completely my own personal view & thought. It is recommended to test the content or scripts of the site in the lab, before making use in the production environment & use it completely at your own risk. The articles, scripts, suggestions or tricks published on the site are provided AS-IS with no warranties or guarantees and confers no rights.

About Karsten Schneider 303 Articles
He is Consultant for SharePoint Solutions for collaboration, communication and business processes. He provides his customers applications based on standard features as well as development or combining the power of several microsoft tools like Dynamics CRM. In his free time he tries to collect tipps and worthy experience in this blog.


Leave a Reply

Your email address will not be published.