Sign Up! Login: Password: New User? Forgot? Support
Top Mods!
Wowhead Search
by sonofsamedi
Digital Clock
by Wolfar15
Admin Forums
Welcome to the GuildPortal Help Community! These forums are for admin-to-admin help.
Available Forums
Forums : Pimp My Site! > RSS Feeds
Avandius (New Admin) 11/6/2008 8:52 AM EST : RE: RSS Feeds
Avandius
Posts: 337
Fingers of Fury!

What kind of borders would you need? Just the corners or what?

Also i ran into a weird bug.. if you have an embedded movie on your page and hover over a RSS feed the embed takes precedence and displays on top of the tooltip. 

Check this out here, hover over the WoWinsider tooltips on the right and notice how they go under the Trailer Video.
TopBottom

Mottie (MVP) 11/6/2008 11:46 AM EST : RE: RSS Feeds
GuildPortal MVP
Mottie
Posts: 3884
Zomgawsh Poster

I'm probably going to need all the edges: 4 corners, top, bottom and sides.... make em around 5px in size.

The video overlapping the tooltip isn't a bug that I can get around... the layering of videos seems to be above everything else... including the facebox window.

Also, I noticed on Firefox your content boxes are all lined up on the left side of the page now.
TopBottom

Mottie (MVP) 11/8/2008 8:01 AM EST : RSS Feed Box v1.3
GuildPortal MVP
Mottie
Posts: 3884
Zomgawsh Poster

RSS Feed Box v1.1 | RSS Feed Box v1.2 | RSS Feed Box v1.3 | RSS Feed Box v1.4

RSS Feed Box v1.3

This version of the RSS Feed Box uses a separate tooltip for the feeds. The new tooltip requires a single background image, see the details below.

The Code

