WordPress Themes .. Displaying Content
Audience. People with a web development background, or a web development interest, who are either new to WordPress or new to developing for WordPress. This series is based on WordPress 3.3.x.
In the “WordPress themes introduction” article, we built a valid, yet relatively useless, theme for WordPress. The two files that mattered were the style.css, which allowed the “theme” to be recognized and activated, and the index.php file which provided hard coded and static content to be displayed by the browser.
Dynamic Content: WordPress Posts
WordPress allows for the dynamic creation of content. A WordPress unit of content is called a post. The two standard post types that are supported in a standard WordPress install are called POSTS and PAGES. POSTS are more readily used for typical blog applications, or news items, while PAGES are more often used to serve content that is not so time dependent. Both of these post types (yes a PAGE is a post type) are referred to as “post” when it comes to treating them in themes. The POST post type is the original content type. We will now take the content that was hard coded in the index.php file of the simple00 theme and serve it dynamically from WordPress.
Introduction to Template Tags
We will start by splitting the index.php file into 3 parts. Let’s move everything up to and including the opening <body> tag into a file called header.php, the closing </body> and </html> tags into footer.php, and the add the WordPress functions get_header() and get_footer() into the index.php file.
header.php
<!DOCTYPE html> <html> <head> <title>WordPress Simple Theme 01</title> </head> <body>
footer.php
</body> </html>
index.php
<?php get_header(); ?> <h1>Rendering WordPress Post Content</h1> <p>Below is content pulled from the <strong>WordPress</strong> database. The content in question is the same as was hardcoded in the <em>index.php</em> file of the <em>simple00</em> theme. </p> <p>We entered this content in <strong>WordPress</strong> using the <em>POST</em> post type. </p> <pre>HERE WILL BE THE DYNAMIC CONTENT</pre> <?php get_footer(); ?>
The included PHP snippets <?php get_header(); ?> and <?php get_footer(); ?> are called Template Tags. In the WordPress lingo Template Tags are WordPress functions that are included in template files to render – or help render – HTML in a dynamic way. There are several type of template tags. The most common are those such as <?php get_header(); ?> which cause HTML to be included into the output to the browser.
Browser Output
Not very exciting .. yet. But if you inspect the source of the page, you will see that the header and footer HTML is duly included.
[…] the WordPress .. Displaying Content article we introduced WordPress Template Tags, and showed how they are used in index.php to […]