Blog design 101: Creating your own Wordpress theme
January 27 2006
One of the most common questions I’m asked is for beginner’s help in creating a new Wordpress theme. There’s a few approaches you could take and I’ll list some of the advantages and disadvantages of each method.
- Adapt the default theme (Kubrick) - Great if you’re only wanting some basic changes, like putting in a new header. If that’s you, you should check out Kubrickr! I wouldn’t recommend adapting the Kubrickr theme if you’re wanting a completely different design. There’s a tonne of bits and pieces to sort through (e.g. some of the CSS code is in the header file, not in the stylesheet which can confuse beginners) and quite a bit of PHP code to figure out. Urban Giraffe has a tutorial on adapting the default theme to your own custom theme.
- Adapt another theme - Use something like the theme browser for something that’s similar in layout/content to what you’re after. Again, sometimes the code may be overly complex/simple for what you’re after. Working with someone else’s code can take time to get your head around.
- Create your own theme from scratch - The most flexible, if you know what you’re doing. Using the Wordpress theme documentation is a good place to start but it can be a little daunting for beginners. If you’re wanting to release your theme publically for others to download and use on their blogs, there’s extra things you’ll need to do as well.
Plenty of starting places.
Coming soon: While one theme certainly won’t be the starting place for all themes, over the next little while I’ll be creating a skeleton Wordpress theme which will be a nice easy place to start your theme’s design from.
In this series of posts, I’ll step you through I created the theme and show you how you can quickly adapt the theme to suit your own purposes.
your thoughts
Justin
when adapting another theme, what is a good rule of thumb to use so as not to completley steal the design but still use it for insperation?
Rachel C
Firstly, if it’s a freely available theme, check its copyright information - you’ll find most enable to you adapt as much or as little as you like.
If it’s a copyrighted theme and you’re not permitted to copy it at all, I would suggest only looking at the source code if you’re stuck and can’t figure out how they did their CSS etc. but then create the template from scratch yourself using your own code. Don’t take any of their images, create everything yourself. If it looks like a clone when you’re done, then that’s also not cool. If it looks a little bit similar like you were inspired by it (but not copying it), then that should be ok.
Aaron
Taking on the responsibility of creating a blog for yourself can be time consuming. So if you work full time, on a day in day out basis - they may not be the option for me.
However, hiring someone to create something fresh for you is.
Did you reply to my email Rachel? I completed the survey thing…
Rachel C
Hi Aaron,
I never got a reply back from you… not sure what happened there. Could you please resend?
Aaron
Sent.
Maybe you’ve my name has activated one of your mail filters, whereby it auto-deletes emails from Aaron Kirk…
Rachel
LOL no, but I do have a spam filter on my account - got it this time thanks.
Michael B
Great!. I took Urban Giraffe’s tutorial, and put together a“blank theme” ,that is, the style sheet with just the divs and classes left from it. But since then, as my own theming has grown, I’ve felt that as smart as some of the technique’s Michael used in Kubrick, it’s too much for a new user, especially one new to CSS. Thus, I’ve wanted to create a truly starter theme, that is heavily commented, with simplified divs and classes, so someone new to all of it can really see how it fits together, and cobbled their own look without too much difficulty. Perhaps your tutorial will save me the work :D, or if you’d like, as I recently commented on my blog, collaborate on one.
RetortaBlog » Blog - Como criar um tema para o Wordpress
[...] Blog - Como criar um tema para o Wordpress Tags [...]
Rachel
Oh that’s awesome Michael! You did exactly the type of thing I was planning on doing
I’ve d/l it and will see if I still need to make one up. I think I’ll still do the tutorial though - will keep you posted here.
Jörg
Thank you for a next beginner’s step again;)
{hyper.log - meine Welt als Wille und Vorstellung} » Blog Archive » wordpress geflickert
[...] [via cre8d design] Tags:blogdesign kubrick wordpress [...]
Michael B
It definitely needs work, I was just really learning my way around the templates. I’d really like to deconstruct the main templates and simplify them a little more, as well as comment them quite heavy for new users. I’ll keep my eyes peeled for updates.
Wordpress模æ?¿å¶ä½æç¨æ¶é at Shit Happens
[...] å½å¤: 1.blog design 101:creating your own wordpress theme å°±æ¯é£ä¸ªåblog设计ç7个è¶å¿çèå??ç½ç«åç [...]
Bill
I’ve found that the easiest way to make your own theam is to start with the Classic theme, not Kubrick. Classic is a very simple theme from the PHP perspective, and you can basically just replace the content in the header and footer files, tweak the CSS a little, and easily come up with a theme to match any look you want. This is especially good if you want it to match your existing Web site look and feel.
Successful Blog - Great Find: Create Your Own WordPress Theme
[...] Great Find: Blog design 101: Creating your own Wordpress theme by Rachel Cunliffe Type of Article: How-to on WordPress Theme design Permalink: http://cre8d-design.com/blog/2006/01/27/blog-design-101-creating-your-own-wordpress-theme/ Target Audience: Designers and the brave among others [...]
CodeProfessor » Create Your Own Wordpress Themes + Plugins
[...] Liz also has a link at Successful Blog to Cre8d-Design’s Blog Design 101 - Creating Your Own WordPress Theme. The latter post has some tips I(and links to other articles) on how you can adapt the default WordPress theme to your own design. [...]
retz
do u already hav the skeleton for the wp theme?
Jeff Guthrie
Did you create that skeleton wp them? I kept getting timeouts on Miklb’s site…
Thanks!