Just a year ago, about this same time of the year, I designed and coded my very first own WordPress theme to be used with this blog. That was my first ever WordPress theme developed from scratch. It was a big learning experience for me, figuring out how to code the new design into a fully working WordPress theme.

To be able to create your own WordPress theme, you have to be familiar with at least three types of codes: XHTML, CSS, and PHP. I had quite a firm grasp already on the first two, but I know little of PHP, just enough to get me started. Back then, I was unfamiliar with how the WordPress theme works, so I spent a lot of time reading tutorials on the web, learning how to do it as I go along. Back then, it was quite a big learning experience for me.

And now, after a year, I coded my fourth WordPress theme, the khairul-syahir.com-v3. It was a big learning experience back then, and it’s still a big learning experience now.

The Related Posts and Social Sharing feature has been integrated fully with the new khairul-syahir.com-v3

The design

khairul-syahir.com-v2 implements a lot of features that WordPress offers, but with the advent of WordPress 3.0 just released a few weeks ago, coding khairul-syahir.com-v3 becomes a challenge as I tried to implement the new features introduced in WordPress 3.0. Apart from that, the design for the new theme calls for a lot of programming, most of which I wasn’t familiar with. My knowledge of PHP (the programming language used to create WordPress) is still marginal, so I spent a lot of time this time around reading tutorials in the web in how to implement the features that the new design requires. When I coded my first theme, the main challenge was that I was unfamiliar with the coding. This time around, the main challenge was getting my head around doing and implementing the more advanced stuffs.

The (now old) khairul-syahir.com v2

khairul-syahir.com-v3 is designed by Shaza Hakim, the Creative Lead at Stampede Design, who on a Friday morning May 30th just sent me an email that goes something like, “Don, can I design your website?

The new features

The design includes many custom sidebar items (sidebar is the vertical column of side-content on the right-hand side of this website) that were a pain to code. I could take the easy way and just hard-code all the items, but that would mean it’s difficult for me to change anything later. So I took the hard way and coded them as widgets, which will allow me to change their settings and rearrange them through the WordPress admin page, without touching the codes at all.

The comment reply form is moved directly underneath the comment you're replying to, allowing for easier and in-context comment reply.

KSv3 includes new features such as captioned image, tight multilingual integration (yes, this blog is multilingual. More on this later), deeper comment threading (8 levels deep) which will allow you to reply to more of other people’s comments, slicker and tighter Social Sharing and Related Posts feature, as well as larger content area for better reading and viewing contents.

The comment feature has also been improved. When you click on the reply link to reply to any of the existing comments, the comment writing form will be moved to directly below the comment you are replying to, so that you can keep an eye on the comment while writing your reply.

Another hugely improved feature of the KSv3 over KSv2 is that CSS sprites is used whenever possible. For the technical people, that means a lot less HTTP requests each time any page is viewed. JavaScript and CSS files (and you know WordPress and plugins really spit out a truckload of them) are combined and minified, and then gzipped on the fly before they got sent down the pipe to the browsers. For the non-technical people, all that means is faster access, and a heck load reduced page loading time.

Tight integration

Just as tight clothes make a guy drool, so does tight integration of features make a website appears elegant and you just well don’t want to take your eyes off it. Tight integration means that everything in a website has its own designated place, and not just generically placed there. One example of this is the language switcher. KSv2 uses the default generic language switcher that comes with the plugin that makes multilingual website with WordPress possible. KSv3 discards the generic language switcher and coded its own.

Browser compatibility

I have checked and verified that this website will look and function the way it is meant to look and function if it is viewed using Mozilla Firefox, Google Chrome, Internet Explorer 7, and Internet Explorer 8. I have decided to abandon Internet Explorer 6 altogether, as it will just add to the frustration tremendously, and I personally think it’s not worth it. So if you’re among the 9% or so people who are still using IE6, upgrade to better and more modern browsers like Mozilla Firefox now.

This website uses a little bit of CSS3, a new coding standard which is partially supported by browsers such as Mozilla Firefox and Google Chrome, so this website will look a tad bit better if viewed using those browsers. Internet Explorer 7 and 8 do not support CSS3 at all.

Multilingual blog

The language switchers have been fully customised and integrated into the theme

This blog is written in English, but at some point recently I decided to start translating some content into Bahasa Melayu, my native language. I have several motivations for this, but I would not detail them here. Whenever a blog post has a translation, you’ll see a link to switch to the other language just below the post’s title to the right. As of now, there’s not many posts that have been translated yet, so viewing this website in Bahasa Melayu would make it look messy a bit. Translating is a terribly tedious and time-consuming process (and yes I do wish I have a personal translator), so it might take some time before many of the contents will be translated.

Final words

I’ve left this blog with no new content for quite a while, and the reason for this is that I’ve been terribly busy with other stuffs. Coding for the new theme has been enjoyable and a good learning experience for me, and I’ve relieved myself from some big time-eater so that I can do the things that I truly enjoy doing, like posting meaningful discussions on this blog. With the new theme already in place, you can expect new stuffs coming in soon!

As for the mean time, have a look around at the new blog and let me know what you think! As this is a new theme, I would expect that there’s a few bugs that slipped past me during development, so if you notice any of them, let me know as well :).