Axe WordPress Starter Theme

Cut through the BS and get straight to work!

Categories: Development, WordPress

Axe is a simple bare bone WordPress starter theme structure. It’s a theme meant to be a starting point to get you set up and running as fast as possible.

My workflow might not be very orthodox but I typically review the design, Setup my Custom post types using Custom Post Type UI and setup any page data structures using ACF.

Simply being able to plough ahead creating my site structures and loading in real or fake content lets me have something tangible to work with.

Download Axe.

Another tip that I can provide is using console.log to output my ACF structures reducing the need to be to refer back to the admin pages. Check it out.

Build

Included is a bower file preset with Bootstrap SASS, jQuery and a couple other commonly used packages. Bower is going to download packages to /src/vendor.

The src folder stores your SASS and JS that should be compiled into /assets.

Use whatever build tool you want. A CodeKit file has been included to get up and running FAST. Gulp and Grunt are fine but do you really need it?

Page templates

Placing a file under templates/content-home.php will resolve the home page. Using content-contact.php would be used by /contact

Post format templates

Placing a file under templates/format-video.php will resolve all video formats.

Custom Post Type templates

Placing a file under templates/single-books.php will resolve all custom post type single posts.

Custom Taxonomies

Placing a file under templates/archive-books.php will resolve a custom taxonomy for Books /books/sci-fi/ also using a custom loop. The default archive would be archive-default.php using the default post loop.

Custom Loops

If you have a custom post type called Books, creating content-books.php and loading a custom loop like loop-books.php with all the necessary “Loop” code would give you your custom book loop.

See the loop-post.php for an example.

Style

@import "components/base-variables";
@import "components/bootstrap-variables";
@import "components/bootstrap-custom";

Since loading Bootstrap from the vendor folder means you can’t modify your variables without risk over overwriting them, A copy has been made in the /src folder.

base-variables house any site-specific variables that you might need.

bootstrap-custom allows you to easily comment out any unused Bootstrap code that you won’t be using. This lets you output a more minimal css file.

Child theme

https://github.com/adampatterson/Handle

Credits

Template tags are modified and simplified versions of _S

Bonus Tip

This .htaccess tip from Steve Grunwell will attempt to load an upload file locally before trying your production server.

# Attempt to load files from production if they're
# not in our local version.
<IfModule mod_rewrite.c>
  RewriteEngine on
  RewriteCond %{REQUEST_FILENAME} !-d
  RewriteCond %{REQUEST_FILENAME} !-f
  # Replace http://stevegrunwell.com with your 
  # production site's domain name.
  RewriteRule (.*) http://www.sitename.com/wp-content/uploads/$1
</IfModule>

Disclaimer

This starter theme is made for Me, and with my workflow in mind. That said If you have anything to add send me an email [email protected]. I have built and maintained well over 40 sites using this structure and while it does evolve, using a child theme like Handle has helped a lot with continual shifts in my needs.

Adam Patterson

Adam Patterson

User Interface Designer & Developer with a background in UX. I have spent 5 years as a professionally certified bicycle mechanic and ride year-round.

I am a husband and father of two, I enjoy photography, music, movies, coffee, and good food.

You can find me on Twitter, Instagram, and YouTube!