Monday, January 11, 2010

[g-fb-dev] Google FeedBurner Dev

Metadata

  • Btn: g-fb-dev
  • First Release: 2010-01-11
  • Code Last Updated:
  • Doc Last Updated:
  • Status: Experimental

Description

g-fb-dev is a library relating to FeedBurner API. This page is written for web developers.

Documentation

Move your mouse cursor over the number, you can get more detail.

Loading Library
<script src="http://www.google.com/jsapi" type="text/javascript"></script>
<script src="http://lilbtn.appspot.com/g/fb/fb.js" type="text/javascript"></script>
Get Feed Data

You can use lilbtn_g_fb_get_feed_data to retrieve feed data from FeedBurner Awareness API.

lilbtn_g_fb_get_feed_data(feed_url, function(rsp) {
  if (rsp.error || rsp.stat != 'ok') {
    // Something went wrong with YQL or FeedBurner API
    // rsp.error is from YQL
    // rsp.err is from FeedBurner API
    var errmsg = ((rsp.error) ? rsp.error.description : rsp.err.msg) + ';
    alert(errmsg)
    return;
    }
  var data = rsp.feed.entry;
  alert(data.circulation);
  alert(data.hits);
  alert(data.reach);
  alert(data.date);
  });

[g-fb-feedcount] Google FeedBurner FeedCount in HTML/CSS

Metadata

  • Btn: g-fb-feedcount
  • First Release: 2010-01-11
  • Code Last Updated:
  • Doc Last Updated:
  • Status: Experimental

Description

g-fb-feedcount is similar to FeedBurner FeedCount but in pure HTML + CSS.

Demonstration

Default
<span id="lilbtn_g_fb_feedcount"></span>

<script type="text/javascript">
lilbtn_g_fb_feedcount_render('http://feeds.feedburner.com/lilbtnBlog');
</script>
More Than One Subscribers Count

<span id="lilbtn_g_fb_feedcount_1"></span> <span id="lilbtn_g_fb_feedcount_2"></span>

<script src="http://www.google.com/jsapi" type="text/javascript"></script>
<script src="http://lilbtn.appspot.com/g/fb/fb.js" type="text/javascript"></script>
<script type="text/javascript">
lilbtn_g_fb_feedcount_render('http://feeds.feedburner.com/lilbtnBlog', 'lilbtn_g_fb_feedcount_1');
lilbtn_g_fb_feed_count_render('http://feeds.feedburner.com/makeYJL', 'lilbtn_g_fb_feedcount_2');
</script>
Localization

<span id="lilbtn_g_fb_feedcount_zh"></span>

<script src="http://www.google.com/jsapi" type="text/javascript"></script>
<script src="http://lilbtn.appspot.com/g/fb/fb.js" type="text/javascript"></script>
<script type="text/javascript">
lilbtn_g_fb_feed_render('http://feeds.feedburner.com/lilbtnBlog', 'lilbtn_g_fb_feedcount_zh', {readers: '讀者', subscribers: '讀者數',  hits: '閱覽數', reach: '點閱數', on: '於'});
</script>

Installation

The basic install is easy, you only need these:

<span id="lilbtn_g_fb_feedcount"></span>

<script src="http://www.google.com/jsapi" type="text/javascript"></script>
<script src="http://lilbtn.appspot.com/g/fb/fb.js" type="text/javascript"></script>
<script type="text/javascript">
lilbtn_g_fb_feedcount_render('http://feeds.feedburner.com/<feed_title>');
</script>

The first one is where the number should be put into, and lilbtn_g_fb_feedcount_render is the main function to do the work.

Customization

Loading Message

You can also give a nice loading message and link it to your feed like:

<span id="lilbtn_g_fb_text">Loading...</span>
Different container

By default, the feedcount chicklet goes to element whose ID is lilbtn_g_fb_feedcount, but you can change to whatever your like. You only need to supply to the render function.

<span id="my_container"></span>
<script type="text/javascript">
lilbtn_g_fb_feedcount_render('http://feeds.feedburner.com/<feed_title>', 'my_container');
</script>

Moreover, you don't have to use <span>, or <div> also work.

Localization

Localization section of Demonstration should explain all.

Style

After the render function render, it will assign the container a lilbtn_g_fb_feedcount class. The DOM looks like:

