Layout System for WordPress Theming

functions.php:

/**
 * FX Layout
 *
 * @param string   $layout_name Template name.
 * @param function $layout_content Layout content view.
 * @param function $layout_type Layout content type.
 * @since 1.0.0
 */
function fx_layout( $layout_name, $layout_content, $layout_type ) {

	require get_template_directory() . "/layouts/$layout_name.php";

}Code language: PHP (php)

Default Layout File(layouts/default.php):

<?php
/**
 *
 * Default layout.
 *
 * @package flex
 * @author pressx
 * @since 1.0.0
 */

get_header();
?>

<div id="layout-<?php echo esc_attr( $layout_name ); ?>">

	<?php $layout_content(); ?>

</div>

<?php
get_footer();Code language: PHP (php)

Usage on any WordPress Theme File (e.g. 404.php):

<?php
/**
 * The template for displaying 404 Page.
 *
 * The structure of the page that contains the 404 content.
 *
 * @package flex
 * @author pressx
 * @since 1.0.0
 */

fx_layout( 'default', function() {
	?>

<div id="page-404" class="container items-center px-8 mx-auto text-center">

	<h1 class="text-404">404</h1>
	<p class="text-gray-600"><?php esc_html_e( 'Unfortunately, we could not find the page you are looking for.', 'flex' ); ?></p>

</div>

	<?php
});Code language: PHP (php)