A Nominate user recently contacted me asking how to modify the theme so that they could have custom fields in the post submission process. Initially I was skeptical but after some thought I realized this could be quite a powerful addition to the arsenal and so I worked out how to add a filter to the theme to allow you to include your own settings.
In this example I will show you how to add an image url into the theme and then display the image in the submitted post.
First things first we need to add a functions.php to the Nominate custom directory. You can read how to customise child themes (including Nominate) here. The reason for this, as opposed to modifying the built in functions.php, is that when it’s time to update the theme – you won’t lose your changes.
So once you have your custom functions.php, you can start adding code.
The following code will add custom fields to the submit post form. I have added comments that explain the different settings. If you’re familiar with WordPress custom theme functions it should be very obvious what is happening:
NOTE: You need to make sure this code is wrapped in php tags or it will not work.
function add_customSubmitFields ($fields) {
// set properties of value to store. You can create as many of these as you like
// name = the variable name (don't use spaces or punctuation besides _ or -)
// label = the value to use on the submit post form
$fields[] = array (
'name' => 'test_image',
'label' => 'Custom Image',
);
return $fields;
}
add_filter ('bm_submitFields', 'add_customSubmitFields');
Once you have added this you will have a working form. Couldn’t be simpler right? Next up, you need to display the content somehow. Since this is an image url I will display it if the value has been set. Again – there’s a lot of properties set that explains how things work:
NOTE: Be aware of data sanitization. You should always make sure user submitted data is cleaned up before it is used. In this case I am using WordPress built in function esc_url to make sure the image url is ok
function insert_customSubmitFields () {
// get the image value using the custom variable mentioned before
$image = bm_getSubmittedField ('test_image');
// make sure the image is set so that I don't try to display something htat doesn't exist
if (!empty ($image)) {
// display image (use esc_url to make sure the url is safe!)
echo '<img src="' . esc_url ($image) . '" />';
}
}
add_action ('bm_contentAfter', 'insert_customSubmitFields');
To save you some time you can download the file created for this tutorial here.
Elemental is a clean & powerful blog framework for WordPress packed with options for customizable layouts, typography, navigation, widgets, page templates and more.