December 16, 2012

Display random labels on blogspot blog

Author: tec at 12/16/2012 05:14:00 pm Labels: , , ,
This Javascript snippet will retrieve random labels from a blogspot blog and display it in sidebar or anywhere else, useful if you've too many labels and only want show 'x' number of random labels on each page load.

Technology used:

Javascript, YQL, JSON feed

Usage:

- Configure and include the snippet and add label div to blog template/html.

View/Copy snippet:

Data hosted with ♥ by Pastebin.com - Download Raw - See Original
  1.     /**
  2.     * @author Manish Raj
  3.     * @website http://www.technoslab.in
  4.     */
  5.    
  6.     // Configure
  7.     var blog_url = 'www.technoslab.in'; // Just the host. Example. yourblog.blogspot.com
  8.     var max_labels = 50; // Maximum number of random labels to show.
  9.     var label_element = 'labels'; // id of the element where labels would be displayed. Example: <div id="labels"></div>
  10.    
  11.     function showLabels(){
  12.         var queryUrl = 'http://query.yahooapis.com/v1/public/yql?q=select%20feed.category%20from%20json%20where%20url%3D%22http%3A%2F%2F' + blog_url + '%2Ffeeds%2Fposts%2Fsummary%3Falt%3Djson%26max-results%3D0%22&format=json&callback=labelCb'
  13.         var script = document.createElement('script');
  14.         script.setAttribute('type', 'text/javascript');
  15.         script.setAttribute('src', queryUrl);
  16.         document.getElementsByTagName('body')[0].appendChild(script);
  17.     }
  18.    
  19.     // Label Callback
  20.     function labelCb(response){
  21.         var html = '';
  22.         if(response.query.count > 0){
  23.             response.query.results.json = response.query.results.json.shuffle();
  24.             for(var i = 0; i < response.query.count && i < max_labels; i++){
  25.                 html += '<a href="http://'+blog_url+'/search/label/'+response.query.results.json[i].feed.category.term+'">'+response.query.results.json[i].feed.category.term+'</a>, ';
  26.             }
  27.         }
  28.         document.getElementById(label_element).innerHTML = html;
  29.     }
  30.    
  31.     // From SO: http://stackoverflow.com/questions/6274339/how-can-i-shuffle-an-array-in-javascript
  32.     Array.prototype.shuffle = function () {
  33.     for (var i = this.length - 1; i > 0; i--) {
  34.         var j = Math.floor(Math.random() * (i + 1));
  35.         var tmp = this[i];
  36.         this[i] = this[j];
  37.         this[j] = tmp;
  38.     }
  39.         return this;
  40.     }
  41.    
  42.     // Load and show labels
  43.     window.onload = function(){
  44.         showLabels();
  45.     }


Or Download: http://pastebin.com/raw.php?i=PkZY87yV

2 comments:

  1. Anonymous29 December 2012 at 05:13

    Sweet blog! I found it while searching on Yahoo
    Νews. Do you have any suggestions on how to get listеd in Yahoo Νeωs?
    I've been trying for a while but I never seem to get there! Many thanks
    Look into my web page ; v2 cigs

    ReplyDelete
    Replies
    1. tec29 December 2012 at 23:24

      This is totally uncool man. Did I ever spam on your website?

      Delete

Subscribe to: Post Comments (Atom)