Epic Alex | WordPress Tutorials

Effectively Highlight Your Post Edits

After writing a post and publishing it, it often becomes necessary to add to or alter something in the post. But how do you let your readers know what was added later, without those edits becoming lost in the rest of the post? The majority of times when this happens, is when someone writes something interesting in a comment, and you feel it is necessary to add it to your post.

The method below uses my new friend, Custom Fields. We will add some code to our single.php that will nicely style our edits.

If you are unfamiliar with Custom Fields, I suggest reading the codex entry.

Understanding The Custom Field Code

Unlike some of my other tutorials that use Custom Fields, this one will be using a different call to get_post_meta. I will instead be using get_post_custom_values, as this will allow us to add more than one edit to each post. get_post_custom_values($key) works by retrieving a list of all the ‘values’ associated with the ‘key’ defined as a parameter. It then stores these ‘values’ in an array.

The Code

We will be placing the code within the loop, just after . The basic code below gets all of our values, and then echoes them out:

1
2
3
4

<?php $my_edits = get_post_custom_values('Edit');
foreach ($my_edits as $key => $value) {
echo "<div class='post_edits'><strong>Edit:</strong>" . $value . "</div>";
} ?>

‘Edit’ is the ‘key’ that you add to your post when you want to add something, and you write your edit in the ‘value’ field.

Styling The Edits

Now we can add to our style.css to make our edits stand out.

1
2
3
4
5
6
7

.post_edits {
background: #E3FED3;
border: 2px dashed #338833;
color: #3B5F17;
margin-bottom: 5px;
padding: 5px;
}

The CSS above is a nice green, but play around with it until it fits into your own theme.

Extending The Code

We also need to make sure that if there are no edits that we don’t have anything displayed that will look out of place. For this, we can use an if statement to check if the ‘key’ is empty, as in my Default Custom Field Tutorial.

1
2
3
4
5
6
7

<?php $my_edits = get_post_custom_values('Edit');
if ($my_edits == '') {}
else {
foreach ($my_edits as $key => $value) {
echo "<div class='post_edits'><strong>Edit:</strong>" . $value . "</div>";
}
} ?>

This does the following:

1. Creates a variable that stores an array of custom fields with the value of ‘Edit’.
2. It then checks whether that variable is empty.
3. If it is empty then nothing will be done.
4. The else then says that if the $my_edits variable IS NOT empty (i.e. You’ve made an edit), then the div is displayed with the edit information.

See how creative you can be with this, and custom fields in general, the possibilities are endless!