Azharkamar.com

Azhar Kamar is a graphic designer, web developer and lecturer from Singapore who tells stories about web design, coding and all that jazz. He loves milk, pizzas, honey and all things sweet.

Latest Articles
14 May 10

New Design and Features for Wikipedia.org

My previous post was about Google changing their logo design and the look and feel of their search pages. And right now, I’ve noticed that Wikipedia has changed theirs too! Read more

7 May 10

New Google Logo Color and Search Page Design

I was searching for game reviews when I kinda noticed something different about Google’s logo, search buttons and text colors. I ignored them at first, thinking my eyes were playing tricks on me and anyway, it was like already 2 o’clock in the morning. Read more

3 May 10

BumpTop Acquired by Google – Google Acquisitions

BumpTop has been acquired by Google with effect from yesterday, 2nd May 2010. Google is having so much fun acquiring companies. BumpTop is a Canadian company which Google Inc. acquired for US$30 million. Google plans to integrate BumpTop to their upcoming Operating System, Google Chrome OS, which is to be released in late 2010.

What on Earth is BumpTop?

It’s an interesting 3D desktop environment. BumpTop is designed to improve normal computer desktop design by imitating the behaviour of a real-world desk. And just yesterday, Google bought over the company and BumpTop will no longer be available for sale and support.

They are letting people download BumpTop for the last chance here – http://bumptop.com/download. The download page will be there for only a week, which will end on the 7th of May 2010. So if you’re interested, go grab your copy now!

BumpTop Desktop Environment

Here’s a screenshot of the BumpTop Desktop Environment:
BumpTop BetaBumpTop on a Windows Vista

» Download BumpTop

References

[1] Wikipedia – http://en.wikipedia.org/wiki/BumpTop
[2] BumpTop – http://www.bumptop.com
[3] Mashable – http://mashable.com/2010/05/02/google-bumptop

22 Apr 10

The Gaming Industry – Playstation 3 Console Price

Do you know how much the retail price was for a Playstation 3 console in 2004? US$450. That was the retail price. And the cost for producing one console? US$800. So, that means they were losing money. For 3 years. Because only in 2007 then they managed to reduce the production cost to US$400 per console.

That’s something uncool about the gaming industry.

But well, Sony is damn rich anyway, so it doesn’t make much difference to them. Hehe.

21 Apr 10

Domain Redirection – How to Make a 301 Redirect in cPanel

Domain redirections are common for many reasons for example, when your website has shifted to another domain, your company name has changed therefore registering a new domain name, or having many domains for 1 same website and you want all domains to point to this main domain.

So one simple way is to configure a domain redirect (301 Redirect) is via the cPanel function, Redirect. It’s fast and easy. No PHP codings, no .htaccess file modifications. The version I’m using is cPanel X (WHM Accelerated 2).

Configure 301 Redirection in cPanel

