Page Templates

Topics

  • Uses for Folio Templates
  • Page Templates within the Template Hierarchy
  • Folio Templates Purpose & User Control
  • File Organization of Page Templates
  • Creating Custom Page Templates for Global Use
  • Creating a Custom Folio Template for One Specific Page
  • Creating folio templates for specific mail service types
  • Using Provisional Tags in Folio Templates
  • Identifying a Page Template
  • Page Template Functions

Folio templates are a specific type of template file that tin be practical to a specific folio or groups of pages.

Note: As of WordPress 4.7 folio templates back up all post types. For more details how to set a page template to specific post types see example below.

Since a folio template is a specific type of template file, hither are some distinguishing features of folio templates:

  • Page templates are used to alter the wait and experience of a page.
  • A page template can be applied to a single page, a page section, or a grade of pages.
  • Folio templates more often than not have a high level of specificity, targeting an private folio or grouping of pages. For case, a page template namedpage-about.php is more specific than the template files page.php or index.php as it volition only bear on a folio with the slug of "almost."
  • If a folio template has a template name, WordPress users editing the folio accept command over what template volition be used to render the page.

Uses for Page Templates

Page templates display your site's dynamic content on a page, e.one thousand., posts, news updates, calendar events, media files, etc. Yous may decide that you desire your homepage to await a specific way, that is quite dissimilar to other parts of your site. Or, you may desire to display a featured image that links to a post on one part of the page, have a list of latest posts elsewhere, and use a custom navigation. Yous can employ page templates to attain these things.

This section shows you how to build folio templates that can exist selected by your users through their admin screens.

For case, you tin can build page templates for:

  • full-width, i-column
  • ii-column with a sidebar on the right
  • two-column with a sidebar on the left
  • three-column

Top ↑

Page Templates within the Template Hierarchy

When a person browses to your website, WordPress selects which template to use for rendering that page. Every bit we learned earlier in the Template Hierarchy, WordPress looks for template files in the following order:

  1. Page Template — If the page has a custom template assigned, WordPress looks for that file and, if institute, uses it.
  2. folio-{slug}.php — If no custom template has been assigned, WordPress looks for and uses a specialized template that contains the page's slug.
  3. page-{id}.php — If a specialized template that includes the page's slug is not constitute, WordPress looks for and uses a specialized template named with the page's ID.
  4. page.php — If a specialized template that includes the page's ID is non found, WordPress looks for and uses the theme's default page template.
  5. singular.php — If page.php is not plant, WordPress looks for and uses the theme's template used for a single post, irregardless of post type.
  6. index.php — If no specific page templates are assigned or found, WordPress defaults back to using the theme's index file to return pages.

Alert: There is also a WordPress-defined template namedpaged.php. Information technology isnon used for the page post-type just rather for displaying multiple pages of athenaeum.

Tiptop ↑

Page Templates Purpose & User Command

If you program on making a custom page template for your theme, you should decide a couple of things before proceeding:

  • Whether the page template will be for one specific page or for whatsoever folio; and
  • What type of user control you want bachelor for the template.

Every page template that has a template proper name tin be selected by a user when they create or edit a page. The listing of available templates can be constitute atPages > Add New > Attributes > Template. Therefore, a WordPress user can choose any page template with a template proper name, which might not be your intention.

For example, if you want to have a specific template for your "Nigh" page, information technology might not be appropriate to name that page template "Near Template" equally it would be globally available to all pages (i.e. the user could apply it to whatever folio). Instead, create a single use template and WordPress volition render the page with the advisable template, whenever a user visits the "Nigh" folio.

Conversely, many themes include the power to choose how many columns a page will have. Each of these options is a folio template that is available globally. To give your WordPress users this global option, you will need to create page templates for each option and requite each a template name.

Dictating whether a template is for global apply vs. atypical use is achieved past the way the file is named and whether or non is has a specific comment.

Note: Sometimes information technology is appropriate to have a template globally bachelor fifty-fifty if it appears to be a single use case. When you're creating themes for release, it can be hard to predict what a user will proper name their pages. Portfolio pages are a peachy example equally not every WordPress user will name their portfolio the aforementioned matter or have the same page ID and nonetheless they may desire to utilize that template.

Top ↑

File Arrangement of Page Templates

Every bit discussed in Organizing Theme Files, WordPress recognizes the subfolder page-templates. Therefore, it's a good idea to store your global page templates in this folder to help keep them organized.

Warning: A specialized page template file (those created for only one time utilize) cannot be in a sub-folder, nor, if using a Child Theme, in the Parent Theme's folder.

Tiptop ↑

Creating Custom Page Templates for Global Use

Sometimes you'll want a template that tin can exist used globally by any page, or by multiple pages.  Some developers volition group their templates with a filename prefix, such aspage_two-columns.php

Alert: Of import! Do non use page- as a prefix, every bit WordPress volition interpret the file equally a specialized template, meant to apply to only 1 page on your site.

For data on theme file-naming conventions and filenames you cannot use, come across reserved theme filenames.

Tip: A quick, safe method for creating a new folio template is to make a re-create ofpage.php and give the new file a distinct filename. That style, you get-go off with the HTML construction of your other pages and you lot tin edit the new file equally needed.

To create a global template, write an opening PHP comment at the peak of the file that states the template's proper noun.

