Blueprint has a powerful theming engine which can save you a considerable amount of development time. The templates that a built into blueprint are designed to not only power all the real estate sections of your new website but also all the blog sections. These templates will pass all of WordPress.org’s theme gallery submission tests and placester has a number of themes in the WordPress.org theme gallery.
There are a few principals you need to understand in order to master blueprint’s templating system:
- The pre-existing templates that come with blueprint.
- Template Hierarchy
- Wrappers & Sidebars
- How to overwrite existing templates.
- How to modify sections of templates (without overwriting the entire template).
- Template debugging tools.
Each is explained below.
Blueprint comes with a number of built-in templates for rendering all the views you’ll need. Templates are either real estate related or blog related. Here’s a list of all the templates included in blueprint:
Template Hierarchy & Overwriting Specific Templates
The blueprint theme framework not only respects the WordPress template hierarchy but it extends those principals to apply to its real estate specific templates too. If you’re not familiar with the WordPress template hiegharchy please check out the diagram here.
Any template that is located in blueprint/templates/ can be instantly overrided by creating an identically named template in the main directory of your theme.
As a quick example, lets say that you’ve installed blueprint correctly wanted to change the way the property details page renders. Currently, the property details page is being rendered by:
As with all libraries, if you were to directly modify this file, then any time blueprint, you would loose all your changes. This is where template hierarchy comes in. All you need to is copy the property-details.php template into the main directory of your theme. Once the file is copied over we can safely modify it.
Wrappers & Sidebars
Frequently you’ll want to wrap a specific template in some html or php code to control how it is rendered. To solve this problem, Blueprint has helpful wrapping functionality built right into it’s routing utility. This wrapping utility allows you to intercept any template and wrap it’s output in whatever functionality you’d like.
For example, let’s say that you wanted to wrap all archive pages with a a different container class to make it 640px wide rather then full width. To do this, you would create a file called wrapper-archive.php in the main directory. You can indicate where you’d like the archive.php file to render by using the:
<?php PLS_Route::handle_dynamic(); ?>
Lets say that in the example above you also wanted to have a custom header, sidebar, and footer. You would use the following code to render each in the spot you wanted:
<?php PLS_Route::handle_header(); ?> <div class="main-inner container_12"> <div id="attribute-template" class="grid_8 alpha omega" role="main"> <?php PLS_Route::handle_dynamic(); ?> </div> <?php PLS_Route::handle_sidebar(); ?> </div> <?php PLS_Route::handle_footer(); ?>
How to modify sections of templates.
Frequently, you’ll want to modify only a section of a template without overwriting all the functionality. A perfect example is when displaying a list of listings. Often you’d like to only change how the row is rendered, rather the completely altering the entire page.
All templates use the WordPress standard of hooks to allow you to selectively change the content of a specific UI element. Here’s more information about how blueprint uses hooks and contexts as well as how to hook in to accomplish basic changes in common UI elements.