With Twitter and its 140 characters limit leading all the trends, URL shortening services are in extremely high demand. We have seen TinyURL in the past, now Bit.ly, Is.gd, Tr.im and dozens of others are joining the party to share the cake. Honestly saying, to me they’re all the same (except for ➡.ws for its cool name). With that being said however, it is interesting how they are doing it out there – what mechanism / algorithm / buzzword-here?

I curiously did some “research”es (well, another buzzword), and it seems in order to create the shorten URLs they are following the same steps:

1. Insert the original (long) URL into the database
2. Get the insert ID. If the URL already exists, take its row ID. Let’s say we got 123456.
3. Convert the ID 123456 into something even shorter, let’s say “am4k”
4. Make use of Apache’s mod_rewrite so that any request to http://host.com/am4k will reach http://host.com/redir_script.php?code=am4k instead.
5. In redir_script.php the value “am4k” is converted back into base10′s 123456 and the corresponding URL is queried back from database
6. If a URL is found, redirect the request to it.

It is simple enough… except for step 3 and 4. Which conversion is there, and how is the .htaccess written? Read more »

On May 12 I managed to release the latest major version of Referrer Detector. As it was a complete rewritten, bugs are not a doubt expected. Since then, there has been 5 newer versions:

• 4.0.1 – A hot fix to for allow_call_time_pass_reference problem. As for version 5, PHP passes function parameters by reference by default, thus eliminate the need of the prefix &. This shouldn’t be anything big, if it didn’t generate a warning with any attempt to use & and totally break my JavaScript’s eval().
• 4.0.2 – Some other hot fixes.
• 4.1.0 – “Related posts” feature implemented, and a tiny “Powered by Referrer Detector” line added into the welcome div. If you mind, both options can be turned off via Options panel – one-click. Also, the CSS was nearly completely changed.
• 4.1.0.1 – I accidentally (and stupidly) uploaded some 4.0.2 code in place of 4.1.0, and EVERYTHING was broken. This version is actually a quick roll-back, so the features were exactly the same with 4.0.2 – oops.
• 4.1.1 – This IS 4.1.0

So today I would like to announce the release of Referrer Detector 4.2.0.1 (code name: IE-PAIN). For this version we have another option on how to display the welcome box – in light box style. This is not a joke: I saw the light box in action in my dream, and started to implement it right when I woke up, basing on SimpleModal. Mendeleev‘s style, haha. Actually I’m not sure if this welcome style fits normal needs, but for advertisements it seems to. At least it has some cool effects. Read more »

Finally I’ve made it! Referrer Detector version 4.0 is now out! I decided to mark this as a major version increment because of these reasons:

1. The code has been COMPLETELY re-written from scratch. As of the previous versions, it was one big file that handled everything from admin to front-end control. Needless to say how inconvenient this approach had become when bug fixes and new features were added… too bad that I have decided to throw all away and build a brand new OOP Referrer Detector. Well, it was a looong and tough way, but I’ve never looked back!
2. The data are now in (ahem) database. I was thinking (and convincing myself) that a JavaScript file is faster, as it reduces the number of database requests. But with time, it becomes too bloat and too hard for me to track bugs as well as to add improvements. So I told myself: hell with this sacrifice, I better obey the power of MySQL.
3. The biggest new feature that I’m really excited of is the ability to add localized messages. In the past, your users were welcomed the the same (English) greetings regardless of which country they were from. Now you can specify a localized message for those from Vietnam, another for Brazilians, Portuguese, and so on. The plugin will try to detect users’ country and decide which message to show. Isn’t it cool?
4. The second new feature is the ability to backup and restore stuffs, including entries, excluded URLs, and options. For restoring, in order to keep the administration panel AJAX’ed, I go with Uploadify, a wonderful jQuery file upload plugin. This plugin uses a bit of Flash, but no worries, it will still works if your browser has no Flash player installed.
5. For the Stats panel, there were two problems that caused me much of headache. One is Google TLDs which are hundreds in number thus totally ruined the chart. The other is the chart itself: PHP/SWF Charts library is too darn heavy and often broke my SVN commits. So I wrote some code to group those annoying TLDs into one group, and use Google Chart instead.
6. In the admin panel, I added a “Support this plugin!” tab. Just a bit about myself, like “Follow me on Twitter”. Hope you aren’t pissed of with this change.

