tumblrBadge - a Tumblr badge script
I’m sure there are a few Tumblr fans out there, and if you are, naturally you’ll want a Tumblr badge to present it in your own web page?
The Tumblr badge
The Tumblr Badge offers you a way to present your text messages, photos, quotes, links and chat posts. It uses JSON to retrieve the information (with the help of the easy-to-use Tumblr API), and then transforms the JSON data into HTML and inserts into the web page.
The advantages of using my Tumblr badge script is that instead of having a document.write script which stalls the loading of the web page, this badge uses JSON and offers you a number of settings to customize your badge presentation.
Settings
There are a few basic settings for setting up the Tumblr badge:
- User name.
- Number of items to show.
- Id of the HTML element to add the generated HTML to.
- Width for images.
- Whether to use a short or a long publishing date.
- Time to wait before the JSON call is cancelled.
Example code
Here’s an example of the possible settings in the code:
// User settings
var settings = {
userName : "robertnyman", // Your Tumblr user name
itemsToShow : 10, // Number of Tumblr posts to retrieve
itemToAddBadgeTo : "tumblr-badge", // Id of HTML element to put badge code into
imageSize : 100, // Values can be 75, 100, 250, 400 or 500
shortPublishDate : true, // Whether the publishing date should be cut shorter
timeToWait : 2000 // Milliseconds, 1000 = 1 second
};
Download the Tumblr badge
If this sounds interesting, go ahead and download the Tumblr badge. Happy badging!
Update
I’ve put together a simple demo page of the tumblrBadge in action.