<span id="blah" class="lilbtn_g_fb_feedcount">
  <a class="lilbtn_g_fb_feedcount_link">
    <span class="lilbtn_g_fb_feedcount_outer">
      <span class="lilbtn_g_fb_feedcount_count">
      <span class="lilbtn_g_fb_feedcount_text">

The default CSS can be read at here.

You can have a round feedcount chicklet:

<span id="lilbtn_g_fb_feedcount_round"></span>

<script type="text/javascript">
lilbtn_g_fb_feedcount_render('http://feeds.feedburner.com/lilbtnBlog', 'lilbtn_g_fb_feedcount_round');
</script>

<style>
#lilbtn_g_fb_feedcount_round span {
-moz-border-radius:3px;
-webkit-border-radius:3px;
border-radius:3px;
}
</style>

[g-fb-text] Google FeedBurner Subscriber Count in Text

Metadata

  • Btn: g-fb-text
  • First Release: 2010-01-11
  • Code Last Updated:
  • Doc Last Updated:
  • Status: Experimental

Description

g-fb-text is for generating FeedBurner Subscribers Count in plain text, therefore it could be seamlessly embedded into your text on your website.

Demonstration

Move your mouse cursor over the number, you can get more detail.

Default

This blog has subscribers.

This blog has <span id="lilbtn_g_fb_text"></span> subscribers.

<script src="http://www.google.com/jsapi" type="text/javascript"></script>
<script src="http://lilbtn.appspot.com/g/fb/fb.js" type="text/javascript"></script>
<script type="text/javascript">
lilbtn_g_fb_text_render('http://feeds.feedburner.com/lilbtnBlog');
</script>
More Than One Subscribers Count

This blog has subscribers. Another blog has subscribers.

This blog has <span id="lilbtn_g_fb_text_1"></span> subscribers. Another blog has <span id="lilbtn_g_fb_text_2"></span> subscribers.

<script src="http://www.google.com/jsapi" type="text/javascript"></script>
<script src="http://lilbtn.appspot.com/g/fb/fb.js" type="text/javascript"></script>
<script type="text/javascript">
lilbtn_g_fb_text_render('http://feeds.feedburner.com/lilbtnBlog', 'lilbtn_g_fb_text_1');
lilbtn_g_fb_text_render('http://feeds.feedburner.com/makeYJL', 'lilbtn_g_fb_text_2');
</script>
Localization

本網誌有 位讀者。

本網誌有 <span id="lilbtn_g_fb_text_zh"></span> 位讀者。

<script src="http://www.google.com/jsapi" type="text/javascript"></script>
<script src="http://lilbtn.appspot.com/g/fb/fb.js" type="text/javascript"></script>
<script type="text/javascript">
lilbtn_g_fb_text_render('http://feeds.feedburner.com/lilbtnBlog', 'lilbtn_g_fb_text_zh', {subscribers: '讀者',  hits: '閱覽數', reach: '點閱數', on: '於'});
</script>

Installation

The basic install is easy, you only need these:

<span id="lilbtn_g_fb_text"></span>

<script src="http://www.google.com/jsapi" type="text/javascript"></script>
<script src="http://lilbtn.appspot.com/g/fb/fb.js" type="text/javascript"></script>
<script type="text/javascript">
lilbtn_g_fb_text_render('http://feeds.feedburner.com/<feed_title>');
</script>

The first one is where the number should be put into, and lilbtn_g_fb_text_render is the main function to do the work.

Customization

Loading Message

You can also give a nice loading message and link it to your feed like:

<a href="http://feeds.feedburner.com/<feed_title>"><span id="lilbtn_g_fb_text">Loading...</span></a>
Different container

By default, the number goes to element whose ID is lilbtn_g_fb_text, but you can change to whatever your like. You only need to supply to the render function.

<span id="my_container"></span>
<script type="text/javascript">
lilbtn_g_fb_text_render('http://feeds.feedburner.com/<feed_title>', 'my_container');
</script>

Moreover, you don't have to use <span>, <div>, or <a>, also work. Therefore, the customization in previous section can be just:

<a href="http://feeds.feedburner.com/<feed_title>" id="lilbtn_g_fb_text">Loading...</a>
Localization

Localization section of Demonstration should explain all.

Style

After the render function render, it will assign the container a lilbtn_g_fb_text class. It looks like:

<span id="blah" class="lilbtn_g_fb_text"></span>