As usual, the plugin is downloadable at WordPress Codex. Your comments are always welcome here and in the plugin page. Let me know if you’re happy with the new version, or about the bugs you encounter!

Following the first snippet, here is another small one to shorten a link using Bit.ly. I chose Bit.ly over other link shortening services due to a simple reason: Twitter uses it as default (by now).

Code snippet #2 – Shorten Links Using Bit.ly

Purpose

Create a shortened URL using Bit.ly. This is extremely useful for your visitors, as they don’t have to look any further – just grab it to use right away.

Requirements

• A Bit.ly account (and API key). You can create one for free at their site in seconds. Once logged in, head to Account section and look for a long ugly string starting with “R_”.
• PHP 5 >= 5.2.0. Your host doesn’t support PHP 5? Claim your money back and find another host.

The Code

Read more »

Ok so I’m following some guy’s recommendation (sorry, I really forgot his name as well as his blog address) to try to post something useful even when I don’t have anything to blog about. How about a series of code snippets? To some they are old but to the others they may help – for example to myself two months later that is.

Read more »

Without a doubt, being a serious web guy you want your new site to look perfect on web browsers. Yes, mission would be simple – or sound simple – if there wasn’t something called browser wars for such a long time without any glorious winner (yet). The stupid result is, we poor web designers and programmers are still hopelessly struggling to keep our sites look the same on Internet Explorer (DIE PIG, DIE!!!), Firefox, Opera, Safari, just to find out that the oh so cool banner suddenly disappears from that new boy Chrome. FYI (psst) that was when I decided to stick with web that I started to learn cursing and swearing.

I am so proud to say that I decided to stop supporting IE 6 to save myself some precious life years and keep my head from getting bald long ago. But still, those guys in Microsoft they have IE 7 and 8 to haunt us. And despite of the so-called W3C standards, each of the remaining major browsers renders the pages differently here and there – margins, paddings, form elements, and so on. To deal with them, we use “hacks”. Perhaps the most well known hack is one below, called “conditional comments”:

<!--[if IE]>
Stuffs for Internet Explorer all versions
<![endif]-->
<!--[if IE 5]>
Stuffs for Internet Explorer 5
<![endif]-->
<!--[if IE 5.0]>
Stuffs for Internet Explorer 5.0
<![endif]-->
<!--[if IE 5.5]>
Stuffs for Internet Explorer 5.5
<![endif]-->
<!--[if IE 6]>
Stuffs for Internet Explorer 6
<![endif]-->
<!--[if IE 7]>
Stuffs for Internet Explorer 7
<![endif]-->
<!--[if IE 8]>
Stuffs for Internet Explorer 8
<![endif]-->
<!--[if gte IE 5]>
Stuffs for Internet Explorer 5 and up
<![endif]-->
<!--[if lt IE 6]>
Stuffs for Internet Explorer lower than 6
<![endif]-->
<!--[if lte IE 5.5]>
Stuffs for Internet Explorer lower or equal to 5.5
<![endif]-->
<!--[if gt IE 6]>
Stuffs for Internet Explorer greater than 6
<![endif]-->

When this technique is great, it has two limitations. First, only IE is taken into account. When most of the time dealing with IE takes the majority, there are still cases when your sites looks different on Firefox, Safari, Opera etc. Second, the HTML code looks very ugly and unprofessional – just like we are humbly telling: sorry this is beyond my control… I must use a hack here… and here… sorry again… Read more »

Yes, the stupid office work hour has been taken from me all the precious time and inspiration. Even the plan to redesign this site had to be abandoned. But I am still here.

I have too little time for a new technique to share with you, but have never forgot this blog of mine. If you care about it, I’m completely rewriting my most popular plugin Referrer Detector from scratch. After 3 major versions, its limitations are going clearer and clearer each day, most of which cannot be just fixed easily with the current code. So I’m rewriting it into a pure better OOP Referrer Detector, ready for extending and maintaining. Of course there will be some new and improved features too. I won’t promise on the release date though – I don’t want to be a liar again.

