Home » Theme Configuration

Theme Configuration

Boilerplate configuration is split across PHP configuration, parent/child theme SASS variables, and Bootstrap 5 variable overrides. Use these files to establish the project baseline before writing template-specific or component-specific overrides.

PHP Theme Configuration

Use config.php for PHP-side theme behavior: theme identity, build versioning, text domain, feature flags, layout defaults, WordPress feature support, comments, sharing, sidebars, header behavior, and other project-level constants.

Parent file: config.php

Child override: child themes may provide their own config.php. When the child configuration is loaded first and marks the configuration as set, the parent theme does not fall back to its default parent configuration.

Use this for: enabling/disabling features, changing project-level defaults, setting text domain/build constants, controlling theme behavior without editing templates.

Theme SASS Variables

Use variables.scss for Boilerplate-specific design tokens: layout widths, rhythm values, borders, transitions, typography, light/dark theme colors, links, buttons, forms, widgets, comments, breadcrumbs, media, print colors, and component-level theme defaults.

Parent file: assets/sass/parent_theme/variables.scss

Child override: child themes may provide their own variable definitions before the parent theme variables are loaded. Parent variables use SASS !default, so child-defined values take precedence while unspecified values continue to fall back to the parent defaults.

Use this for: project branding, spacing, typography, light/dark color systems, component tokens, layout tuning, and theme-owned visual defaults.

Bootstrap 5 Variable Overrides

Use the Bootstrap variable override layer for values that must be set before Bootstrap compiles: Bootstrap colors, font settings, line heights, spacer values, border behavior, pagination colors, dropdown colors, navbar defaults, and framework-level defaults.

Parent file: assets/sass/parent_theme/bootstrap/variables.scss

Load order: this file is loaded before Bootstrap’s own variable files, allowing Boilerplate to override Bootstrap defaults at compile time.

Use this for: Bootstrap-level configuration that should affect generated Bootstrap CSS, not just theme-owned selectors.

Bootstrap Runtime Overrides

Use Bootstrap runtime overrides for CSS that adjusts Bootstrap output after Bootstrap has compiled. This is where Boilerplate aligns Bootstrap components with the theme rhythm, border tokens, form tokens, button behavior, navbar behavior, and runtime CSS custom properties.

Parent file: assets/sass/parent_theme/bootstrap/overrides.scss

Use this for: normalizing Bootstrap components to Boilerplate’s runtime theme system, especially where CSS custom properties are needed for light/dark support.

Recommended Configuration Flow

  1. Set PHP feature behavior in config.php.
  2. Set Bootstrap compile-time defaults in assets/sass/parent_theme/bootstrap/variables.scss.
  3. Set Boilerplate theme tokens in assets/sass/parent_theme/variables.scss.
  4. Use assets/sass/parent_theme/bootstrap/overrides.scss only when Bootstrap output needs runtime alignment with Boilerplate.
  5. Use child theme overrides for project-specific changes instead of editing parent theme defaults directly.
© 2026 Boilerplate