Front to Back, take 2, step 05

First full circle code.

The working draft code

I’ve left my earlier post in a point where I had put together a proof-of-concept use of the Kirki library and the Theme Customizer that would allow me to edit and update a page title, content and some meta data from the Theme Customizer itself.
While this is good as an experiment my goal is to be able to write HTML and PHP templates like this (note the use of the ftb-title tag)

// file `ftb-templates/about-us.php`
<?php
get_header(); ?>

<div id="primary" class="content-area">
    <main id="main" class="site-main" role="main">
        <?php
        // Start the loop.
        while ( have_posts() ) : the_post();
            ?>

            <article>
                <header class="entry-header">
                    <h1 class="entry-title">
                        <h1 class="entry-title">
                            <ftb-title>About us</ftb-title>
                        </h1>
                    </h1>
                </header><!-- .entry-header -->

            </article><!-- #post-## -->

    </main><!-- .site-main -->

    <?php get_sidebar( 'content-bottom' ); ?>

</div><!-- .content-area -->

<?php get_sidebar(); ?>
<?php get_footer(); ?>

In a theme under development ftb-templates folder I’d have templates like the one above compiled to templates like the one below.
In this case the original ftb-templates/about-us.php template file will produce the page-about-us.php template file (note that the template is now using the WordPress vanilla the_title function).

// file `page-about-us.php`
<?php
get_header(); ?>

<div id="primary" class="content-area">
    <main id="main" class="site-main" role="main">
        <?php
        // Start the loop.
        while ( have_posts() ) : the_post();
            ?>

            <article>
                <header class="entry-header">
                    <h1 class="entry-title">
                        <h1 class="entry-title">
                            <?php the_title() ?>
                        </h1>
                    </h1>
                </header><!-- .entry-header -->

            </article><!-- #post-## -->

    </main><!-- .site-main -->

    <?php get_sidebar( 'content-bottom' ); ?>

</div><!-- .content-area -->

<?php get_sidebar(); ?>
<?php get_footer(); ?>

The idea behind it being that just parsing the first template file will:

  • add the required Theme Customizer sections and fields
  • compile the second template

Again: it’s meant to be a developer tool and is heavily inspired by Perch CMS").

On GitHub

I’ve spent some of my off time working on the project and moved the code on a bit; I’m still not using any dependency injection container and am just instantiating the classes I need in an hard-coded way.
I’ve concentrated the iteration to go from the first template to the second one and the result is on GitHub.

Next

I will clean up and refactor the code and move on to support the page content and add a UI that will allow me to generate templates on demand in place of doing it on every page load (draft code as I’ve said).