6

RSS reader with jQuery (Zendesk Classic)

If you want to pull in a RSS feed from either our forums or a outside source you can use a custom widget to display the feed in the sidebar. Create a custom widget by going to Account=>widgets and click add widget. Copy this code into it, changing the URL you want to pull from 

You can also get it from github.com

<div id="feedContent">

<div id="feedContent">

</div>
<script>

$j(document).ready(function() {

truncate = function(text, length, ellipsis) {

// Set length and ellipsis to defaults if not defined
if (typeof length == 'undefined') var length = 100;
if (typeof ellipsis == 'undefined') var ellipsis = '...';

// Return if the text is already lower than the cutoff
if (text.length < length) return text;

// Otherwise, check if the last character is a space.
// If not, keep counting down from the last character
// until we find a character that is a space
for (var i = length-1; text.charAt(i) != ' '; i--) {
length--;
}

// The for() loop ends when it finds a space, and the length var
// has been updated so it doesn't cut in the middle of a word.
return text.substr(0, length) + ellipsis;
}

//if pulling from a zendesk RSS remove the /proxy/direct?url=http:// and just use /forums/17747-it/posts.rss

$j.get('/proxy/direct?url=http://rss.slashdot.org/Slashdot/slashdot';, function(d) {

$j(d).find('item').each(function(index) {

//name the current found item this for this particular loop run
var $item = $j(this);
// grab the post title
var title = $item.children('title').text();

// grab the post's URL
var link = $item.find('link').text();
// next, the description the second value sets the number of characters to display the 3rd value is what you want the ellipse to be

var fixedText = $j.trim($item.find('description').text().replace(/(<.*?>)/ig,""));
var description = truncate(fixedText, 200, '...');
//don't forget the pubdate
var pubDate = $item.find('date').text();

// now create a var 'html' to store the markup we're using to output the feed to the browser window
var html = "<div class=\"rssentry\"><h2 class=\"rsspostTitle\">" + title + "<\/h2>";
html += "<em class=\"rssdate\">" + pubDate + "</em>";
html += "<p class=\"rssdescription\">" + description + "</p>";
html += "<a href=\"" + link + "\" target=\"\_blank\">Read More >><\/a><\/div>";

//put that feed content on the screen!
$j('#feedContent').append(html);

// Set the number of items you want displayed remember the count starts at zero
if(index > 1) {return false;}

});
});

});

</script>

jquery-rss.png

 

 

Skip

Zendesk Support 

41 comments

Please sign in to leave a comment.