DobsonDev Underscores
September 11, 2015



DobsonDev-Underscores

In my previous article I mentioned the DobsonDev Underscores project I’ve been working on. I also mentioned that I wasn’t quite done yet but luckily this is no longer the case. For those of you who already have an idea about what I’m talking about and don’t need to read anymore – you can visit the GitHub page to download the project. The project will basically allow you to rapidly build starting template themes for WordPress. It’s kind of hard to explain succinctly so keep reading for more information!

This project is comprised of two main parts. First there is the modified version of Underscores which I’ve hooked Foundation into. Just like with Underscores, this modified theme is meant for hacking so don’t use it as a Parent Theme or anything like that. I’ve made a number of other changes to the theme which includes thing like more widgets for the footer and foundation elements being already incorporated into the HTML in the templates.

The theme folder that is included in the project is used by the shell scripts (those are the second part of the project) to create copies of the theme but with relevant information filled in, such as theme name, theme slug and theme folder name. There is a script for Linux and a script for OS X because of minor differences in using the sed command.

This theme and the accompanying scripts are meant to be used to allow people who work with WordPress all the time a way to create a starting point for their own theme development. The idea is they will download this project and modify the theme that’s bundled with it to their liking so they have the starting point they want. Once that’s done they can rapidly reproduce this starting point for multiple projects easily.

Installation

Installing the project is pretty simple. What I like to do is keep the project in my Development folder and then make an alias it from there. This way if I want to change anything (and many of you might want to change the template theme to suit your specific needs) it’s really simple to do. To make an alias for the shells script I add the following line to my .bash_profile file:

Be sure to change the path to where ever it is that you’re keeping the project. Also please note that if you’re rocking the Linux then you should switch the file to the Linux version of the shell script. The usage of sed changes a bit from OS X to Linux so that’s why there are two different versions. Also if any of you are wondering I have a post about customizing your terminal that contains my entire .bash_profile. Check it out!

Normally you could also install a script by adding it to your /usr/local/bin but in this case since it requires the _s-original folder and there are two versions of the script, I really feel the alias is the easiest way to go. This also let’s you easily modify anything you need by having it a very accessible folder.

Once you have the installation step done you’ll be good to go. The next thing to do is run the actual installer script.

Running the Script

Running the script (assuming you did the above step) is as simple as typing either whatever you set your alias as. Once you run the script it will ask you for:

  • name of the theme
  • theme folder name
  • theme slug name

Each of these translates to something pretty self explanatory – but there are some things worth noting. The theme name can be whatever but I wouldn’t include odd characters if I was you – this could cause an error (things like quotes, ampersands, etc…). The folder name has to be a valid folder name on whatever OS you’re running. I usually put ‘-‘ rather than spaces as well. Finally the theme slug has to be a valid PHP function name. I would highly recommend going with ‘_’ between words for this one.

Once you’ve answered the questions the script will create your theme for you. The way this works is that the script will create a copy of the original theme bundled with it (my version of Underscores with Foundation) with the folder name you specify, then change the theme name and slugs in all the files from the default to the one you have specified. Once that’s done the theme will move the theme folder to the directory you’re currently working in.

As if that wasn’t enough – it will also change the ownership to be the same as the directory you’re currently working in. This means that if you have your WordPress installation working on your server and you run this script from within /wp-content/themes/ then it will properly change the ownership all on it’s own.

As you can probably tell the scenario above is how the script is really meant to be run. The best possible case you can have is installing this on your server/development environment and creating the themes easily from there. If you do it this way then you have to run the script once and you’ll have a working theme.

Conclusion

Creating this script and theme was a lot of fun and has also already started to save me a lot of development time when creating new websites for clients. I use this as my base for pretty much every website I do now – and rather than going to Underscores and downloading it from there and then hooking in Foundation this gives me everything in one place and deploys it immediately.

If you like using this please share it around! Also note that with the current version the author stuff is just set to my information. When you download the script just switch the author information to yourself in the original theme. Also this script could be tested way more – so if any of you find any problems or have any features you want added then take advantage of the open source! Fork my repository and then create a pull request for patches. Together we can make this thing awesome I’m sure!

As always thank you for reading and please share it around as much as you can! Please feel free to put any suggestions or ideas for future tutorials in the comments section below.


Comments