1: Theme files & folders

WordPress themes have a tendency to quickly get large, disorganized, and unmanageable (i.e. file soup). NOUVEAU attempts to solve this problem by using a clean, standardized file structure. This chapter will quickly explain the purpose of each of the folders and files in NOUVEAU‘s root directory.

Root Folders

assets

As you might have guessed, the assets folder contains all the various site assets. This includes (compiled & minified) CSS, Javascripts, web fonts, images, and language files.

bower_components

The bower_components folder contains all the Bower components found in the SASS version of Zurb Foundation for Sites. This is also where you will find any original, un-minified (dev) files.

* This is included to make life easier for folks who might not be as cutting-edge as the rest of us, with our fancy-pants dependency management and whatnot. You can still update the bower dependencies on your own if you like.

NV

The NV folder contains all the files and folders for the NOUVEAU starter theme library. Everything in this folder is part of the NV\Theme\ namespace. This is the meat and potatoes of NOUVEAU, where most of the magic happens.

overrides

parts

The parts folder contains any template-oriented code fragments.

parts/comments

The comments folder more readily exposes the various parts of the comments systems as standard WordPress template files. If you plan on using a different comment system (e.g. Disqus), then you should feel free to delete this.

parts/layout

The layout folder lets you keep your header.php and footer.php files out of the way. This is also helpful for those cases when you need to juggle multiple header and/or footer files.

tests

The tests directory contains files needed to get up and running with PhpUnit for your theme. If you are not planning to use PhpUnit or unit testing in your workflow, you can safely delete this folder and it’s contents.

About the theme root folder…

Although the theme root will technically continue to work exactly as it always has, in NOUVEAU the root should generally only be used for full-page template files. Use the parts folder for any partials, or parts/layout for headers and footers.

Of course, you’ll find a few other files in the root as well, as WordPress convention makes it impossible to safely remove or relocate them. Let’s briefly cover some of the key root files…

Root Files

archive.php

The archive.php file is a standard WordPress template for archive pages.

bower.json

This is a bower manifest file, containing all the version numbers of the various dependencies currently being used. Any time one of the packages (Foundation, et al) gets updated, this file is updated automatically. It’s how bower keeps track of updates.

config.codekit

This is a preconfigured CodeKit project file for anyone who wants to use CodeKit as their SASS/JS compiler. If you are not using CodeKit, you can safely delete this file.

functions.php

functions.php is a required WordPress theme file. By default, it loads and initializes the entire NV class and namespace (which is responsible for all NOUVEAUs back-end magic).

gulpfile.js

This file contains the configuration information needed by Node.js/NPM to properly compile the theme’s SASS and Javascript. If you’re not using Gulp in your workflow, you can safely delete this file.

index.php

The index.php file is a standard WordPress page template, and is used by WordPress when no more-specific template is available.

package.json

This file contains a list of dependencies that need to be installed / updated / used when you use Gulp as part of your workflow. If you are not using Gulp in your workflow, you can safely delete this file.

phpunit.xml.dist

This file contains configuration information needed configuring PhpUnit unit tests for your theme. If you do not plan on using unit tests in your workflow, you can safely delete this file.

README.md

This is simply a Github-friendly version of a WordPress standard readme.txt file. It can be safely deleted.

README-ZF6.md

A copy of the Foundation 6 readme. It can be safely deleted.

single.php

The single.php template file serves as an example for how a template file can work without the need for a loop. Instead, get_post() is simply called once near the top of the file.

style.css

The style.css file is a required WordPress theme file. Since NOUVEAU works best when used with the SASS version of Foundation, this contains no actual CSS by default… but it does contain mandatory metadata which is required by WordPress (such as theme name, author, version, etc).

You should work in style.css only if you are planning on using regular CSS instead of SASS.

This page was last updated on September 16, 2016 – it is currently considered COMPLETE.