WordPress Development Tutorials – Theme Structure Theory

W

WordPress needs no introduction to any one in the web community.It is a content management system, running on every 60 out of 100 websites that you see on the Internet and I am one among the proud users of WordPress since past 5 years.In a series of posts on Technophileshub, I would like to put pen to paper on everything that I have learned during my course of journey with WordPress.In this post, we are going to take a look at the WordPress structure to understand it better and learn how it works.I am assuming that you know the basics of HTML, PHP and CSS.In
case if you don ‘t know then probably it might be the right time for you to sit back for a day or two and learn the very basics of HTML, PHP and CSS and come back.

In a traditional HTML page, you write your complete code in a single file other than the CSS but in the case of WordPress, it splits the code in that single page into multiple template files based on the page structure and below is a typical structure of a WordPress page.

Wordpress Structure

Templates are nothing but pieces of a page and WordPress combines them at run time based on query strings in the URL while trying to open a page to create a complete page. Above is the structure of a typical WordPress page which will be rendered by multiple template files. Template files are not just the random pieces of a page but are very specific and have their own purpose with a unique template name. Following are few template files of a WordPress theme for us to get started.

  1. Front Page
    • index.php
      The root of any directory is powered by index file and it is also same with the case of WordPress. Your theme root directory contains this index file and will be the first one to be loaded.
    • front.php
      This file if defined will take precedence over index.php to be displayed as front page of your blog or website.
  2. Basic building blocks
      Header, Footer and Content page are basic building blocks of WordPress as they are common for every WordPress page.

    • header.php
      Header file contains the code up to the top head section of the page and is written in header.php file and will be called from a content page./li>
    • Content Page (index.php, single.php, page.php)
      These files are content section of your wordpress page. It is up to you to decide what you want to do in content section. For example index.php contains Sidebar and “The Loop” of wordpress which is responsible to display the list of posts. single.php is a single post page which includes sidebar and a section to display the post which also contains the comments section.
    •  
    • footer.php
      Footer is the bottom section of your page which includes copyright, credits and important link details. header.php and footer.php are the only two files that will be called on every page.
  3. Single Post Page
    • single.php
      The purpose of this file is to display the content of your post in the content section and you may chose to have a sidebar or opt for full page content. Generally, it calls the template files for both sidebar and comments and finally ends by calling footer.
    • page.php
      This is the template file for your pages in wordpress. As usual, it is up to you to decide how you want to display pages in your wordpress theme. Generally, a page contains header and footer without sidebar or comments section.
  4. Multiple Posts Page
    • category.php
      The purpose of this file is to display the posts filed under the specific category.
    • tag.php
      The purpose of this file is to display the posts filed under the specific tag
    • archive.php
      The purpose of this file is to display the archived posts
    • search.php
      The purpose of this file is to display the search results of a query raised in the search form.
  5. Comments Page
    • comments.php
      The purpose of the file is to display the comment form and comments filed under a particular post.

Structure

These individual template files helps WordPress to work in a modular way. We will discuss more about these files in the future posts when we are actually working on them and for now I am wrapping up this post. Thanks for reading.
Source: WordPress Codex
DZFFQKVR9XKS

About the author

pavankumar.p1990

Add comment

By pavankumar.p1990