/fwd-boilerplate-theme

WordPress boilerplate theme for use as a starting point for development.

Primary LanguagePHPGNU General Public License v3.0GPL-3.0

fwd-boilerplate-theme

WordPress boilerplate theme for use as a starting point for development

Features

  • Webpack for packaging assets
  • Modern JavaScript support
  • SCSS for writing styles
  • Image optimization for GIF, JPEG, PNG, and WebP

Requirements

Mostly normal WordPress requirements, but you'll need a couple of extra things if you don't have them. This theme does require terminal commands, but only a couple!

This theme also requires you to use Advanced Custom Fields as a plugin once your theme is set up, which you can get here.

Theme Installation

Put this project folder into your themes folder. Then, from the terminal:

cd /your/themes/folder
$ composer install

By default, there are no PHP library dependencies, but this will create the vendor directory and autoload.php file. This should take very little time. Once that is complete:

$ yarn install

Wait for the installation to complete, and you're pretty much done!

Build & Watch

This theme includes two terminal commands: yarn build and yarn watch. yarn build will package assets together and yarn watch will do the same, but also keep Webpack running on any updated files.

What's Included

Aside from the Webpack setup, there are a few things included in the theme:

Separate app Folder

Not everything has to be in a gigantic functions.php file! Theme functionality is broken up in folders under the app directory for simpler code management.

Page Templates Folder

All page templates are loaded from the page-templates directory

Helper PHP Functions

  • fwd_nav_menu() creates a navigation menu without the cruft of wp_nav_menu()
  • fwd_sub_nav() creates sub-navigation menu items. Required by fwd_nav_menu()
  • get_partial() includes files from the layouts folder
  • get_picsum_img_url() generates a placeholder image URL with the Picsum API
  • get_placeholder_img_url() generates a placeholder image URL using the Placeholder.com API
  • get_svg() to return SVG element code

Note: By default, the get_xxx() functions to not output code, but only return it. To output code, either use echo get_xxx() or, where one exists, use the_xxx(). Refer to the helpers directory for which functions have which capabilities.

ACF Local JSON Support

This theme will save and load ACF field groups via local JSON files in the resources directory

TypeKit Support

The theme ships with an included setting for a TypeKit collection ID, if needed.