NewsGator Technical Blog

Release Notes for Today's Load

Some exciting stuff is being made available with this load. I'm happy to announce a new feature that lets you search for feeds that contain a particular topic: this will help you build whitelists for searching and related content. Here's a direct link to it in Editor's Desk (you must be logged in): http://hosted.newsgator.com/ADMIN/Pages/EditorsDesk/RelatedContentSearch.aspx

We also fixed the bug that caused Facebook widgets to not have an "Add to Profile" button. As you may recall (from this post), Facebook made some changes which broke that feature, but we fixed it.

Admin

• Statistics Page - Better handling of custom attention events in separate columns.
• Widget Builder - Modified content preview for Related Content widgets to show topic/keyword/keyphrase info for source article, and to show topics for related posts.
• Facebook Wizard - Modified verbiage to match changes in Facebook's application editor.
• Related Content Search - New feature! Allows you to search for feeds based on a topic. Added to the Utilities menu.

Widgets

• Post Toolbar - Due to lack of adoption, the "Send to Mobile" feature has been removed for the time being.
• Statistics/Reporting - Fixed a bug that caused subordinate widget descendents to not log attention data.
• Search - Modified keyword search to return more relevant results.
• Widget Code - Modified HTML entity encoding behavior to more consistently handle foreign language characters.
• Facebook - Fixed a bug that caused the "Add to Profile" button to not appear when adding an application.

What's Going on with Facebook?

Facebook made some behind the scene changes (again) that made the "Add to Profile" button disappear when adding a widget to Facebook. We're on top of this and working on a fix right now that will be loaded soon (keep an eye out for release notes on this blog).

Also, when creating a Facebook application in Editor's Desk, please note that the default FBML field has been moved from the profile section to the pages section. This will also be fixed in the wizard.

Facebook is sure keeping us on our toes...

Got any questions? Contact plsupport@newsgator.com

Related Content Screencasts

Want to sit back and watch me explain related content for you?

(It's easier than reading documentation, isn't it?)

Here's how to build a related content widget, and

Here's how related content works.

Analyze RSS Feed Content (with a Bookmarklet!)

This handy utility takes an RSS feed as input and provides a list of all the elements that are useful in your widgets. You can try it out here:

NewsGator Feed Analyzer

I made a bookmarklet for it, so you when you are viewing a feed in your browser you can just click a link to see the post content. This even works on regular websites: for instance, if you are visiting http://www.cnn.com, our system will be able to determine the RSS feed for that site and pull up the content. Go ahead an click on it to see what happens!

NewsGator Feed Analyzer Bookmarklet

In Firefox, just drag that link up to your toolbar. In IE, right-click on the link and add to favorites.

Why use it?
It's a far simpler way of viewing the content of a feed than looking through the XML for what can be used in a widget.

What does it all mean?
The analyzer lists the following for items in the feed.

• Title - The article title.
• Link - The HTML URL of the article.
• Pub Date - Date/time the article was published in the feed.
• Feed Name
• Guid - The unique identifier for the feed item. Usually just the HTML URL.
• Author
• Comments RSS - The URL of the comments feed for a post item.
• Enclosure Type - The enclosure's MIME type.
• Enclosure URL - The URL of the enclosure: here is one place where you'll see thumbnail and video content
• Media RSS - And this is the other place you will see podcast and video URLs, and occasionally thumbnails.

I like using the analyzer to see if items have thumbnails or video/audio content associated with them.

Release Notes for Today's Load

Today we will be loading the following new features into production. The most exciting addition is HowStuffWorks. If you use this search option in your widget, our framework will analyze the page the widget is residing on and return content from HowStuffWorks.com. This feature can be enabled for your widget account by contacting sales@newsgator.com.

The load will take place some time this afternoon, so all of these will be available later today!

Editor's Desk

• Widget code snippet window has a new look to it: when you "View Code" for a widget, your Home snippet is immediately available. The inheritance snippet can also be regenerated so you can have many unique inherited widgets.
• In the Manage Articles utility, new handpicked posts go to the top of your articles list.
• Additions to Related Content: specify a default topic and enhanced testing.
• New content type: HowStuffWorks (search option).
• Inheritance reporting now shows Facebook descendents in their own group.
• Statistics reporting: download CSV reports in IE and Safari.

Widgets

• New method: loadSubordinateWidget(). See WIKI for details: http://developer.newsgator.com/wiki/index.php?title=Loading_a_Subordinate_Widget.
• A number of back-end enhancements to Related Content, which will improve results.

Using jQuery in Your Widgets

We’ve found jQuery to be extremely helpful in widget development, since it really lends itself to efficient code that produces pretty robust results. For example, the accordion default widget template uses jQuery to select elements and move them around smoothly, all with only a few lines of code.