<?php /* Template Name: Case Template */ ?>


Information technology's a good idea to choose a name that describes what the template does equally the proper noun is visible to WordPress users when they are editing the page. For example, you could proper noun your template Homepage, Blog, or Portfolio.

This instance from the TwentyFourteen theme creates a page template called Full Width Page:

<?php /** * Template Proper noun: Full Width Folio * * @packet WordPress * @subpackage Twenty_Fourteen * @since 20 14 i.0 */


basics-page-templates-03Once you upload the file to your theme's folder (due east.1000., page-templates), go to thePage > Edit screen in your admin dashboard.

On the correct hand side underattributesy'all'll encounter template.  This is where users are able to access your global folio templates.

Tip: The select list has a maximum width of 250px, and then longer names may be cut off.

Pinnacle ↑

Creating a Custom Page Template for One Specific Page

As mentioned in the Template Hierarchy page, you can create a template for a specific folio.  To create a template for one specific page, copy your existing page.php file and rename it with your page'southward slug or ID:

  1. page-{slug}.php
  2. page-{ID}.php

For example: Your Nearly page has a slug of 'nearly' and an ID of vi. If your active theme's folder has a file namedpage-about.php orfolio-6.php, then WordPress will automatically find and employ that file to return the About page.

To be used, specialized page templates must be in your theme's folder (i.e./wp-content/themes/my-theme-name/ ).

Top ↑

Creating page templates for specific postal service types

By default, a custom folio template will be available to the "page" post blazon.

To create a page template to specific postal service types, add together a line under the template name with the post types yous would like the template to support.

Example:

<?php /* Template Proper name: Full-width layout Template Mail Type: post, page, result */ // Page code here...

Alarm: This ability to add page templates to mail service types other than "folio" postal service blazon is supported only from WordPress 4.7

When at least one template exists for a post blazon, the 'Postal service Attributes' meta box volition be displayed in the dorsum end, without the need to add post type support for 'page-attributes' or annihilation else. The 'Mail service Attributes' label tin can be customzied per post type using the 'attributes' characterization when registering a post type.

Astern Compatibility:

Let's say y'all desire to publicly release a theme with support for postal service type templates. WordPress versions earlier iv.7 will ignore the Template Post Type header and show the template in the list of page templates, even though it but works for regular posts. To prevent that, you lot tin hook into the theme_page_templates filter to exclude it from the listing. Hither's an case:

/** * Hides the custom postal service template for pages on WordPress four.vi and older * * @param array $post_templates Assortment of page templates. Keys are filenames, values are translated names. * @render array Filtered array of page templates. */ function makewp_exclude_page_templates( $post_templates ) { if ( version_compare( $GLOBALS['wp_version'], '4.seven', '<' ) ) { unset( $post_templates['templates/my-full-width-post-template.php'] ); } return $post_templates; } add_filter( 'theme_page_templates', 'makewp_exclude_page_templates' );

Expand full source codeCollapse full source code


That style you lot can back up custom post type templates in WordPress 4.vii and beyond while maintaining full backward compatibility.

Note that theme_page_templates is actually a dynamic theme_{$post_type}_templates filter. The dynamic portion of the claw name, $post_type, refers to the post type supported by the templates. E.thousand. you lot can claw into theme_product_templates to filter the list of templates for the product mail service type.

Summit ↑

Using Conditional Tags in Page Templates

Yous can brand smaller, folio-specific changes with Conditional Tags in your theme'sfolio.php file. For case, the below case code loads the file header-home.php for your forepart page, but loads another file (header-about.php) for your Nigh page, and then applies the defaultheader.php for all other pages.

if ( is_front_page() ) : get_header( 'dwelling' ); elseif ( is_page( 'About' ) ) : get_header( 'well-nigh' ); else: get_header(); endif;


You can learn more about Conditional Tags here.

Top ↑

Identifying a Page Template

If your template uses thebody_class() function, WordPress will print classes in thebody tag for the post type class name (page), the page's ID (folio-id-{ID}), and the page template used. For the defaultpage.php, the course proper noun generated ispage-template-default:

<trunk class="folio page-id-6 page-template-default">

Note: A specialized template (page-{slug}.php orpage-{ID}.php) as well gets thepage-template-default class rather than its own body grade.

When using a custom page template, the classpage-template will impress, forth with a grade naming the specific template. For example, if your custom folio template file is named as follows:

<?php /* Template Name: My Custom Folio */ ?gt;


Then then rendered HTML generated volition be equally follows:

<trunk class="folio page-id-6 page-template page-template-my-custom-page-php">


Notice the page-template-my-custom-page-php class that is applied to the body tag.

Top ↑

Page Template Functions

These born WordPress functions and methods can assistance you piece of work with page templates:

  • get_page_template() returns the path of the folio template used to render the page.
  • wp_get_theme()->get_page_templates() returns all custom page templates available to the currently agile theme (get_page_templates() is a method of the WP_Theme class).
  • is_page_template() returns truthful or simulated depending on whether a custom page template was used to render the folio.
  • get_page_template_slug() returns the value of custom field _wp_page_template (nothing when the value is empty or "default").If a page has been assigned a custom template, the filename of that template is stored as the value of a custom field named'_wp_page_template' (in thewp_postmeta database table). (Custom fields starting with an underscore do non display in the edit screen'due south custom fields module.)