<div id="feedText1"></div>
<style type="text/css">
.feedTitle { color: #999999; }
.feedDate { color: #3A5894; }
.feedDesc { color: #999999; padding: 5px; }
.feedDesc img { max-width: 550px; }

#feedText1 {font-size: 12pt;}
#feedText1 a:link { color: #3A5894; text-decoration: none; }
#feedText1 a:visited { color: #354973; text-decoration: none; }
#feedText1 a:hover { color: #354973; text-decoration: none; }
#feedText1 a:active { color: #3A5894; text-decoration: none; }

.tooltip td { background: transparent url(http://i201.photobucket.com/albums/aa236/Mottie1/testsite/styles/tooltip.png);}

.tooltip {empty-cells: show; border-collapse:collapse; border-spacing:0;}
.tooltiplt {padding: 10px;}
.tooltiprt {background-position: right top !important;}
.tooltiplb {background-position: left bottom !important;}
.tooltiprb {background-position: right bottom !important;}
</style>
<script type="text/javascript" src="http://www.google.com/jsapi"></script>
<script type="text/javascript">
google.load("feeds", "1");
$(document).ready(function() {
var myfeeds = new Array();

var feedBox = "feedText1";
var tooltipWidth = 560;

var previewMode = true;
var previewLength = 500;
var readMoreMessage = "...<br><br><img align=right src=http://i201.photobucket.com/albums/aa236/Mottie1/testsite/styles/moreinfo.gif>";

myfeeds.push (["Digg Stories/Popular","http://www.digg.com/rss/index.xml",5]);
myfeeds.push (["WoW Blues Comments","http://www.wowblues.com/feed.xml",6]);
myfeeds.push (["New Movies this week","http://us.rd.yahoo.com/movies/rss/thisweek/?http://rss.ent.yahoo.com/movies/thisweek.xml",7]);
myfeeds.push (["Warhammer Current News","http://feeds.warhammeronline.com/warherald/RSSFeed.war?type=current",10]);

// **************************************
// Do not change anything below this line
// **************************************
var ttcss = "#dhtmltooltip";
var ttBrdr = $(ttcss).css("border-width");
var ttBkgd = $(ttcss).css("background-color");
$("#"+feedBox)
 .mouseover(function(){$(ttcss).css("border-width","0").css("background-color","transparent")})
 .mouseout (function(){$(ttcss).css("border-width",ttBrdr).css("background-color",ttBkgd)});
 for (var k = 0; k < myfeeds.length; k++) {
  feedResult(myfeeds[k]);
 }
function feedResult(currentFeed) {
 var feed = new google.feeds.Feed(currentFeed[1]);
 feed.setResultFormat(google.feeds.Feed.XML_FORMAT);
 feed.setNumEntries(currentFeed[2]);
 feed.load(function(result) {
  if (!result.error) {
   var ftitle = (currentFeed[0] == "") ? (result.xmlDocument.getElementsByTagName("title")[0].firstChild.nodeValue) : (currentFeed[0]);
   var feedText = "<div class='feedTitle'>" + ftitle + "</div>";
   var items = result.xmlDocument.getElementsByTagName("item");

   for (var j = 0; j < items.length; j++) {
    var titleElement = items[j].getElementsByTagName("title")[0];
    var xtitle = titleElement.firstChild.nodeValue;

    var titleElement = items[j].getElementsByTagName("link")[0];
    try {var xlink = titleElement.firstChild.nodeValue;} catch(e) {xlink = "";}

    var titleElement = items[j].getElementsByTagName("pubDate")[0];
    try {var pubDate = titleElement.firstChild.nodeValue;} catch(e) {pubDate = "";}

    var titleElement = items[j].getElementsByTagName("description")[0];
    try {var descript = titleElement.firstChild.nodeValue;} catch(e) {descript = "";}

    pubDate = pubDate.replace(/'/g,"&rsquo;").replace(/\"/g,"&quot;");
    descript = descript.replace(/'/g,"&rsquo;").replace(/\"/g,"&quot;");

    if (previewMode) {
     var dStart = descript.indexOf("<br>") + previewLength;
     if (descript.length > dStart) {descript = descript.substring(0,dStart) +  readMoreMessage;}
    }

    var feedPopup = '<div><table class=tooltip><tbody><tr><td class=tooltiplt>';
    feedPopup += '<div class=feedDate>' + pubDate + '</div><div class=feedDesc>' + descript + '</div>';
    feedPopup += '</td><td class=tooltiprt>&nbsp;</td></tr><tr><td class=tooltiplb>&nbsp;</td>';
    feedPopup += '<td class=tooltiprb>&nbsp;</td></tr></tbody></table></div>';

    feedText += (j % 2 == 0) ? '<div class=NormGridRow>' : '<div class=AltGridRow>';
    feedText += '<a href="' + xlink + '" =\"ddrivetip(\'' + feedPopup + '\', \'\', \'';
    feedText += tooltipWidth + '\');\" ="hideddrivetip();">' + xtitle + '</a></div>';
   }
   feedText += '<br>';
   document.getElementById(feedBox).innerHTML += feedText;
  } else { alert ("feed error from " + currentFeed[0]); }
 });
 }
});
</script>

Customizing

  • Please follow the instructions provided with RSS Feed Box v1.2 on how to customize this script. The notes below are on the updates.
  • I replaced the text in the "readMoreMessage" variable with an image... replace that URL in orange if you want to add your own (NOTE: do not add quotes around the URL).
  • To customize the new tooltip border/background:

    • The border image is a 700x700 pixel transparnet PNG file that I "borrowed" from wowhead.com. Here is a link to it if you want to download it to modify it in any way.
    • Look in the CSS code for ".tooltip td", and replace the image URL in orange with your image URL.
TopBottom

Fagulhas (Guild Admin) 2/6/2009 5:24 AM EST : RE: RSS Feed Box v1.3
Fagulhas
Posts: 1859
Zomgawsh Poster

Hey mottie, is there a limit on how much information the google script can get for a feed? I understand you have a variable to limit the size of the feed but even if i insert a really huge number there, it doesn't have any effect on very long long long feeds. The reason for this is that i was implementing a MMO-Champion live feed directly into my website, displaying the information right away instead of links. For example, see next post

TopBottom

Fagulhas (Guild Admin) 2/6/2009 5:24 AM EST : RE: RSS Feed Box v1.3
Fagulhas
Posts: 1859
Zomgawsh Poster

Edit: Ok found out something entirely different. Feeds DO work on IE without cutting them up but on firefox, all the feed entries are incomplete. Also another "bug" with this rss parser is that images are not supported, they get added our address plus the image address. Example: "http://cont.guildportal.com/%22http://static.mmo-champion.com/mmoc/images/icons/ideathknights.gif%22"Have a look here Mottie if you want to try out the code i've put in place. http://cont.guildportal.com/Guild.aspx?GuildID=51848&TabID=2195064


Edit: Another finding, images and links works fine on Google Chrome? :S Cross-browsing ftw.

TopBottom

Mottie (MVP) 2/6/2009 8:29 AM EST : RE: RSS Feed Box v1.3
GuildPortal MVP
Mottie
Posts: 3884
Zomgawsh Poster

Hi Fagulhas!

Wow sorry about that... you can never predict what'll be in the feeds. Try this quick fix to get it to display everything properly, but I'm still trying to figure out why the google feed is cutting off the content. Also, I noticed some text is turned black... don't have the time to mess around with why that's happening right now, but I'll look into it.

Just update these two lines in the code:
pubDate = pubDate.replace(/'/g,"\'").replace(/\"/g,'\"');
descript = descript.replace(/'/g,"\'").replace(/\"/g,'\"');
TopBottom

Fagulhas (Guild Admin) 2/6/2009 10:45 AM EST : RE: RSS Feed Box v1.3
Fagulhas
Posts: 1859
Zomgawsh Poster

Mottie said:
Hi Fagulhas!

Wow sorry about that... you can never predict what'll be in the feeds. Try this quick fix to get it to display everything properly, but I'm still trying to figure out why the google feed is cutting off the content. Also, I noticed some text is turned black... don't have the time to mess around with why that's happening right now, but I'll look into it.

Just update these two lines in the code:
pubDate = pubDate.replace(/'/g,"\'").replace(/\"/g,'\"');
descript = descript.replace(/'/g,"\'").replace(/\"/g,'\"');


The black is actually part of the feed bud The fix works btw. Now only the cut off thing. Odd that it works correctly on IE and Chrome.

TopBottom

Kaelara-GM (New Admin) 3/18/2009 9:45 AM EST : RE: RSS Feed Box v1.3
Kaelara-GM
Posts: 2739
Zomgawsh Poster

http://chivalry.guildportal.com/Guild.aspx?GuildID=226723&TabID=1944280

When using your CSS code - for some reason I'm not getting any data from the shamantics blog feed from one of my guildees.

http://shamantics.blogspot.com/rss.xml is what I'm using for the link.

Am I doing something wrong?
TopBottom

Mottie (MVP) 3/23/2009 10:59 AM EST : RE: RSS Feed Box v1.3
GuildPortal MVP
Mottie
Posts: 3884
Zomgawsh Poster

Hi Kaelara!

Sorry it took me so long to reply... the Shamantics feed seems to be working properly for me. When I went to your site, I see the feed there as well, but you are missing the tooltips script.

Just add this code into your banner HTML:
<script src="http://www.axiomfiles.com/Files/243007/dtips.js" type="text/javascript"></script>
and you should get all your tooltips back.
TopBottom

haruosan (New Admin) 7/22/2009 2:45 PM EST : RE: RSS Feed Box v1.3

haruosan
Posts: 5
Getting Started!

Ok, I haven't the faintest clue about webdesign. That said:

I am trying to add a RSS Feed (quite obviously) from the game City of Heroes to my website. First I tried the native feed box, but it didn't provide the feed... I searched the forums and it seems that THIS code is the only reliable alternative to it, so I gave it a try. I copied and pasted the code from V1.3 and changed the title, URL and number feeds only, but when the page loads it gives me the message "feed error from Server Status". The command line for the feed looks like this "myfeeds.push (["Server Status","http://www.cityofheroes.com/servers/server_stat.xml",12]);".

Am I missing something stupid? What am I doing wrong? These guys got it working: The Justice Guard
TopBottom

Admins Online
There are   members online.
So-and-so has logged on!
%title%
%message%