WordPress: Add Random Content in Sidebar Widget

Need to add random content is sidebar! Do you have two kinds of content and want to display randomly to visitors? This can also be useful when you have two types of content and both are equally important but sidebar space is not allowing to add both kind of content.

The technique and code provided will work for any web page and not only for WordPress blog. This is also not a widget but I have written it just for fancy. Still I have not learnt about WP Plugin and Widget.

Here is the code I have used for two resources which is from outside of my web site. Outside contents are generally consumed using JavaScript code. So, these kind of widgets are easy to use in this way as when you have PHP code then that are cached by your WordPress cache application. Only one that was generated at the time of cache file creation will be displayed. So, for random content show on your blog you need JavaScript.

Here is a basic structure of the code useful for showing random content on sidebar:

<script type="text/javascript">
var hrs = new Date().getMinutes();
hrs += 1;
if ((hrs%2) == 0)
{
  // js code
}
else
{
 // Another js code
}
</script>

For getting random number, I have just used minutes. Added 1 to minutes to get number from 1 to 60, so that I can safely do operation on it.

<script type="text/javascript">
var hrs = new Date().getMinutes();
hrs += 1;
if ((hrs%2) == 0)
{
	google_ad_client = "pub-4441905138518539";
	/* 300x250, tech1/31/10 */
	google_ad_slot = "8422749194";
	google_ad_width = 300;
	google_ad_height = 250;
	//document.write(unescape('%3Cdiv style="color:#CC6600;" class="sideheader"%3EJobs%3C/div%3E'));
	document.write(unescape("%3Cscript src='http://pagead2.googlesyndication.com/pagead/show_ads.js' type='text/javascript'%3E%3C/script%3E"));
}
else
{
	document.write(unescape('%3Cdiv id="fb"%3E%3C/div%3E'));
	jQuery.get('http://localhost/fb.html', function(data) {
	 $('#fb').html(data);
	});
}
</script>

Now, if you ask why I have added the second code using Ajax then I cannot say anything right now. I have forgotten it at the time of writing. If I remember something special then I will write it in another post. (ok. got it! May be Facebook code was not supporting document.write()).
I hope, this may have given you good example of who to show random content in sidebar. This is a working example of showing content randomly on WordPress sidebar and it is visible on my sidebar (Jobs or Facebook Fan page).
Here is more on controlling display of content on sidebar.

Update 30-10-2010:
I think, I have used time for random so that at one time one text always get displayed and at another time 2nd text get displayed. I mean, if I use random number generation method then at page refresh there is a chance that same page come over again. But again what is a chance that user will refresh or reload at even time or odd time equally!
Anyway, using this method for random number generation can look clean:


// return a random int between 0 and 1
var i = Math.floor(Math.random()*2);
if (i == 0) {
     // js code
}
else {
     // Another js code
}
  • # 1 - by relax tone

    good ismail.too

Comments are open for an year period. Please, write here on Facebook page.