Grow your CSS skills. Land your dream job.

WordPress: Creating Themes from scratch vs Using Starter Themes…

  • # March 12, 2013 at 2:09 am

    I have a war going on in my head about creating themes from scratch vs using Starter Themes. Is there still value in creating themes from scratch or should I be moving towards learning how to use Starter Themes? Honestly, I’m having trouble grasping the idea of using a Starter Theme only to find myself struggling to understand all the components (template files, css libraries, etc…). Do I scrap the files that I don’t need and just use what I think is usable? I feel like there are more benefits if I use my own strategies of developing a theme rather than try and find code or css that I can use.

    I understand that the answer might not be a simple yes or no but I think I’m missing something about the value of Starter Themes.

    What’s your experience with Starter Themes? How do you use them efficiently?

    # March 12, 2013 at 4:36 am

    On my most recent site redesign, I coded a theme from scratch just for the hell of it.

    What I learned was that even though everything is built completely to my specifications, there were a few features I would’ve liked to have that, surprisingly, aren’t included with WordPress by default.

    The main benefit to coding a theme from scratch is that you can write all your HTML/CSS beforehand and convert it to a theme later on (which is the only workflow I’m comfortable with). With starter themes, their HTML is law—you can edit the CSS all you want, but you’re sort of restricted when it comes to document structure, class names, etc.

    I think it would be a good idea to develop your own “starter theme” that you can use for future projects. Just have a basic structure, a functions.php with some functions that you find yourself using across different sites, and a stylesheet with a simple grid system and other general styles that could come in handy.

    Stuff like this can save a lot of time in the long run. I just wouldn’t really feel comfortable adapting my CSS to someone else’s HTML, so I’ll keep on awkwardly splicing together my own themes using my limited knowledge of PHP :)

    # March 12, 2013 at 11:07 am

    How you use a starter theme is largely dependent on where you believe the “starting point” actually is with theme development.

    Most of the options out there come with wonderful documentation and prefab utility styles, libraries and classes for you to use, but this can often times feel like you have to “learn the language” of the theme before you can actually get started.

    My recommendation would be to pick one of the starter themes you feel most closely resembles your absolute base of functionality and style, and hack it up where necessary to create your own customized starter theme.

    Hate bootstrap, but love foundation? You can do that. Page / tag / class structure of the author making about zero sense to you? Reorder and redefine where necessary. Really like that sweet shortcode / filter functionality you developed for xyz theme a few months ago? Port that in if it’s something you find yourself using regularly.

    The only word of caution I’d give is try not to over do it. It’s pretty easy to get carried away with adding all the bells n’ whistles. Do you really need support for three different responsive sliders ? Is Isotope something you’re going to use on EVERY project? etc.

    PS(Isotope is totally rad)

    Personally, I’ve been working with a modified version of Bones.

    # March 12, 2013 at 9:46 pm

    Ha. This is actually exactly where I am at. I have been doing my own custom themes for about 8 months now but still wonder if I am just better of re-styling another theme. I ended up creating my own boilerplate for WP and have a bunch of snippets that I will use through the different projects saved in a text file for use.

    Through everything, my biggest question was if I should use something like Genesis as a base, then implement my boilerplate so I have some of the back end stuff I wouldn’t normally get. But then again there are a lot of plugins that can do that for me. Mainly SEO and extra security.

    # March 13, 2013 at 1:32 am

    I guess it was the idea of the term “Starter Theme” that caused my dilemma. It got me excited at first but then it sort of threw me off when I came across the structuring of their template files, css libraries… it just didn’t work with my design and it made me question myself.. was I missing the whole point of a starter theme? Not that I’m blaming them but mostly because from a designer-pov, I’ve somehow already structured the content in my head and re-structuring it just so that it complies with their templates just didn’t fly for me.

    Nonetheless, you’ve all made very good points. Good to know that there’s still value in creating themes from scratch. From what you guys are saying, both still seem to have benefits and obviously, reuse and recycle is where its at.

    Bones seem to offer some pretty good stuff so I guess I’ll scavenge what I can and create my own Starter theme..

    mcjohnst, thanks for the tip… Isotope rocks!

    # March 13, 2013 at 1:19 pm

    I used [UnderscoreS](http://underscores.me/ “underscores.me”) recently and found it great. Built my templates in the usual style first and then merged them with Underscores. It’s a nice starter/barebones theme. Pretty sure it’s developed by the WordPress guys

    # March 13, 2013 at 1:35 pm

    I also have used UnderScores for a recent project and thought it worked well. I still had to strip a bunch of stuff out, but overall I liked what it offered.

    # March 28, 2013 at 1:08 pm

    I’m in the process right now of making a WordPress starter theme of my own. I’ve had the same problem others mention: when moving from some combination of design mockups and HTML/CSS prototypes into WordPress theming, it seems like too much overhead to understand, undo, and restructure what’s in the starter theme.

    My process has been to take the first WP theme I coded from scratch a few years ago, and cannibalize it for the next theme. The process has been fairly chaotic, so I end up digging through the last few iterations in order to get some function or snippet I’m looking for. That’s what’s brought me to cleaning things up and rolling my own starter theme.

    I agree with putting a premium on keeping things as lightweight as possible. I was using Bootstrap, which is great for a lot of things, but I found I was repeatedly just using it for a modal dialog and grid. So instead in my starter theme I have an ultra lightweight modal dialog plugin and my favorite CSS grid, and that’s it.

    It’s whatever works for the individual, of course. But personally I see a HUGE inherent value in having maximum understanding of all the code in your theme. The less there that’s a mystery or half-understood, the better. It’s peace of mind for you and I think it also translates into speed when developing.

    Basically, I think it’s best to have a starter theme, yes, but one of your own making as much as possible.

    # March 28, 2013 at 4:46 pm

    I agree with most of the above. I think creating your own starter theme is a great way to go.

    I started using a theme someone had created from Zurb’s Foundation 2 a few years ago and have added a removed a lot from it in the process as I have discovered the sort of things I reuse in most projects.

    I know most of the advice is to keep things light, and while my initial markup is light and my initial css is vanilla, my theme is stacked full of page-templates and jQuery plugins because personally I find it easier to know they are there and ready to go.

    Once the development is completed I go through and remove anything that isn’t being used.

    It helps that I make a lot of sites for people in the one industry so found that I would often need a photo gallery and music player, so it grew from realising I was re coding the same pages in every theme.

    A great time saver for me.

Viewing 9 posts - 1 through 9 (of 9 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".