jQuery (http://jquery.com) is a JavaScript library that makes extensive use of selectors and their attributes. A lot of times you can simply use CSS selectors for particular elements in order to manipulate them (like referencing a <div> by its ID). That's where attributes come in: you can add and remove attributes to HTML elements, and modify their properties. jQuery lets you string together properties and so oftentimes only one line of code is needed to perform a number of functions.

If you're new to jQuery, give this article a read:

http://blemble.com/2009/01/comprehensive-introduction-to-jquery/

If you've had some experience in jQuery and want to improve your code, check out this article:

http://marcgrabanski.com/article/5-tips-for-better-jquery-code

For a really comprehensive list of selectors that even has a sandbox to play around in, see this one:

http://codylindley.com/jqueryselectors/

And finally, if you want to get really fancy in how you arrange and manipulate your HTML elements, have a look at Visual jQuery:

http://visualjquery.com/

Transparency in Embedded Flash Objects in Your Widgets

Flash objects can be embedded in widgets, per the instructions here: http://developer.newsgator.com/wiki/index.php?title=Embedding_Flash_In_Widgets

One thing you may note is that in the example we give, the wmode (windows mode) is set to transparent. We suggest this as a best practice for most cases. Why? Other HTML elements on the page may render behind the Flash movie (like a JavaScript drop-down menu). Since, by default, browsers will place the embedded content on the top-most layer, setting the wmode to transparent will ensure that the flash movie won't hide things.

If for some reason your Flash movie must have an opaque background (transparent mode may slow performance in some cases), you can use CSS to arrange the elements in your widget to show in the proper layers. Here is more information: http://capcai.indorelation.com/blog/index.php/2006/02/22/flash-behind-html/

And to understand each windows mode more clearly, here is a simple example of each type: http://www.communitymx.com/content/source/E5141/wmodeopaque.htm

Facebook Application Changes and How They Affect Your Widgets

In the past couple months Facebook has changed their application architecture a number of times, and we have steadily attempted to keep up with them (for the most part, successfully). Most recently however, the changes have been drastic enough that some of the widget applications based off of NewsGator widgets could be negatively affected, or even broken altogether.

The good news is that yesterday we loaded a new version of the Facebook wizard in Editor's Desk. If you have NewsGator widgets in Facebook, please test them to ensure they are working properly. If not, the act of simply stepping through the wizard will bring your widget up-to-date with Facebook’s framework. Don’t delete your existing apps, just use the wizard to copy fields from our wizard into your Facebook app, and vice versa.

Access the Facebook Wizard in Editor's Desk on the Manage page: simply expand your widget view, and in the tools menu on the left side you will see an icon for "Facebook."

Here are a couple important points:
--Facebook has moved to a new editor for Facebook Applications, which enforces a limit of 100 characters for URLs. If you open up an application with long URLs in the new editor and then save it, Facebook will truncate all the URLs behind-the-scenes, thus breaking the app. All the URLs we gave in previous versions of the Facebook Wizard were over 100 characters long, so this applies to all apps created through the Facebook Wizard, and likely ones made before we had a wizard.

--The profile page apparently has new size restrictions. From what we can tell it is 184px wide by 250px tall, but it isn't documented anywhere. This only applies to apps that use Flash or the “show an image on the profile page” option. You will have to make the image or Flash movie smaller.

If you have any questions at all please send us an email!

Release Notes for Today's (tentative) Load

The most important thing to note with today's load involves Facebook. Facebook very recently changed the way that widget applications are created, and so if you were to use the wizard in Editor's Desk to create your application you would find that the instructions are off the mark. We didn't see this coming, but the fix is ready to go and we should be loading today.

Until the Facebook changes get pushed to production, there may be errors in some widget applications. If you have any questions at all just send us an email.

Editor's Desk - Widget Manager. This new tool, "Edit History," will show previous versions of the widget (name of this tool may change).
Editor's Desk - Widget Manager. Added expanded tooltips on all widget tools.
Facebook Wizard - Rewrote all instructions, changed invalidation logic.

Since today's load is tentative, and there are only a small number of changes, I shall dub it "Today's Tiny Tentative Load," or TTTL. TTTL 4 LIFE!!

More on Related Content Widgets

So you've created a related content widget (using this helpful post as a guide), so now let's work on refining it.

How does NewsGator find related content?
For the page that the widget is residing on we look in our database for that very same post URL. How would it be in our database? Well, it should be no surprise that NewsGator syndicates SO MUCH CONTENT that yes! your blog is probably in there too. This post gets sent over to our friends at mSpoke, who analyze the content to define what topics the post is related to. We then hit up your whitelist to find other posts that match those topics.

Where should I put my related content widget?
The best place for related content widgets is on unique pages within your blog/website. The main page of a blog (for instance, http://blogs.newsgator.com/newsgator_technical_blog) usually isn't an actual article post, and so there aren't any topics that could define it (I'll show you how to get around that via a query string parameter on the script block).

How can I ensure that I get the best related content?

• Select a large number of feeds for your whitelist that are rich in the content you would like to show. The more articles that can be found in your whitelist, the less the widget will resort to the secondary search terms. Also, feeds that contain full text are best: the way to test this is if you view the feed in a reader, you see several paragraphs of content and not just the headline.
• Use secondary search terms just in case we can't find anything for the article the widget is residing on. While these searches may not be as closely related to the article, they are still based on our capable content searching techniques to find articles within your whitelist.
• If you have control over it, make sure the posts in your personal feed (the articles that we send over to mSpoke) have full text descriptions! This is how mSpoke figures out the topic of the post.

Why aren't any topics being found?
As I mentioned before, the main page of your site isn't really a topics-related post. But you can tell the widget to associate the content with a particular topic in the script block:

<script src="http://nmp.newsgator.com/ngbuzz/buzz.ashx?buzzId=1234
&apiToken=abcd&topic=widgets"></script>

This is a great way to show topics-oriented posts on your main page, or if your content isn't syndicated (won't be found in our database) you can select a topic for a particular page.

Another thing that could happen is we're not finding the exact post URL for where the widget is. If this is the case, you can override the URL in the script block:

<script src="http://nmp.newsgator.com/ngbuzz/buzz.ashx?buzzId=1234
&apiToken=abcd&url=http%3A%2F%2Fwww.example.com%2Fsomepage.html"></script>

What if my blog feed isn't in your system?
Add it to your whitelist!

What topics did you find for this post?
This code in the widget will show you:

{for topic in Topics}
  ${topic} 

{forelse}
  No topics found
{/for}

I need more information! MOAR!!
http://developer.newsgator.com/wiki/index.php?title=Related_Content_Widgets