401/wordpress-base-theme

401 Wordpress Theme

Maintainers

Package info

bitbucket.org/weidenhammer/wordpress-base-theme

Type:wordpress-theme

pkg:composer/401/wordpress-base-theme

Statistics

Installs: 524

Dependents: 1

Suggesters: 0


README

This is meant to be a jumping off point for new site builds. We copy the plugin and theme into a new site build and use this framework to help speed up new site builds.

  • Post types are created via Advanced Custom Fields Pro and managed there
  • Custom taxonomies are created via Advanced Custom Fields pro and managed there
  • PHP namespacing is setup throughout the theme and plugin

Theme Structure

  • acf-json
  • assets // fonts, images, js, scss, svg
  • blocks // custom ACF blocks go here. SCSS is compiled into /dist/blocks via npm run build:blocks (see Front-end build below).
  • dist
  • inc
    • Assets.php // includes and enqueues various files
    • Functions_Custom.php // specific functions and settings that may need to be changed or added PER SITE (since global functions exist in the plugin)
    • Menus.php // custom Walker for WP menu, adds image support
    • metadata.php // included in the via header.php. Adds in the custom :root colors
  • templates // our custom templates and files
    • archive // the index.php file routes here
    • content // the single.php file routes here
    • loop // various CPT loops that are used in the archive files
    • pagination.php // custom pagination that handles the standard WP pagination or an ajax load more button
  • createblock.sh // scaffolds a new block under /blocks; then run npm run build:blocks
  • functions.php // more theme functions (sometimes we use both this and Custom_Functions.php per theme)

Front-end build (hybrid: Option B)

From the theme directory, npm install once, then:

CommandWhat it does
npm run buildMain SCSS → dist/css/style.css, editor SCSS → style-editor.css, block SCSS → dist/blocks/**, concat + minify JS → dist/js/*.min.js
npm run build:cssMain + editor CSS only
npm run build:blocksBlock SCSS only
npm run build:jsFooter + header JS bundles only
npm run watchRebuild on changes under assets/scss, blocks, or assets/js

Stack: Dart Sass, PostCSS (Autoprefixer + cssnano), esbuild (minify concatenated legacy scripts). When you add block editor JavaScript for native blocks, add @wordpress/scripts (npm install -D @wordpress/scripts) and use wp-scripts build / create-block patterns alongside these scripts.

Companion plugins

/wp-content/plugins/hammer-marketing-custom

  • This plugin is meant to "functionality" that we repeat over and over again, and letting the theme be more for front-end / visual changes on a site-by-site basis.
  • The plugin also houses a PostTypes folder for custom functionality (mainly ajax loading, filtering, etc) specific to that post type.
    • The thinking behind this is that the client can change themes eventually if they want to, but keep the plugin installed and the extra functionality remains.

Plugin Structure

  • assets // includes css/images/js folders. Also includes a login.css.php file to style a custom login screen styling //
  • Components
    • dash // includes custom dashboard files
    • ACFs.php // includes custom ACF blocks and registers custom User Settings field group
    • Admin.php // various WP admin area tweaks and whitelabeling
    • Analytics.php // sets up UA/GTM tag code (possibly old?)
    • Dashboard.php // sets up the custom dashboard with styling and functions
    • Ecommerce.php // only included if WooCommerce is installed, changes WC wrapper
    • Enqueue.php // enqueues admin and login files, sets custom variables to be used in admin
    • Functions.php // plugin theme setup, hiding comments if needed, various Gravity Forms changes, various custom functions used in the theme
  • PostTypes // _copy.php is to copy for other post types. Custom functionality for post types goes here
  • hammer-marketing-custom.php // init file
  • setup.php // changes various WP settings on plugin activation (only?)

/wp-content/plugins/hammer-locations (optional)

  • Install only when the build needs the store locator / map. Registers the Locations CPT, ACF fields, page template Locations (map), map list + AJAX popup, and assets. Site-specific styling: add something like assets/scss/partials/_locations.scss in the active theme and compile with the rest of the theme CSS.
  • Google Maps API key: define GOOGLE_MAPS_API in wp-config.php when using this plugin. The plugin passes it to ACF (acf/fields/google_map/api + acf_update_setting) and uses it for the front-end Maps script.

TO DO

  • style form fields with newest GF styling changes
  • make the menu accessible
  • other accessibility updates