1. Login into your cPanel account of your domain (http://your-domain:2082).
2. Under the Domains group, find the icon named Redirects.
3. Under Type, select Permanent (301).
4. Under the **All Public Domains** drop down list, select your domain name.
5. Enter the URL you want to redirect to in the ‘redirects to’ textfield. Enter it in full e.g. http://azharkamar.com
6. Select the radio button Redirect with or without www.
7. Make sure the Wild Card Redirect check box isn’t checked.
8. Now click ‘Add’ and you’re done!

You should now test your domain redirection and see if it works. If it doesn’t redirect as it should, you might want to wait a while and try again.

16 Apr 10

How to Create Your Very Own WordPress Theme

Creating a wordpress theme is quite simple; well actually it’s more about editing a ready-made wordpress theme. I think that most WordPress themes were not created from scratch, but edited from the Default or Classic theme, or any other existing theme available. If you come to think of it, it would be quite troublesome to create a theme from scratch when all you can do is edit and customize an existing one that suits you best, and then call it your own. :-D

Creating a New Theme from the Default Theme

Here’s how you create your own WordPress theme from another WordPress theme. I recommend using Fifty Fifth Street or the Default WordPress theme as these themes have a clean layout and standard PHP and CSS files and codes. Both these themes use a 2-column layout so if you want a different layout, you’ve got to look for another theme.

Ok so here are the steps you should take:
1. Download the default folder (/wp-content/themes/default) to your computer using your favourite FTP client (e.g. FileZilla)
2. Now rename that default folder you have just downloaded to any name you wish (e.g. mememe)
3. Open style.css and change the current theme description (the text at the beginning of the file within the /* */ comment tags) to your own preference. Refer below for guidelines.

/*
Theme Name: your-theme-name (Mememe)
Theme URI: the-theme's-homepage (http://mememe.com)
Description: a-brief-description (A cool and colourful theme for everyone!)
Author: your-name (Johnny Mememe)
Author URI: your-URI (http://www.johnnymememe.com)
[optional] Version: a-number (1.0)
[optional] Tags: describe-your-theme (2-columns, fixed-width, 8 colours)
*/

4. I recommend begin editing the theme files later once everything is working fine. So for now, don’t touch anything else.
5. Upload style.css back into the mememe folder in the server.
6. Now login to your WordPress Admin panel and click Themes. You should see the new theme you’ve just created! Hmmm but the thumbnail shows that of the Default theme? That’s because you didn’t change the screenshot image file. You can upload a screenshot of your completed theme later.
7. Now click Activate and you’re done! You may now customize your very own WordPress theme!

If you really have to confirm that you’re using your new theme, check the source codes of a web page in your site and look for your theme name:

<link rel="stylesheet" href="http://mememe.com/
wp-content/themes/mememe/style.css" type="text/css"
media="screen" />

References

You may refer to the WordPress Codex http://codex.wordpress.org/Theme_Development to learn more.

13 Apr 10

Buy Cool Tee Shirts Online from Threadless – Cheap and Awesome!

“New graphic t-shirts released weekly. Awesome new designs submitted and rated by the Threadless community.”

If you have never heard about Threadless, I strongly suggest you go there right now and check out their super cool graphic t-shirt designs. Haha!
Threadless
Click here to visit Threadless.com.

Threadless is the coolest ever online t-shirt store! The Threadless.com website really has this hip factor – attractive graphics and user-friendly functions and features. It’s so simple to get a tee of your preference; you can sort by the t-shirt colour, price, size, category, collection and awesomeness.[adsense1]

And, I’ve just received my Threadless tee this morning. It’s called ‘Kill Monotony’ by Ankel Dika. I ordered that tee about 3 weeks ago via normal shipping and woke up this morning with the sweet package by my bed. Wrapped inside was the tee, together with a few Threadless stickers.

The First Threadless Tee, and More To Come

During the time of purchase, there was the USD10 offer, so the whole thing (including shipping) cost me around SGD18. And that’s considered very cheap; and very good! The t-shirt is of great quality, and bears an exclusive and expensive design (all Threadless designers are paid USD2500 for their graphic designs!). I hope to submit my very own design to Threadless someday… Haha!

Azhar Kamar with Kill Monotony by Ankel Dika - Threadless

Ok, here’s a photo of me wearing the ‘Kill Monotony’ tee shirt design by Ankel Dika (an awesome designer dude). I submitted this picture to Threadless in hope they select it to be displayed in their gallery and, they approved it within a day and put it up in the gallery. Click here to view it (if it’s not there, it would be at the Kill Monotony gallery).

So what in the world are you waiting for, visit Threadless now!

12 Apr 10

How to Display a List of Random Post Titles in WordPress

A list of random post titles! Yeah, sometimes displaying random posts in your WordPress blog might be good. There’s a few tutorials lurking out there in the web but some aren’t really quite comprehensive and straight forward. So, I’ll do the best I can here. Read more

8 Apr 10

Make Money from Online Surveys – Valued Opinions Singapore

I came across ValuedOpinions.sg a few months ago and after trying it out, I found that it is a genuine service and one of the best of its kind on the internet. ValuedOpinions.sg (a subsidiary of Research Now Ltd from United Kingdom) provides a service where you get paid for doing surveys that they send to you via email. How it works is, market researchers from around the world pay them for collecting valuable opinions of the people who are likely to be customers of their products and services. So, ValuedOpinions.sg simply gives a share of the money to us, the users who do the surveys! It works similarly to any other affiliate marketing system.

How to do the surveys and get paid

Once you have registered at their website, they will begin sending surveys to you via email. The email looks something like this:

Hi John Lim,
We have a new survey available for you to take.
If you qualify and complete the survey you will receive S$ 2.75.

Survey topic: Office Supplies
Reward for qualifying and completion: S$ 2.75
Survey length: 20 minutes
Available until: Friday 23rd of April, or until we reach our target number
of completed interviews.

Please note, the survey is hosted by one of our partners NWC Research and
may look a little different from our usual surveys. You will not be asked for
any personally identifiable information during the survey.

Please click here to start the survey.

Once you complete the survey, the money will be then be credited into your account!

How and when can you get your money

[adsense1]For each survey you complete, you will receive money which will be credited to your account within 28 days. The value of the rewards varies per survey and will be stated in the email invitation. Once your account reaches S$20, then you will be able to redeem your reward in the form of a gift certificate. Well, that’s the disadvantage of their rewarding format. At first I thought I would receive cash, but after reading through their FAQ, I realized that they reward us by giving vouchers instead. The voucher sponsors include Cold Storage, Giant, Starbucks, Guardian and 7-Eleven.

Well at least I find it a reliable source of income, although a bit slow and little, it only takes a few minutes of your time to complete a survey. Most surveys I have done rewards me with at least S$2. So after around 10 surveys then I’ll be able to get my voucher.

I’ve tried other kind of paid online surveys services but most are either giving too little cash or are scams. So this is the only one I would recommend. Good luck!

30 Mar 10

How to Make Simple 3D Buttons Using Only CSS and HTML

Here’s a very simple tutorial on how to make a button using just CSS and HTML.

Well what exactly is a button (in terms of computing)? A button is defined as an element in the graphical user interface (GUI) which provides the user a way to trigger an event like querying in a search engine or submitting a contact form. A typical button is a rectangle or rounded rectangle with text in it usually describing the use or function of the button. And that’s exactly what I’m going to create using CSS and HTML.

Nowadays most buttons you see online are some sort 3D as this enhances the user interface design and also captures the user’s attention, hence also making a 3D button more user-friendly than a flat 2D button.

Note: If you’re not using Mozilla Firefox, Chrome, Safari or Konqueror, you won’t see any text shadows or rounded corners.

Now, look at these 2 buttons:

Button Good and Button Bad

Now which one looks more appealing to you? The first one right. Why? Because it has the 3D effect! And rounded corners too. And shadows. No graphics involved, just plain CSS. The CSS properties that are responsible for the sweet 3D look are text-shadow, -moz-border-radius, -webkit-border and border.

Here’s how you create that button (without using a CSS stylesheet):

<span style = "padding: 5px 20px; font-weight: bold; background: #0079ce;
color: #fff; -moz-border-radius: 20px; -webkit-border: 20px;
text-shadow: #00487a 0px -1px 0px; border-bottom: 1px solid #333;
border-right: 1px solid #333; letter-spacing: 1px">Button Good</span>

So if you integrate it with a link, it would be like:

<a href = "/index.php"><span style = "padding: 5px 20px; font-weight: bold;
background: #0079ce; color:#fff; -moz-border-radius: 20px; -webkit-border:
20px; text-shadow: #00487a 0px -1px 0px; border-bottom: 1px solid #333;
border-right: 1px solid #333; letter-spacing: 1px">Button Good</span></a>

And here’s how you should do it (using a CSS stylesheet):

.myBtn a {
     padding: 5px 20px;
     font-weight: bold;
     background: #0079ce;
     color: #fff;
     -moz-border-radius: 20px; /* for rounded corners in Firefox */
     -webkit-border: 20px; /* for rounded corners in Safari */
     text-shadow: #00487a 0px -1px 0px; /* for the 'engraved text' effect */
     border-bottom: 1px solid #333;
     border-right:1px solid #333;
     letter-spacing: 1px
}

[adsense]And that’s it! Simple.

However, only Firefox, Chrome, Safari, Opera, Konqueror and iCab browsers support the text-shadow CSS property.

And for the rounded corners, current compatible browsers are Firefox, Chrome and Safari.

Both CSS properties aren’t supported by Internet Explorer…

Why, IE why? Aren’t you guys doing something to keep up with the world? Microsoft, what are you guys doing?! Haha! Anyway… it doesn’t really matter. Mozilla Firefox will conquer the Internet! ;-)