Using Custom Fields to Enhance WordPress as a CMS

This is not a new trick, and I certainly did not invent it. It’s been used before, but when I went searching for this information, it was hard to find. In fact, I finally had to ask a friend who is much better at PHP than I am (I only recently learned to spell PHP) to help me.

Sometimes, you need things to NOT appear on a page unless something else appears on the page. For instance, you might not want ????. This is a pretty basic capability for most CMS systems, but I had never done it with WordPress on a page-by-page basis.

Here’s the scenario. I wanted to add a highlighted note in the subnavigation area of my WordPress theme, Evo4 CMS, and I wanted it to be tied to the content of the page it appeared on. I hadn’t used custom fields much, but it seemed to me that was the way to go. Here is an example of the code I wanted to appear below the subnavigation items on the pages:

<div class="sub-note">

<h5>Subnav Note Heading</h5>

<p>Sed do eiusmod tempor incididunt velit esse cillum dolore duis aute irure dolor.</p>

</div>

Pretty simple, right? I decided that, for greater flexibility, my clients would have to be responsible for the HTML formatting within the div, but I did not want them to have worry about the div itself (things can get ugly when someone forgets to close a div). In the WordPress backend, on the page on which I wanted the note to appear, I created a custom field named "subnavnote" and added the value (same as above, but without the div):

<h5>Subnav Note Heading</h5>

<p>Sed do eiusmod tempor incididunt velit esse cillum dolore duis aute irure dolor.</p>

On the page template in my theme (page.php), in the subnavigation column, I added the following:

<div class="sub-note">

<?php echo get_post_meta($post->ID, ’subnavnote’, true); ?>

</div>

Woohoo! That displayed the text from the custom field in the subnavigation area. But there was a problem: when I went to other pages, an empty "sub-note" div displayed (the CSS applied some padding and a background color to the div, which caused it to be visible even when empty). And that was NOT something to yell "woohoo": about.

I needed a way to make the div appear only if there was a value for "subnavnote." This was where Googling left me high and dry, as I didn’t know the right terms to use, or how to ask the question so that I found a usable answer. I have no doubt the answer was out there, but it remained outside my grasp.

After fiddling and failing with some PHP code snippets, I asked a friend who is a PHP coder for help. Here’s the solution she gave me:

<?php $subnavnote_value = get_post_meta($post->ID, ’subnavnote’, true); ?>

<?php echo ($subnavnote_value != ”) ? "<div class=’sub-note’>".$subnavnote_value."</div>" : ”; ?>

Basically, if there is no value for the custom field on a particular page, this code prevents the div that contains the custom field content from appearing. I would break it down and explain it if I was competent to do so, but I’m not. I can see how it works, however, and have adapted it to other similar circumstances, which greatly increases my ability to use custom fields. I hope this solution is similarly useful for you.

Link to original post

Avatar

Leave a Reply