The Roots theme for WordPress integrates Twitter Bootstrap and the HTML5 Boilerplate into WordPress. I’m going to see what it’s all about.
Installation is straightforward, as it is for most WordPress themes. I have some custom post types from a previous project that I need to bring over, so I’m going to do that now. I’ve mentioned before that I need to move these custom post types into a plugin instead of having them tied to a theme, but that’s a task for later.
I simply copied my post type definitions (I had placed each of them in separate files) into the Roots theme folder, then I require’d them in my functions.php file. They post types show up in the admin nav, so things are looking promising.
When I go to create the first instance of my one of my new post types, however, I get some errors. I try to upload several images at once and for each upload I get this error:
"image name" has failed to upload due to an error Unable to create directory /Users/me/Sites/wordpress/assets. Is its parent directory writable by the server?
After temporarily setting the permissions on /Users/me/Sites/wordpress/assets to 777, I am able to upload the files.
I had used Nathan Searle’s simple carousel script in my previous effort to create a carousel on the home page, but now that I’m using a theme based on Twitter Bootstrap, I may as well use their carousel plug-in.
< … some coding … >
Carousel is working now, though I had to battle through some stuff. The carousel section of the Twitter Bootstrap documentation doesn’t mention that you need to include transitions.js and you need to include the class of the transition you want in your main div. The example HTML looks like this:
<div id=”myCarousel” class=”carousel”>
But to add the slide transition (like the one used in the example carousel), it needs to look like this:
<div id=”myCarousel” class=”carousel slide“>
I need to add some styles from my previous effort so the label and text information for each slide are overlayed on the graphic. Before I do that, however, I need to set up Sass (via Compass) for this new installation.
<… trying to get Compass/Sass working … >
I had some difficulties with the Compass config.rb file – particularly with getting the http_path and the css_dir correct – but eventually I got it smoothed out. I then had some problems trying to figure out where to put my styles within the Roots theme. Eventually I figured that out too: inside the roots/app.css file. A little different than a typical WP theme, but that’s ok.