Adding Custom Fields to Your Template File

If you followed along in theprevious sections and added the mood Custom Field to your own site, notice that the data doesn't appear on your site the way it does on Lisa's. To get the data to display properly, you must open the template files and dig into the code a little bit. If the idea of digging into the code of your template files intimidates you, you can put this section aside and read up on WordPress themes, template files, and template tags in Book VI.

You can add Custom Fields, in several ways, to your templates in order to display the output of the fields you've set; we think the easiest way involves using the get_post_meta(); template tag function, which looks like this:

<?php $key=“NAME”; echo get_post_meta($post->ID, $key, true); ?>

Here's how that function breaks down:

• <?php: Part of the functions begins PHP. (Every template tag or function needs to first start PHP with <?php. You can read more about basic PHP in Book II, Chapter 3.)
• $key=“NAME”;: Defines the name of the key that you want to appear. You define the Name when you add the Custom Field to your post.
• echo get_post_meta: Grabs the Custom Field data and displays it on your site.
• $post->ID,: A parameter of the get_post_meta function that dynamically defines the specific ID of the post being displayed so that WordPress knows which metadata to display.
• $key,: A parameter of the get_post_meta function that gets the value of the Custom Field based on the name, as defined in the $key=“NAME”; setting earlier in the code string.
• true);: A parameter of the get_post_meta function that tells WordPress to return a single result, rather than multiple results. (By default, this parameter is set to true; typically, don't change it unless you're using multiple definitions in the Value setting of your Custom Field.)
• ?>: Ends the PHP function.

Based on the preceding code, to make our mood Custom Field example, you define the key name as mood (replace the NAME in the preceding code with the word mood); it looks like this:

<?php $key="mood"; echo get_post_meta($post->ID, $key, true); ?>

The part of the functions that says $key=“mood”; tells WordPress to return the Value for the Custom Field with the Name field of mood.

Entering the code in the template file

We use Lisa's mood Custom Field as the example here. When you're done with these steps, WordPress displays your current mood at the bottom of the posts to which you've added the mood Custom Field. Keep in mind that this example is just one type of Custom Field that you can add to your posts (and it's an easy one for the purposes of introducing you to the concept).

If you're ready to give it a go, then you're in luck because you can follow these steps to add the template tag, along with a little HTML code to make it look nice, to your theme (these steps assume that you've already added the mood Custom Field to your blog post and have assigned a Value to it):

1. Log in to your WordPress Dashboard.
2. Click Editor in the Appearances drop-down list.

   The Edit Themes page loads in the Dashboard, as shown in Figure 5-5.

3. Locate the template files for the Twenty Ten theme.

   The available templates are listed on the right side of the Edit Themes page, as shown in Figure 5-5.

   Figure 5-5: The Edit Themes page in the Dashboard.

   

4. Click Single Post in the list of templates.

   The Single Post (single.php) file opens in the text editor on the left side of the screen, where you can edit the template file.

5. Scroll down and locate the template tag that looks like this: <?php the_content() ?>.
6. On the new line underneath the preceding one, type: <p><strong>My Current Mood is:.

   <p> and <strong> open the HTML tags for paragraph and bold text, respectively; followed by the words to display in your template (My Current Mood is:).

7. Type the code that we discuss in the preceding section.

   <?php $key="mood"; echo get_post_meta($post->ID, $key, true); ?>

8. Type </strong></p>.

   This code closes the HTML tags you opened in Step 6.

9. Click the Update File button.

   Located at the bottom of the Edit Themes page, this step saves the changes you made to the Single Post (single.php) file and reloads the page with a message that says your changes have been successfully saved.

10. View your post on your site to see your Custom Field data displayed.

    The data should look just like the “My Current Mood is: Happy” shown in Figure 5-3.

The entire code, put together, should look like this in your template:

<p><strong>My Current Mood is: <?php $key="mood"; echo get_post_meta($post->ID,
    $key, true); ?></strong></p>

You have to add this code for the mood Custom Field only one time; after you add the template function code to your template for the mood Custom Field, you can define your current mood in every post you publish to your site by using the Custom Fields interface.

Getting WordPress to check for your Custom Field

The previous sections show you how to add the necessary code to your template file to display your Custom Field; however, what if you want to publish a post on which you don't want the mood Custom Field to appear? If you leave your template file as you set it up by following the steps in the previous sections, even if you don't add the mood Custom Field, your blog post displays My Current Mood is: — without a mood because you didn't define one.

But you can easily make WordPress check first to see whether the Custom Field is added. If it finds the Custom Field, WordPress displays your mood; if it doesn't find the Custom Field, then WordPress doesn't display anything.

If you followed along in the previous sections, the code in your template looks like this:

<p><strong>My Current Mood is: <?php $key="mood"; echo get_post_meta($post->ID,
    $key, true); ?></strong></p>

To make WordPress check to see whether the mood Custom Field exists, add this code to the line above your existing code:

<?php if ( get_post_meta($post->ID, 'mood', true) ) : ?>

Then add this line of code to the line below your existing code:

<?php endif; ?>

Put together, the lines of code in your template should look like this:

<?php if ( get_post_meta($post->ID, 'mood', true) ) : ?>
<p><strong>My Current Mood is: <?php $key="mood"; echo get_post_meta($post->ID,
    $key, true); ?></strong></p>
<?php endif; ?>

The first line is an IF statement and, basically, asks the question: Does the mood metadata exist for this post? If it does, the data gets displayed. If it doesn't, then WordPress skips over the code, ignoring it completely so that nothing gets displayed for the mood Custom Field. The final line of code simply puts an end to the IF question. Refer to the “IF, ELSE” sidebar, in this chapter, to see some everyday situations that explain the IF question. Apply this statement to the code you just added to your template and you get: IF the mood Custom Field exists, then WordPress will display it, or ELSE it won't.