The document discusses managing server environments and themes in WordPress using extensible configuration arrays. It introduces a WPized_Env_Config class that loads configuration settings from different environment-specific files, merging them with default settings. This allows components to be configured differently based on the active environment. Components are loaded via functions.php and can access the configuration settings, allowing them to be reused across projects with different configurations.

1. Managing themes and
server environments
with extensible
configuration arrays
Chris Olbekson
@chris_olbekson @X_Team

2. Managing Environments
Making your code aware

3. wp-config.php

4. The Environment Config Class
class WPized_Env_Config {
1. Get defined environment from active-env and assign to $active_env
2. Load default.env

5. The Environment Config Class
class WPized_Env_Config {
1. Get defined environment from active-env and assign to $active_env
2. Load default.env
3. Load defined environment (each environment checks for an override)
a. local.env.php
b. vagrant.env.php
c. staging.env.php
d. production.env.php

6. The Environment Config Class
class WPized_Env_Config {
1. Get defined environment from active-env and assign to $active_env
2. Load default.env
3. Load defined environment (each environment checks for an override)
a. local.env.php
b. vagrant.env.php
c. staging.env.php
d. production.env.php
4. Recursively merge the loaded environment configuration array with the
default

7. The Environment Config Class
static function merge_arrays( array $array ) {
return call_user_func_array(
array( 'WPized_Theme_Config',
'recursive_array_merge_assoc'
),
func_get_args());
}
continue loading WordPress.
/** Sets up WordPress vars and included files */
require_once(ABSPATH, 'wp-settings.php');

8. Component Libraries
Keeping a common codebase

9. Components generic enough to be used in any WordPress
project.
● Redirection
● oEmbeds
● Post/Taxonomy Ordering
Components used specifically in WordPress projects for
specific client.
● Ad Utility
● Event Post Type
● Social Panel Widget
Components are housed in multiple
libraries
WPized
Base
Client
Name
Common

10. Components
Let's make 'em configurable!

11. 1. Default configs can be defined in the component's setup() method.
2. Since theme configs can override these defaults we can use the same
component code for any project!
3. "Mixin" themes are now possible (like child theme groups) which can be
very useful on large multisite installs.
4. Child themes are the final authority.
The merge order of configs
#4
Child Theme
config.php
#3
Mixin Theme
config.php
#2
Parent Theme
config.php
#1
Component
(defaults)
foo.php

12. Load a component in functions.php
Path shortcut to the library we'll be using for this example.
define( 'WPIZED_BASE_LIB', WP_CONTENT_DIR . '/includes/wpized_base' );
function foo_load_config {
require_once( WPIZED_BASE_LIB . '/theme_config.php' );
// Custom logo
if ( WPized_Theme_Config::defined( 'custom_logo' ) ) {
require_once( WPIZED_BASE_LIB . '/custom-logo.php' );
WPized_Custom_Logo::setup( WPized_Theme_Config::get( 'custom_logo' ) );
}
}
add_action( 'after_setup_theme', 'foo_load_config' );

13. Load a component in functions.php
The component will load when the theme is initialized.
define( 'WPIZED_BASE_LIB', WP_CONTENT_DIR . '/includes/wpized_base' );
function foo_load_config {
require_once( WPIZED_BASE_LIB . '/theme_config.php' );
// Custom logo
if ( WPized_Theme_Config::defined( 'custom_logo' ) ) {
require_once( WPIZED_BASE_LIB . '/custom-logo.php' );
WPized_Custom_Logo::setup( WPized_Theme_Config::get( 'custom_logo' ) );
}
}
add_action( 'after_setup_theme', 'foo_load_config' );

14. Load a component in functions.php
Allows us to use some methods for fetching and merging configs.
define( 'WPIZED_BASE_LIB', WP_CONTENT_DIR . '/includes/wpized_base' );
function foo_load_config {
require_once( WPIZED_BASE_LIB . '/theme_config.php' );
// Custom logo
if ( WPized_Theme_Config::defined( 'custom_logo' ) ) {
require_once( WPIZED_BASE_LIB . '/custom-logo.php' );
WPized_Custom_Logo::setup( WPized_Theme_Config::get( 'custom_logo' ) );
}
}
add_action( 'after_setup_theme', 'foo_load_config' );

15. Load a component in functions.php
If there's no config key provided for the component, it never runs.
define( 'WPIZED_BASE_LIB', WP_CONTENT_DIR . '/includes/wpized_base' );
function foo_load_config {
require_once( WPIZED_BASE_LIB . '/theme_config.php' );
// Custom logo
if ( WPized_Theme_Config::defined( 'custom_logo' ) ) {
require_once( WPIZED_BASE_LIB . '/custom-logo.php' );
WPized_Custom_Logo::setup( WPized_Theme_Config::get( 'custom_logo' ) );
}
}
add_action( 'after_setup_theme', 'foo_load_config' );

16. Theme's config.php
We have a key! So this component will be loaded.
return array(
'brightcove_oembed' => array(
'players' => array( ... ),
),
'custom_logo' => array(
'default' => get_stylesheet_directory_uri() . '/images/common/logo.png',
'width' => 300,
'height' => 100,
),
'ads' => array(
'site' => 'example.com/foo',
),
);

17. The simple concept
We can setup the component differently on a site-by-site basis!
Theme Configs
setup( )
in component's
class
Parent > Mixin > Child
Default config values

18. Load a component in functions.php
The config gets passed to component's setup() method.
define( 'WPIZED_BASE_LIB', WP_CONTENT_DIR . '/includes/wpized_base' );
function foo_load_config {
require_once( WPIZED_BASE_LIB . '/theme_config.php' );
// Custom logo
if ( WPized_Theme_Config::defined( 'custom_logo' ) ) {
require_once( WPIZED_BASE_LIB . '/custom-logo.php' );
WPized_Custom_Logo::setup( WPized_Theme_Config::get( 'custom_logo' ) );
}
}
add_action( 'after_setup_theme', 'foo_load_config' );

19. class WPized_Custom_Logo {
public static $options = array();
public static function setup( $overrides = array() ) {
self::$options = WPized_Theme_Config::recursive_array_merge_assoc(
array(
'default' => null,
'width' => 250,
'height' => 100,
),
$overrides
);
}
}
echo esc_html( WPized_Custom_Logo::$options['width'] ); // 300
Custom logo component

20. class WPized_Custom_Logo {
public static $options = array();
public static function setup( $really_default_defaults = array()) {
self::$options = WPized_Theme_Config::recursive_array_merge_assoc(
array(
'default' => null,
'width' => 250,
'height' => 100,
),
$really_default_defaults
);
}
}
echo esc_html( WPized_Custom_Logo::$options['width'] ); // 300
Custom logo component

21. class WPized_Custom_Logo {
public static $options = array();
public static function setup( $really_default_defaults = array() ) {
self::$options = WPized_Theme_Config::recursive_array_merge_assoc(
array(
'default' => null,
'width' => 250,
'height' => 100,
),
$really_default_defaults
);
}
}
echo esc_html( WPized_Custom_Logo::$options['width'] ); // 300
Custom logo component

22. class WPized_Custom_Logo {
public static $options = array();
public static function setup( $really_default_defaults = array() ) {
self::$options = WPized_Theme_Config::recursive_array_merge_assoc(
array(
'default' => null,
'width' => 250,
'height' => 100,
),
$really_default_defaults
);
}
}
echo esc_html( WPized_Custom_Logo::$options['width'] ); // 300
Custom logo component

23. class WPized_Custom_Logo {
public static $options = array();
public static function setup( $really_default_defaults = array() ) {
self::$options = WPized_Theme_Config::recursive_array_merge_assoc(
array(
'default' => null,
'width' => 250,
'height' => 100,
),
$really_default_defaults
);
}
}
echo esc_html( WPized_Custom_Logo::$options['width'] ); // 300
Custom logo component

24. class WPized_Custom_Logo {
public static $options = array();
public static function setup( $really_default_defaults = array() ) {
self::$options = WPized_Theme_Config::recursive_array_merge_assoc(
array(
'default' => null,
'width' => 250,
'height' => 100,
),
$really_default_defaults
);
}
}
echo esc_html( WPized_Custom_Logo::$options['width'] ); // 300
Custom logo component

25. Thank you!