I wanted to say I much appreciate for all of your compliments, suggestions, bug reports, and encouragement these days. So I am still here, please stay tuned

It’s been quite a while I don’t have any update on this blog (sorry my *ten* RSS subscribers…). If there is any excuse, then it should be the fact that I’ve just left Gameloft to join a start up, and you know it, the work load is just a bit heavier than what I expected. To make my life somewhat more difficult, one day I realized that the current theme of this blog was just too messy and not so flexible, so I decided to redesign it somehow. Well, the new theme is under development now, and all I can promise is it will be much easier for the eye.

Ok cut the chit-chat, today I have this new thing to share.

Here is one line of the oh-so-familiar code:

<code>$("div.old").replaceWith($("div.new").clone()).appendTo(".trash").prepend("Deleted");</code>

If you got no idea what the line means, then let us be honest to each  other: How long have you been under the rock? Man, it’s jQuery! And the code I’ve just shown is a really simple stupid example about manipulation!

Now, once you know what it is and what it does, take a look at this:

<code>pq('div.old')-&gt;replaceWith(pq('div.new')-&gt;clone())-&gt;appendTo('.trash')-&gt;prepend('Deleted');</code>

You must have got it right: it’s PHP – OOP PHP 5 to be precise. But what was that with those jQuery stuffs in the middle, you ask?

Well, it’s phpQuery. And it’s what I’m about to introduce here and now. Read more »

6. Though my knowledge is very very very humble, I sometimes do tutorials (don’t laugh, what a shame :”>), for example, this and this which have been receiving a few of visitors from Google. In these tutorials, I posted some source code – HTML, XML, PHP, Javascript, CSS etc. In order for them to be clearer to read, I highlighted them. How? Did I have to color each and every span? Nope. WP-Syntax is the key. This Geshi supported plugin did everything for me. Install and activate it, then wrap the code block into a <pre></pre> pair with a specified lang attribute, there, it’s done.

7. Do you notice that out of the box, the comment boxes provided by WordPress look very simple (read: ugly)? I do. And I hate it, especially comparing with the much more functional reply boxes in those forums out there. So I looked for a way to add my comment boxes some extra power, and finally stopped at MCEComments, a plugin that integrates TinyMCE into a WordPress comment box, giving it a lot more features. I’m pretty sure there are some other plugins that share the same purpose, but I’m not that picky – since MCEComments perfectly worked for me from the beginning, I’ll stick with it.

8. Just like all other plugin developers, I have a development version of this blog, as described in one of my previous posts. That post mentioned that I used WP-DBManager to create a backup of my live database. Though in another post, I talked about the possible vulnerability this plugin’s users may encounter if by any chance don’t strictly follow the instructions, this plugin is still a must-have. Almost every database-related actions can be performed through it: you can optimize, repair, empty/drop tables, run specific SQL queries, and most important, set up an automatic schedule to back up your database. No matter how big your blog scale is, keeping backup(s) of your database is a must. For this reason, having WP-DBManager healthily activated is vital. Read more »

Just in case you don’t know – I’m pretty sure you do though – a WordPress-powered website is very limited in any terms without plugins. Or you can tell, a WordPress site that doesn’t use any plugin is just useless. Plugins bring your site uncountable and invaluable enhancements.

Well, enough of babbling. What I wanted to say is, today I’m going to write down here list of plugins I’m currently using on this site. For what, you ask? To show off, of course. Or – I prefer this – to share something that may be useful sometimes.

So in no particular order, here they come.

1. I use WordPress.com Stats to have a in-details view on my blog. Five or ten times a day, I click “Blog Stats” link in the admin panel to get an idea on the traffic, incoming/ongoing links, search terms etc. All these data are essential if I want to build up a high quality site.

2. To save a lot of clicks and keep the admin menu bar tidy, Ozh’ Admin Drop Down Menu is my plugin of choice. Agree, the new menu system in WordPress 2.7 is a good improvement, but it’s still nowhere near Ozh’s version. Write a new post, customize the theme, add a new plugin, change some settings… almost all the commands are now just one-click away from me. Huge productivity, I’d say. Read more »