A few weeks ago I got the idea of creating a “starter theme” to work from when I’m beginning to port an HTML template to WordPress. After I’ve finished the mock-ups in XHTML and CSS, it’s always the same process: copy the style.css to the theme folder, chop up the HTML into various PHP files, tweak some stuff, and ship off the theme. During that process I often find myself going back to the default theme for various tags, formats, and templates.
I’ve spent a few weeks toying with this “starter kit” to make it help my development workflow as much as possible. Now I’m releasing this kit to the public, untouched, for you to download. This is what I use when I begin creating a WordPress theme after the HTML-ing is done.
Please download the files and try it out. There’s a full comments.php file, a functions.php file with the widget code already there, and many other files containing the code I use most, such as the loop and other template tags.
After you’ve used it, I’d appreciate it if you came back and left your feedback in the comments. What you like, what you don’t like, what you’d change, and what you’d add. Then I’ll take the feedback, modify the kit, and release a new version. My goal is to ultimately create the best “starter theme” possible and have a system that anyone can use to quickly port an HTML layout to WordPress.
Later on, I think it’d be neat to make this some sort of a hands-on tutorial. Instead of writing one huge tutorial telling you how to create a theme, I want to experiment and provide something beginners can download and use to learn the ins and outs of creating a theme. Each file would be fully commented, explain what each area does, and provide some helpful tags to help you get started.
Here are some of the features of my starter theme:
- Blank style.css with theme name, author, URL, etc. tags at the top
- Content-ready 404, archive, search, index, single post, and page files
- Full, working comments.php file
- Complete header.php set up with links to RSS, a stylesheet, and JS file; template
- Default search form template
- Blank screenshot.png file and images folder
Please download this theme and try it out, then come back here and let me know what you think. This empty template has certainly sped up my theme development workflow, and I hope it’ll do the same for you.
Dan, this is great – thanks for sharing!
Incredible idea! I’m just really getting into theme modding and this should be an awesome resource. I will be making a new theme soon and will try this out. I’ll let you know if I have success, thanks again!
Hi guys,
congratulations for the release! I’ve checked it and I liked what I see so far. I wonder what’s the reasoning for having a fully-working comment area but not fully working wp loop that actually display contents?
@Hafix the comments area doesn’t really work much more than the loop does. I have a few template tags in comments.php because those are different from what’s used in the loop.
The loops work, there just isn’t anything inside of them. I leave it empty so it’s easy to copy and paste HTML inside.
Pingback: WPCandy’s Starter Theme Project :: WPLover
Dan,
Thanks so much for doing this. I have been wanting to start building themes and your idea about having the code commented with instructions is terrific.
People like you are what makes the WordPress community the amazing group it is.
Thanks!
Blake
Pingback: WP Foundations // Premium & Free WordPress themes for designers » Big News #1: WordPress Starter Theme Project
Dan, is it? Good idea, with the starter theme. I’m a fan of Sandbox, from plaintxt.org. Check it out if you are interested in WordPress workflow.
And feel free to contact me, either at my site or my email. I’m sure we would have a lot to talk about.
Hey, great idea!
I just subscribed to your RSS feed a couple of days ago. Looks like my timing was just about perfect.
I look forward to watching this project develop.
There is always the Starkers theme – http://elliotjaystocks.com/blog/archive/2008/free-starkers-wordpress-theme/
I have wanted to try and modify my own theme and this seems a great way to start
I’ve seen a few other theme “frameworks” out there, and they’re all great. This isn’t a framework, and it’s not intended to work as a theme right out of the box. Rather, it’s a basic template that I can paste right into without worrying about typing out the loop and standard header.php information every time I create a theme.
I’ve looked at other theme frameworks and they’re full of real, working loops using every template tag out there, a full CSS stylesheet, and an actual page structure. I’d spend 10 minutes just deleting all of that and replacing it with my own HTML and CSS. With this theme kit, I can just start from scratch.
So really, the purpose of this project is to take my empty base theme and turn it into a working beginners tutorial. That means adding template tags, comments, and instructions to the theme while still keeping it clean and simple.
So yeah, download the theme and try it out, and thanks to everyone that’s done that so far. The next step is to think about how it can be improved and what can be done to turn this theme into a teaching tool for beginners.
-dan
Excellent! I blogged about this on my site, my readers will love this.
loving this kit! already using it, thanks alot!
Pingback: Excellent WordPress Starter Theme | blackleafmedia
Very nice. I’ll have to download it and play around a little.
Pingback: Una plantilla vacía para WordPress | ..: CRISTIAN ESLAVA | Diseño Gráfico / Web | Maquetación | Flash | Multimedia | 3D | Fotografía :..
Pingback: Daily Links
This is a great idea.
I was just about to create a new wordpress theme and with this it will be even easier.
Every time I active the theme it breaks the admin.
@Bruce I don’t get any problems. Try adding styles to the stylesheet. Remember, it’s an empty theme, not an out-of-the-box usable theme.
@Dan I added styles to the stylesheet and the theme works fine but when I use this theme it causes the admin to work incorrectly. Links don’t work right and changing themes doesn’t work properly.
Thanks for this! I’ve been trying to design my own theme for a couple of weeks now but hitting road blocks. I successfully finished it off last night using your starter theme as the foundation.
Pingback: Useful Links #9 | GrantPalin.com
Pingback: 50 Must-Read Resources For Incredible Web Design
Thanks very much for this. It’s a big time saver.
Great job on this, Dan.
Pingback: Wordpress Basics for Newbies | Revellian Dot Com
Thanks.
A little error: there shouldn’t be any empty lines outside of <?php tags in the functions.php file. This causes the RSS feed to not validate and has been really frustrating me today.
Pingback: Blank Themes, Frameworks and Templates: Resources to Speed Up Your Development Time | DesignM.ag
Pingback: WordPress Starter Theme Update — WPCandy — WordPress Themes, Plugins, Tips, and Tricks
Pingback: 블로그코디 » Blog Archive » Blank WordPress Themes
Amazingly useful… I was actually thinking how great something like this would be only a few days ago. Cheers! ¶
This is great, thanks for sharing!
iLL Give it a try. Hasn’t anyone heard of wpthemerkit ???? It is how I finally learned how to make themes.
Pingback: Recent Links: August 17 to August 24 » Alex Jones
Hey Dan! Great idea. I was wondering if you have to keep updating this every time a new WordPress update comes out. I’m not sure how WordPress updates affect themes. Is there somewhere to check? Any ideas?
Pingback: 5 Ways to Design your Own Wordpress Theme | Internet Marketing | Rice Blogger
Hi there, I found you searching for a blank theme. I saw the css starter frameworks, but I think I’m like you – I like designing my own css & html, it is really the wordpress tags that I end up spending so much time on. And then I also end up getting behind on the versions of wordpress too. So as new things are added – photoblogs and galleries for one – it would be great to keep this project up to date. As I’m sure you will do for your own projects…
Question – Is it imperative to create themes that work out – of – the- box? And if so, how do you get the galleries and sliding content, and fancy features everywhere? ie: a magazine theme with excerpts on the front – linked to a photo. I wrote this code for myself, but it is complicated and I don’t understand it all, and I’m sure it will be obsolete soon. So do you have an indepth knowledge of php or do you use plugins? Or???
thanks for any help you can offer!
@Cathy I know some basic PHP from working with WordPress and the CodeIgniter framework so I write my own plugins from time to time. Usually, there’s something out there to accomplish what I need to do.
Pingback: WordPress Developer’s Toolbox | Developer's Toolbox | Smashing Magazine
hay! Dan Its a Great idea. swift start to theme any HTML R u going to release any updated version ?.
Pingback: WP开发者资源-2.4: WordPress空白主题 | 帕兰映像
Pingback: WordPress Developer’s Toolbox | rafdesign
Pingback: Automating My WordPress Workflow — WPCandy — WordPress Themes, Plugins, Tips, and Tricks
More goodies from the team. Thanks!
Pingback: 9 Starter Wordpress Themes | Most Inspired Blog
Pingback: WordPress Websites » Automating My WordPress Workflow
Pingback: 9款适合新手开发的WordPress主题 | 帕兰映像
Pingback: 9 plantillas de partida para desarrollar temas de WordPress | Stralunato
Pingback: 9 plantillas WordPress para iniciar · DotPress
Pingback: What’s new in Wordpress land – Bridge Vision Web Ministries | You have the vision, we build the bridge.
Pingback: NvD.esign magazine » The Big Wordpress Resources List
Pingback: Wordpress Araçları - İngilizce | indirazzi.com BETA
This was exactly what I was looking for — all of the template files and their basic structure/loops/etc, but nothing else so that I can build what I want without worrying about the WordPress specifics.
I know you’re trying to keep it style-free, but WordPress has some default CSS that it sort of expects. You may want to consider including that. http://codex.wordpress.org/CSS
I plan on keeping a copy of this locally, with some of the CSS set up the way I like to use it so that I’m ready to go on any new Theme development. Thank you very much for providing for this tool.
Pingback: WordPress 开发者工具箱2 | Ruijin Ubuntu Blog 生活中的每一点点滴滴......
Pingback: WordPress 开发者工具箱 | 易宝
Pingback: 互联网的那点事… » blog archive » [译稿]WordPress 开发者工具箱
Pingback: WordPress 开发者工具箱 - 天涯博客
Pingback: Blank Templates για “καθαρό” Ξεκίνημα | Webz
Pingback: WordPress 开发者工具箱（下） at 老虎机
Pingback: WordPress Developer’s Toolbox | Fusuy.com || Webmaster Accessary Platform
Pingback: cssframework » WordPress 开发者工具箱【完整版】
Pingback: Wordpress Theme Frameworks - MadeBySash
Thanks a million. I understand the concepts of doing all sorts of things in WordPress, but getting something that worked out of the gate that didn’t have anything I needed to get rid of before modifying is awesome.
Thanks!
Pingback: 给WordPress主题作者的主题 » 老N的博客
Pingback: WordPress主题制作新手起步包 | 网贝
Pingback: Wordpress Starter Themes
Pingback: 5 template “in bianco” per Wordpress | Napolux.com
Pingback: Blank wordpress templates for development | Design strike
Pingback: Wordpress Theme Frameworks, SandBox fué solo el principio | aNieto2K
Pingback: Wordpress Theme Frameworks, SandBox fué solo el principio : Blogografia
Pingback: 15 Amazing Wordpress Theme Frameworks | Architecture & Web Art
Pingback: Wordpress Theme Frameworks | Ajuda Wordpress em Português
Thank you so much, very nice
Pingback: WP-Frameworks
Pingback: High Quality WordPress Theme Frameworks | PimpMyWordPress
Pingback: WordPress Frameworks
Pingback: 10 Resources & Tutorials For 1st Time Wordpress Bloggers « Tom Toner
Hi Dan,
I’m currently working on a make-over of my website using your starter theme as a basis. I noticed searchform.php was misspelled (searhform) in the 404.php file which caused an error.
I also noticed that there is some whitespace in the functions.php that caused a crash in the admin area every time I updated a post. Don’t know this is just in my copy or that more people have had this problem?
Apart from these two minor errors I really like the idea of this starter theme. I’ll try to give you some more feedback in the near future so it can be made even better
Pingback: Colección de frameworks para WordPress - VitaminaWEB.com
Hi,
Startertheme sometimes breaks admin interface, this theme seems to be designed for older WP versions so have you tested this with 2.8+ versions?
I’m using the latest 2.8.4 and it occasionally breaks the admin interface, when I rename the folder (forcefully deactivate the theme) the admin interface comes back. This is very strange problem as it doesn’t seem to break the theme all the time :/
Maybe it is just MAMP which I’m using to run the development version of WP on my computer.
Any compatibility issues with latest wordpress? 2.8.4?
Pingback: Wordpress Theme：几个主题框架推荐 | selfcares
Love this theme template! A quick note for those who might be having issues, open the functions.php file and find the two lines at the bottom commented out. I’ve personally just deleted them to get my theme to work correctly, but you can also move the commented code between the to the 9th line in the code, right after the if() statement and before the first ?>
Hope that helps!
Pingback: Wordpress Theme Development Frameworks « Smashing Magazine
Using your kit. Thank you so much! I have been thinking whether I’d switch to WordPress or Blogger. I wanted Blogger because of the freedom of code. With your tool, I think I decided to switch to WP. Thank you so much! x
BTW, on the topmost of the layout there appears the URL of the directory wherein the theme has been uploaded. I can’t find the code that placed it there, do you know what’s wrong?
thank you!
Pingback: Theme Frameworks & Child Themes
This is really cool, it saved me a lot of time! Thanks for publishing it.
Flippin awesome. I always thought about doing this. Such a time savor! Thanks.
Pingback: 9 Starter Themes to Create Your Custom Themes. | Focus After
Pingback: Speed up Theme Development With Blank Frameworks
Hey dude, you got a typo in index.php
“include(TEMPLATEPATH.’/searhform.php’);” should be searchform.php yeah?
Pingback: Diseña tu theme de WordPress desde cero « Geeksfera
Was about to do one for myself and found this — brilliant. Thank you.
Pingback: Wordpress主题框架 | 伟景博客－膜技术|水处理|节能减排|循环经济|Wordpress|留学生活
I’m going to be using this for a new website and let you know what I think of it. I currently use the default theme in WordPress and then modify it. Thanks a ton for making this public!
Pingback: My outrageously minimalist new website
Pingback: Interview With Brad Potter
Now this is what I am talking about… I always seem to take an old theme of mine and delete all of the custom shit.
THANK YOU!
This is an awesome idea. Unfortunately, it’s a bit out of date and there are errors – e.g. include(TEMPLATEPATH.’/searhform.php’);
is misspelled, and should also be this function instead:
get_search_form();
Maybe you should post a warning at the top of the page or update it?
I’d love to see an update though
Thanks a lot! i need this!
Pingback: 5 temas en “blanco” para Wordpress | Esgeek
Pingback: 10个免费的Wordpress框架 « Booto'Blog
Pingback: Top 10 Free WordPress Frameworks for Designers « qeqnes | Designing. jQuery, Ajax, PHP, MySQL and Templates
Pingback: Top 10 Free WordPress Frameworks for Designers | XtremelySocial.com
Pingback: 11 useful free sandbox WordPress themes
Pingback: 10 Blank / Naked Wordpress Themes Untuk Development
Pingback: ftwork » WordPress 开发者工具箱（下） -
A very fresh and attractive wordpress theme, I would say.
Pingback: 7 Blank Wordpress Themes for Developpers and Designers « Shaimifch
Pingback: 10 Blank/Naked Wordpress Themes Perfect for Development | Anythingown blog
Pingback: Best practices for WordPress coding
Pingback: Modelo de Tema para o WordPress | Genius Developer
Pingback: Modelo de Tema para WordPress | Genius Developer
Dan – Dude, you should really put this on Github for everyone to fork, hack, and improve. Would make it super awesome to “crowdsource” (god, I hate that word) the work on it. If you like the changes then you merge whoever’s fork into your master repo.
Pingback: Theme básico para crear Themes de WordPress
Pingback: Theme básico para crear Themes de WordPress - Vaya Huevos
Pingback: Plantilla básica para confección de temas Wordpress | CMSTECNO
Pingback: 8 Basis WordPress-Themes für Theme-Programmierer | Elmastudio
Pingback: Theme Frameworks
Pingback: Wordpress Development Frameworks | heysiddy.com
Hi,
Is there an update to this? I just tried it and it doesn’t work with the latest WordPress.
Regards,
TopWpskins
Pingback: Geek is a Lift-Style. »Archive » Wordpress Theme Development Frameworks
Does this project support the latest release of WordPress 3.0?
I didn’t know PHP very well, but this was simple to use. Thanks!
Pingback: Framework for Wordpress Theme Development | AddaZ ...::: Share Latest Things :::...
Pingback: Best practices for WordPress coding | Faredigitale
Wonderful! I was about to make one of these myself, and yours is just right. Thanks for that.
Just what i need..
thanks for sharing
The download link is not working. 404 error
Link dead and gone… anything related available or is it simply DOA?
Hey. Do you know the link to the download is broken now?
Hey everyone, just a quick comment to let you know the link has been fixed, so you can download the file if you’d like!
Sorry for the downtime!
Going to play around with this tonight with a little site I’m working on, see how it goes.
Great stuff mate. It will be very helpfull and time saving
Worked like a charm. Great job! Tnx.
This speeds up the development time a ton. I love it because it only includes what you need and that’s it. All I have to do is write a few lines of code, import my HTML and I’m done. This will definitely help me meet faster deadlines and speed up my workflow. Awesome work, thanks alot!
Great job ! Thanks
Years later.. thank you for this theme. The concept is enough for any of us to start with a clean slate. I’ve built in a little Blueprint CSS and now I have a parent theme with a blank canvas I can use. (Had to adjust to WP3.0, just the little things).
Thanks again.
I’m thinking of converting the Wales Legislation Online site to WP, so I downloaded the latest verson of WP, then the startertheme. I tried installing the starter theme a couple of times, but after activating it, I just kept getting this error message:
Cheers
Peter
Just guessing here that this theme hasn’t been updated since 2008? (when the article it was posted.)
I also ran into the same problem, so I’ll have a look at this and see if I can fix the issues.
edit:
To fix that error, its very easy. Just open: C:\xampp\htdocs\wordpress\wp-content\themes\startertheme\functions.php
and remove line 10 (the blank line) so that there are not blank lines.
After trying several WordPress framework themes I used Starkers until I found this one. It is exactly what I needed, just a plain clean theme to start developing complex themes upon it.
The problem with Starkers is that it has so much unnecessary code that I end up wasting more time cleaning than developing.
With Starter theme I can develop my own complex loops and make them precisely optimised for the theme I am building as well as avoiding unnecessary calls to WP functions.
Great asset to keep in the library, thanks for your great work!
Suggestion: I think the permalink could be remove from the single.php file. I mean, you need it in the index or blog list view, but once you’re IN THE POST, the permalink in the title is useless
Excellent job, BTW!
OK, this is a great framework especially for beginners!!! Thanks for sharing mate!
I love the template. Is there a user community for this? Does anyone mind if I start one? lol.
This is really excellent. I’m new to wordpress (after nearly a decade of using MovableType). I wonder… since this theme is from early 2010, is there anything missing in terms of core features for wordpress 3.3?
Sweet starter theme! Thanks.
Pingback: HTML & CSS Blog Layout – Theme Implementation for WordPress - Speckyboy Design Magazine
I have downloaded the zip file. I don’t know how to try it out and view it. I got an error like this.
Fatal error: Call to undefined function get_header() in C:\wamp\www\startertheme\startertheme\index.php on line 1
what are the steps to be followed after downloading the zip folder and extracting it
It is a wordpress theme.
You need to install wordpress first and then put the theme in the wp-content\themes folder
http://codex.wordpress.org/Using_Themes
Thank you so much!
Hi,
This is completely random question so please indulge me…what is the name of the calendar plugin used at the right hand side of the sidebar?
Hey alex,
I’m pretty sure that’s just the default calendar that comes with wordpress with a bit of CSS styling added. (Dashboard > Appearance > Widgets > Calendar)
Great article, Dan. Although an older post, still useful!