Once Upon a Theme

When this blog was created for the first time, I used free themes available on any sites. As time goes by, I want this blog to have some personal touch. So I learned to create my own WordPress theme. I created some themes and install it on this blog. Some people said it was good, but I personally thought that my themes didn’t have a good cross-browsers compatibility (although it worked on modern browsers).

Once again, I want to create personal theme for this blog. Creating theme from scratch is a pain. I must consider a lot of things, like cross-browsers compatibility, new features from WordPress updates, the upcoming HTML standards, and many many more. I decided to look for a WordPress theme frameworks.

Quick googling shows some great WordPress theme frameworks. They have many different interesting features. After I read and tried some of these themes, my eyes are fixed to these theme: Gantry Framework. This theme framework is created by Rocket Theme team for WordPress and Joomla publishing platform. This theme is easy to install, configure, and customize. Besides from that, here are some features of Gantry that I like best.

  • based on 960 grid system, make it flexible to create layout anything you want.
  • widget-based layout, you can put some things in widget and place it anywhere you want.
  • separation between Gantry framework and theme, you could update the framework without breaking your theme design.
  • home-page-post customization, you can create different layout of every page, post, category, etc.
  • it’s free, well it’s good :D

Another great thing about Gantry (and the other theme frameworks), we could customize our design incrementally. Just like what I did with this blog. For now, I used default Gantry style and just customize the header and page background. I have a plan to customize the style further if I have the chance.

I didn’t say that the other frameworks is bad. It was just Gantry get the job done for me. Whether Gantry works for you or not is depends on your needs. You must try and find your own framework that works for you. In the end, happy customizing your theme.. :D

Have You Tried It on IE6?

About a year ago, I created a blog aggregator, or sometimes also called Planet. This planet display all the blog posts from my registered friends. At first, I did it alone. I maintained and designed it by myself. And then, my friend Andreas wanna help me maintaining the site. So I gave him a role as administrator. Some days ago, he sent me this email:

Rif,

Do you have opened the website in IE6? The layout and the design looks screwed :(

IE6 or Internet Explorer version 6 is a browser shipped with Windows XP. It was released in 2001. It has better CSS support than the previous version, at that time. The problem with the browser is it’s lacking support on the web standard. If you’re a web designer, you must know the designing problems in IE6 . This browser has bad reputation among web designers. Continue reading

Blorange: a New Theme

Hi..

Couple days back, I’ve got some inspirations for my blog design. So today, I created this theme: Blorange. Unlike the usual, I used some images for email, rss feeds, and search button. I played with some colors: variation of black and orange.

So, how do u think? Any suggestions?

Simple Widget Styling

Do you ever using widget in your blog?
Sometimes when I added widget in my blog, the position was aligned left. Can we make it a little bit in the center?
In this writing, I tried to apply some simple styling to modify your widget. Are you ready?

First of all, you must choose a widget to enroll. In this writing, I used widget from Dilbert (I’m the big fan of it). This was the code given by them.
<object type="application/x-shockwave-flash" data="http://widgets.dilbert.com/o/478bf96b7bf0b5a2/494cffca172eaa7d/478cddf3fcd52701/8a2fafd6/-cpid/71bc012ffa85d617" id="W478bf96b7bf0b5a2494cffca172eaa7d" width="160" height="300"><param name="movie" value="http://widgets.dilbert.com/o/478bf96b7bf0b5a2/494cffca172eaa7d/478cddf3fcd52701/8a2fafd6/-cpid/71bc012ffa85d617" /><param name="wmode" value="transparent" /><param name="allowNetworking" value="all" /><param name="allowScriptAccess" value="always" /></object>

As usual, you could just copy and paste the code to the Text Widget on your wordpress control panel. After saving the changes you made, go and see to the homepage and see the widget. It will looks like this.

Before
Before

Now, trying to add some styling codes on your Dilbert’s Text Widget. I’ll try to make the position into the center. The codes are like these:
<div style:"text-align:center;">
<object type="application/x-shockwave-flash" data="http://widgets.dilbert.com/o/478bf96b7bf0b5a2/494cffca172eaa7d/478cddf3fcd52701/8a2fafd6/-cpid/71bc012ffa85d617" id="W478bf96b7bf0b5a2494cffca172eaa7d" width="160" height="300"><param name="movie" value="http://widgets.dilbert.com/o/478bf96b7bf0b5a2/494cffca172eaa7d/478cddf3fcd52701/8a2fafd6/-cpid/71bc012ffa85d617" /><param name="wmode" value="transparent" /><param name="allowNetworking" value="all" /><param name="allowScriptAccess" value="always" /></object>
</div>

Save the changes and refresh the homepage. The widget will be centered just like this.

After
After

Now, you can try another styling widget on your own. If you find something interesting on the process, don’t mind to tell me about it. Happy trying!!