Porting WordPress Themes
It is written with the following assumptions:
- You have a rudimentary knowledge
of xhtml / CSS / php - You have a working knowledge of
BlockLayout. - You have a working knowledge of
Browser Technology (IE, how to view source, etc).
Please note, not all WordPress themes are released under the GPL or compatible licenses. Do the OpenSource and Xaraya community a favor and follow the license provided. The tricks included in this tutorial can be applied to basically any Blog or CMS application available, as I have opted for a very easy method.
Getting Started
I spent some time evaluating WordPress themes and trying to do a one to one match of the functions. I found the exercise extremely tedious as the theme system between WordPress and Xaraya are completely different. WordPress mixes presentation with logic in the form of PHP within their themes. For someone familiar with the Xaraya theme system, we know that this is not the easiest paradigm to overcome.
The steps following should help you on the way to getting the themes ported over. It's just common sense once you read this tutorial, but I may leave you scratching your head. Feel free to post on the Xaraya message boards with any questions that you have. I'll do my best to answer.
Step 1 – Download and Install
This may seem like a simple step, but I found it was much easier to install WordPress on my local machine. It's a very good blog system for those that have not used it, and installs similar to Xaraya. The downside of WordPress is that it is simply a blog and lacks the power and extensibility of Xaraya itself.
That said, the theming concepts are similar. There is an area within WordPress Admin called “Presentation”. Once you have downloaded the theme that you intend to port, simply install it to your blog and go back to the main page.
Step 2 – Cheat
I tried to map the functions between WordPress and Xaraya's BlockLayout on a one by one method, but got frustrated in the process. I had grand schemes of writing an import utility to automatically write a theme from a WordPress theme, but quickly gave up. Instead I do something in the gambling world called C H E A T I N G. I view the source. It's that simple.
Step 3 – Move Images and CSS
I copy the images and the CSS files over to my newly registered Xaraya theme name. From there, it is smooth sailing. Most WordPress themes have slightly different image paths. The first thing I do with the CSS is do a search and replace on the paths in the CSS files.
IE:
url('images/background.jpg')
becomes:
url(../images/background.jpg)
The difference is, the CSS file in the WordPress theme is in the root folder, while in Xaraya it is in the styles directory. We just need to compensate for the difference.
I also take time to do a very simple trick with the Xaraya required styles:
@import url(xaraya.php);
I move the important Xaraya styles to a separate style sheet for ease on the next port that I do. Also you may notice the .php versus .CSS extension on the file. I have recently begun to gzip all of my CSS for further portability in the future. It also speeds Xaraya up just a bit, which is always a nice side effect. From there, it is smooth sailing.
Step 4 – Making the Theme
Once again, I cheat on this as well. I take the source that I viewed earlier and begin to cut it up to different files. I just hold those until I am ready. What I am looking for is three separate areas. Header / Footer, Blocks, Module space. I basically have three files that are not saved, but rather waiting for me to work on them.
Then it just gets easy. If you grab one of the themes that I have ported already, you could use that as a template. Most of the themes have a similar syntax for the xhtml, and a similar structure. All you need to do from this point out is make the HTML dynamic through the BlockLayout structure. Add your module space in the correct place. Add your blocks in the correct place (note, most WordPress themes are two columns, so you may want to add both the left and right blocks on the side that is appropriate).
Finally, you will probably want to override the applicable Articles Module templates. These are just the module space file that you set aside for this point. You also may want to override whatever other module at this time as well. For instance, most WordPress theme have a different comments version. Up to you, I prefer our threaded version.
Moral of the Story
It ain't hard to do at all. The time to port a theme is approximately one hour. It takes less time to port one than it does to write a tutorial on the subject. Once again, pose questions on the Xaraya message boards. If you can't do one yourself, I'll port a theme from WordPress for a very small fee (around $40) depending on scope, but I would much rather teach you to fish, than to give you a fish.
Enjoy!