Random Post Link Addon for Blogger

Purpose

This script creates a text link to a random post on your Blogger blog. It displays the random post's title as well as a brief random message to accompany it.

This is an updated version that replaces my former version of the code. The major changes between this updated version and the current version are:

• The addon no longer requires the Archive Widget to be added to your page.
• The code is no longer limited to displaying posts from the past three months. It can now give you links to posts from your blog's entire history.

You can see the code in action at the top of the post area at Quirky Jessi. Just refresh the page a few times to see a variety of random links to posts I've written in the past.

How it Works

For those of you who are technically inclined, you may be interested in how the code works. The key operation of the random post link script is fundamentally tied to JSON (JavaScript Object Notation).

Fortunately, Blogger is JSON enabled, meaning that it can generate Javascript in an object format that allows it to pass Javascript widgets a list of the post titles and links on the blog.

After the hard part of receiving and parsing the links is over with all it takes is a simple random number function:

function random_number(range)
{
  return (Math.round(Math.random()*200000)%range);
}

A random post title is selected, and printed using the document.getElementById().innerHTML functionality.

Adding this Feature to your Blogger Blog

1. Enter Layout Mode
2. Find the area where you want the link to appear and click Add a Gadget.
3. Select the HTML/Javascript gadget.
4. Paste the following code into the gadget:
   

<div id="output_div" style="font-size: 11pt;">
</div><br/>

<script>
/* <!-- <[CDATA[ */

var introArray = new Array(
"Have you read ^?",
"Check out ^?",
"Check out a post from the archives: ^",
"I picked out an old post just for you: ^",
"Would you like to read ^?",
"A previous post: ^?",
"You might enjoy reading ^.",
"Check out this post from the past ^."
)

function random_number(range)
{
return (Math.round(Math.random()*200000)%range);
}

function random_post(json)
{
var number_of_posts = json.feed.entry.length;
var random_range = number_of_posts;
var selected_post_number = random_number(random_range);
var post_title = json.feed.entry[selected_post_number].title.$t;
var post_link = ""

for (var k = 0; k < json.feed.entry[selected_post_number].link.length; k++)
{
if (json.feed.entry[selected_post_number].link[k].rel == 'alternate')
{
post_link = json.feed.entry[selected_post_number].link[k].href;
break;
}
}

var saved_link_html = "<a href='"+post_link+"'>"+post_title+"</a>";

var output_string = introArray[random_number(introArray.length)];

output_string = output_string.replace("^",saved_link_html);
document.getElementById("output_div").innerHTML=output_string;


}

/* ]]> --> */

</script>


5. Now save the layout and switch to the tab Edit HTML.
6. Scroll down to the very end of the XML template and find the </body>
7. Just above that statement paste the following code:
   

   &lt;script src="/feeds/posts/summary?alt=json-in-script&amp;callback=random_post&amp;max-results=99999" type="text/javascript"&gt;&lt;/script&gt;

8. Save the template and view your blog. The random link should appear where you put the HTML/Javascript Gadget.
   

Removing the Experiment Garden Advertisment

You may notice that about one out of every ten random links is not to a blog post but back to Experiment Garden. I would appreciate it if you left this, as it shows appreciation for the time and effort that I went to to create this script. However, you may not like the effect. There are two options you might want to take.

First, you can make the advertisement appear less often by simply adding more of your own custom messages to the list of random messages.

Find the section of code:

var introArray = new Array(
"Have you read ^?",

"Check out ^.",
"Look at ^.",
"Just for you: ^",
"Please look at ^.",
"Would you like to read ^?",
"You might enjoy reading ^.",

"Do you want to read ^?",
"Please read ^.",
"Random link powered by <a href='http://experimentgarden.blogspot.com/'>Experiment Garden</a>"
)

To add another message just copy one of the lines in the middle, and paste it again in the middle. If you want to customize the message, just keep in mine that the caret "^" is where the random link is inserted.

If you want to remove the link back to Experiment Garden completely, just remove the last message in the list. After you remove this message, be sure to remove the comma at the end of the new last message. If you remove the link back to Experiment Garden then please add another link somewhere. Perhaps add me to your blogroll, or else write a post about the addon with a link to this page.

Limiting Number of Posts Used

Another customization that you may want to do is limiting the number of posts that the script can choose from. As it is the script will display links to any of your posts up to the 99999th post. You may want to limit it to the last 100-200 posts for several reasons. For one thing your oldest posts might be out of date, or their writing quality might not be as good as your new posts. But another reason why you might want to reduce the number of posts is load time. Loading a list of all the posts you have ever written on the blog can be time intensive for older blogs. So to reduce the number of posts that the script will choose from find the number 99999 in the code that you added to the XML template and change it to a smaller number. For example, the number 100 will limit the results to the last 100 posts that you have written.

I sincerely hope that this Blogger addon can be of help to you. If you encounter any issues please let me know by commenting here, and I will do my best to get back to you as soon as possible.