Fix Twitter URL/Hypertext Link on Modern-Clix


Modern-Clix is a great simple & clean WordPress theme, I had no doubt about the typeface and typography design of this theme created by Argentinean Rodrigo Galindez. This theme is one of my favorite theme and I use it as my blog theme, of course after I modified so it can be suit with my blog need. One that I’ve been modify is a twitter link that in default is the url/hypertext link inactive.

To make the hypertext active is simply adding some java script that call function parse url, username and hashtag on blogger.js which located at theme folder modernclix / js / blogger.js.

The default of modern-clix twitter java script is:

function twitterCallback2(obj) {
var twitters = obj;
var statusHTML = "";
var username = "";
for (var i=0; i<twitters.length; i++){
username = twitters[i].user.screen_name;
statusHTML += ('<p>&rsaquo; '+twitters[i].text+'</p>');
}
document.getElementById('twitter_update_list').innerHTML = statusHTML;
}

function relative_time(time_value) {
  var values = time_value.split(" ");
  time_value = values[1] + " " + values[2] + ", " + values[5] + " " + values[3];
  var parsed_date = Date.parse(time_value);
  var relative_to = (arguments.length > 1) ? arguments[1] : new Date();
  var delta = parseInt((relative_to.getTime() - parsed_date) / 1000);
  delta = delta + (relative_to.getTimezoneOffset() * 60);

  if (delta < 60) {
    return 'Less than a minute ago';
  } else if(delta < 120) {
    return 'About a minute ago';
  } else if(delta < (60*60)) {
    return (parseInt(delta / 60)).toString() + ' minutes ago';
  } else if(delta < (120*60)) {
    return 'About an hour ago';
  } else if(delta < (24*60*60)) {
    return 'About ' + (parseInt(delta / 3600)).toString() + ' hours ago';
  } else if(delta < (48*60*60)) {
    return 'One day ago';
  } else {
    return (parseInt(delta / 86400)).toString() + ' days ago';
  }
}

The change of modern-clix twitter java script is:

String.prototype.parseURL = function() {
return this.replace(/[A-Za-z]+://[A-Za-z0-9-_]+.[A-Za-z0-9-_:%&?/.=]+/g, function(url) {
return url.link(url);
});
};
 
String.prototype.parseUsername = function() {
return this.replace(/[@]+[A-Za-z0-9-_]+/g, function(u) {
var username = u.replace("@","")
return u.link("http://twitter.com/"+username);
});
};
 
String.prototype.parseHashtag = function() {
return this.replace(/[#]+[A-Za-z0-9-_]+/g, function(t) {
var tag = t.replace("#","%23")
return t.link("http://search.twitter.com/search?q="+tag);
});
};

function twitterCallback2(obj) {
var twitters = obj;
var statusHTML = "";
var username = "";
for (var i=0; i<twitters.length; i++){
username = twitters[i].user.screen_name;
statusHTML += ('<p>&rsaquo; '+twitters[i].text+'</p>');
}
document.getElementById('twitter_update_list').innerHTML = statusHTML.parseURL().parseUsername().parseHashtag();
}

function relative_time(time_value) {
  var values = time_value.split(" ");
  time_value = values[1] + " " + values[2] + ", " + values[5] + " " + values[3];
  var parsed_date = Date.parse(time_value);
  var relative_to = (arguments.length > 1) ? arguments[1] : new Date();
  var delta = parseInt((relative_to.getTime() - parsed_date) / 1000);
  delta = delta + (relative_to.getTimezoneOffset() * 60);

  if (delta < 60) {
    return 'Less than a minute ago';
  } else if(delta < 120) {
    return 'About a minute ago';
  } else if(delta < (60*60)) {
    return (parseInt(delta / 60)).toString() + ' minutes ago';
  } else if(delta < (120*60)) {
    return 'About an hour ago';
  } else if(delta < (24*60*60)) {
    return 'About ' + (parseInt(delta / 3600)).toString() + ' hours ago';
  } else if(delta < (48*60*60)) {
    return 'One day ago';
  } else {
    return (parseInt(delta / 86400)).toString() + ' days ago';
  }
}

As I mentioned above, the changed is only adding a function parse url, username and hashtag and edited the last part of function twitterCallback2(obj) into this:

document.getElementById('twitter_update_list').innerHTML =
statusHTML.parseURL().parseUsername().parseHashtag();

That’s all, you can download the complete java script at link at the bottom and simply replacing the old blogger.js.  🙂

Password : abdee.web.id

For your Twitter ID’s, put the code below in footer.php just before </body> tag.

<!-- Change username with your twitter ID's -->
<script type="text/javascript"
src="http://api.twitter.com/1/statuses/user_timeline/username.json?
callback=twitterCallback2&amp;count=4">
</script>

abdee

a husband & father who like to blogging, learn to code, wordpress enthusiasm, little bit twitter and facebook, winning eleven fan, eager to move forward for better knowledge.

Related Posts Plugin for WordPress, Blogger...