WordPress Website Structure
WordPress website project generated by Chisel consists of the following folders and files
Gulp tasks configuration. You can customize development workflow here, but usually it’s not necessary.
Node.js modules for various project tasks.
This is where you do front-end development. The project source files are organized in the following subfolders:
assets– static asset files (images, fonts, etc.) – everything from this folder will be copied to the
styles– Sass files with ITCSS structure, check out ITCSS documentation
src folder to the theme folder
It’s possible to have the
src folder in your theme folder, just choose this option when setting up the project. If you haven’t and would like to move it manually, follow these steps:
- Move the
srcfolder to the theme folder –
chisel.src.baseproperty on line 13 in
This is where WordPress is installed.
wp-config.php file is altered to provide support for local configuration. All settings except Authentication Unique Keys and Salts, database charset and ABS_PATH can be set in
wp-config-local.php file for purposes of local development. The file is added automatically to
.gitignore and should not be committed and stored on the production server.
If there is
wp-config-local.php file available in this directory then the environment is recognized as local and configuration from this file is used. If it doesn’t exist then settings from
wp-config.php are used.
This is where you do theme development. The theme folder includes Chisel starter theme with the following structure:
dist– production ready files are automatically generated here.
Chisel– various classes used to extend or add new functionality to your theme. Check out WordPress development
src– if you’ve chosen to have the
srcfolder inside your theme folder, it will appear here
templates– Twig templates, check out Twig documentation
functions.php– Chisel starter theme files
Chisel uses various configurations files. Usually, it’s not necessary to touch these files, unless stated otherwise.
.babelrc– Babel configuration file
.editorconfig– EditorConfig configuration file to achieve consistent coding style
.eslintignore– ESLint ignore file
.gitattributes– Git configuration file to force Unix line ending in text files
.gitignore– default Git ignore files and folders
.htmlhintrc– HTMLHint configuration file
.prettierignore– Prettier ignore file
.prettierrc– Prettier config file
.stylelintignore– stylelint ignore file
.stylintrc.yml– stylelint configuration file to achieve consistent CSS coding style (you can update it to your preference)
.yo-rc.json– Yeoman generator configuration file
dev-vhost.conf– automatically generated virtual host configuration (not needed if you use wildcard virtual hosts)
gulpfile.js– Gulp configuration file
package.json– project metadata and dependencies
package-lock.json– npm lock file, if you use npm
README.md– project readme; you can use it for the project documentation
webpack.chisel.config.js– webpack configuration file
yarn.lock– Yarn lock file, if you use Yarn