Why Partialise the WordPress Theme Template Files

You may notice that there is a template-parts folder found within the Underscores Theme. This is primarily used to better organise the starter theme. By placing partials aka ‘parts’ or ‘template-parts’ within a folder, they are all easier referenced using the get_template_part() WordPress function.

Check out this pull request for the history of including the template-parts folder within the Underscores starter theme.

Using the get_template_part() Function in Themes

Have a look at this theme file called page.php. You will notice that it contains get_template_part():

<?php
/**
 * The template for displaying all pages
 *
 * This is the template that displays all pages by default.
 * Please note that this is the WordPress construct of pages
 * and that other 'pages' on your WordPress site may use a
 * different template.
 *
 * @link https://developer.wordpress.org/themes/basics/template-hierarchy/
 *
 * @package _s
 */

get_header();
?>

	


		<?php
		while ( have_posts() ) :
			the_post();

			get_template_part( 'template-parts/content', 'page' );

			// If comments are open or we have at least one comment, load up the comment template.
			if ( comments_open() || get_comments_number() ) :
				comments_template();
			endif;

		endwhile; // End of the loop.
		?>

		

<?php
get_sidebar();
get_footer();

This WordPress function references to ‘get the file found in template-parts named content-page’. The 2nd parameter $name is mainly for readability purposes, and is therefore optional. But it is good to make use of this as much as possible.

Make Use of the HTML 5 Sections

By definition you may use the section element found in HTML 5.

More info on the differences between a generic div versus the section element can be found in here. A great and concise discussion!

You will notice naturally that as you save more and more of your template parts you will find that they will need to be defined usually with the slug name: content-, section-, snippet-, aside-, etc.

Let us know in the comments what you provide as the slug-name for your template parts in your Theme Development!

This does not apply only to WordPress development, but carries across web development in general as this is dealing with HTML semantics (probably not the snippet and content though).

How to Find out When to Use the Section Element

First off, please have a read on HTML 5 doctor how to best use the section element.

Whilst you are developing your theme, you will begin to notice that you may want to re-use certain ‘sections of content’ for later use in the theme. This may include for example: a Call-To-Action section, a Testimonials section, a Featured article section (used in your archive-*.php files), and many more. Each of these contain a heading.

There are times though when it may be more appropriate to call it an aside element. This is usually termed as secondary content. A better definition is written here by Mike Robinson. But remember that you must not define your elements based on style, but rather on how they are related to the content of the page.

Conclusion

Partialising your template parts saving them within the template-parts folder like as found in the Underscores starter theme for example helps provide better organisation of your WordPress theme files and makes it easier to manage over time.

In fact, this plays well with HTML 5 semantics as this is now a common way to rename your template files in such as way that it provides more context.

Of course, you will have to make sure for example that the template part you are saving is appropriately named as e.g. a section element.