Introducing Chill Hammer 2.0

As of today, Chill Hammer has been renovated to become more than just a place to host my games. I still remember releasing Mal-Wars, my first big project, in 2012 but was having a hard time sharing the game with my friends. Passing around CDs can only bring you so far. Thus, I spent my spring break learning the basics of HTML and CSS and then Chill Hammer was born.

Even back then, my vision of Chill Hammer was very ambitious. Of course, my priority was just a place to have my all of the games I made, but I always wanted to have a blog. Back then my pride told me I had to create everything myself. I decided that with only my basic knowledge, I would create the site the exact way I wanted. I refrained from using any framework or content management system because it would feel like a cop-out and would my site less “personal”. Little did I know how hard it became to manage my site after creating a few games. It’s like trying to fight some scary dude with a stick, but then he kept calling his friends over and I refused to call mine because then I wouldn’t be winning by myself. But it’s such a naïve way of thinking because one is better off focusing what they enjoy to do and not what their pride tells them to do.

Chill Hammer 2.0 is simply the same website as before but with WordPress implementation and a new emphasis on content. WordPress is a Content Management System(CMS) which means that for once, I can spend less time managing the code of my site and more time writing content for my games. Just for comparison, this is the difference in content:

The transition of the game page
The transition of the game page

How I Did It

If you are just starting out with WordPress but don’t know where to start, here is what I did.

  1. Learn/study online
  2. Make rough draft and choose base theme
  3. Polish

Learn

For any web development learning needs, I highly recommend Team Tree House as 90% of my web development knowledge came from there. I watched about 6 hours-worth of videos including courses such as “How to make a website with WordPress” and “WordPress Theme Development”.

Rough Draft

Then what you want to do is create a rough draft. I sketched up key pages and how I want their design to look. For example, I drew the design of the cover page, the game information page, and a blog post page. After that, I went online for free themes and found a theme that is vaguely similar to the one I want. There was nothing exactly the way I want it, but that’s fine since I can modify a theme.

I used the theme “Forest” and then created a child theme. A child theme is basically the official way of adding changes to a pre-existing theme. If you want a quick tutorial on how to create a child theme, click here.

Polish

Finally, the last step and my personal favorite: Polish. In your child theme, add a style.css and start overwriting the styling that is in your current theme. Let’s say you don’t like a certain paragraph’s color; well then, just right-click the paragraph and click Inspect Element to find out its class/id and then edit your style.css file with the appropriate selector.

Whenever I face a problem that I feel like others probably have faced as well such as “hm.. I need graphs” or “how can someone email me using a contact form”, then there is probably a plugin for it. The first thing you should do before coding custom functionality is check if there is a plugin because it’ll save you a ton of time.

Time Breakdown

If you are wondering how long it takes one who knows nothing about WordPress to transition into a site like this, it took me about one month.

  • 1 week of learning
  • 0.5 of a week to getting it set up and choosing the base theme
  • 1.5 weeks of creating and writing all of the game pages up to Gunception
  • 1 week of polish and creating other pages such as Contact, Subscribe, and About

Of course, I’m in summer break at the moment, so I have a lot of free time on my hands. 😛

Conclusion

It took me 4 years to completely redo chilhammer.com into the version you see today. That means you won’t need 2020 vision to be foretelling Chill Hammer 3.0! Pun very much intended.

The transition of the home page
The transition of the home page

Leave a Reply

Your email address will not be published. Required fields are marked *