I’ve been using this neat custom fields script that allows you to create a mini control panels in either posts or pages, field like elements to echo anywhere in a query…
<strong>Source: </strong>[[LINK href="http://wcdco.info/df"]]http://wcdco.info/df[[/LINK]]
In the preview image Steve displays a dropdown menu listing pre-defined fields … I tried to duplicate this functionality with no success.
<strong>Same question;</strong>
<em>“well, i’d like to use it like this:
var $seoFields = array(
array(
"name" => "color-change",
"title" => "Change the theme:",
"description" => "(Pick the color scheme you want to use)",
"options" => array( "Blue", "Red", "Black" ),
"type" => "dropdown",
"scope" => array( "post" ),
"capability" => "edit_posts"
));
but i don’t know how to save it. and when displaying it’s contents in the meta box, it only shows _mcf_Array.
i was thinking of exploding the array, to populate the dropdown but still, i wouldn’t know how to save it.”</em>
<strong>Developers Answer;</strong>
<em>
“As long as you’ve added a dropdown case to the switch ( $customField[ 'type' ] ), you should be fine. There’s no issue with saving it: when you submit the form, the select field’s value will be that of the selected option, and that’ll get saved in the meta field.”</em>
<strong>Goal;</strong>
I would like to create a field drop down type listing IE: numbers from 1-10 … when an author selects ‘10’ that field is stored in meta, then used in my theme.
<strong>Example:</strong> <?php echo get_post_meta($post->ID, '<strong>FIELD</strong>', true);?>
<strong>Original Code;</strong>
if ( !class_exists('myCustomFields') ) {
class myCustomFields {
/**
* @var string $prefix The prefix for storing custom fields in the postmeta table
*/
var $prefix = '_mcf_';
/**
* @var array $postTypes An array of public custom post types, plus the standard "post" and "page" - add the custom types you want to include here
*/
var $postTypes = array( "page", "post" );
/**
* @var array $customFields Defines the custom fields available
*/
var $customFields = array(
array(
"name" => "block-of-text",
"title" => "A block of text",
"description" => "",
"type" => "textarea",
"scope" => array( "page" ),
"capability" => "edit_pages"
),
array(
"name" => "short-text",
"title" => "A short bit of text",
"description" => "",
"type" => "text",
"scope" => array( "post" ),
"capability" => "edit_posts"
),
array(
"name" => "checkbox",
"title" => "Checkbox",
"description" => "",
"type" => "checkbox",
"scope" => array( "post", "page" ),
"capability" => "manage_options"
)
);
/**
* PHP 4 Compatible Constructor
*/
function myCustomFields() { $this->__construct(); }
/**
* PHP 5 Constructor
*/
function __construct() {
add_action( 'admin_menu', array( &$this, 'createCustomFields' ) );
add_action( 'save_post', array( &$this, 'saveCustomFields' ), 1, 2 );
// Comment this line out if you want to keep default custom fields meta box
add_action( 'do_meta_boxes', array( &$this, 'removeDefaultCustomFields' ), 10, 3 );
}
/**
* Remove the default Custom Fields meta box
*/
function removeDefaultCustomFields( $type, $context, $post ) {
foreach ( array( 'normal', 'advanced', 'side' ) as $context ) {
foreach ( $this->postTypes as $postType ) {
remove_meta_box( 'postcustom', $postType, $context );
}
}
}
/**
* Create the new Custom Fields meta box
*/
function createCustomFields() {
if ( function_exists( 'add_meta_box' ) ) {
foreach ( $this->postTypes as $postType ) {
add_meta_box( 'my-custom-fields', 'Custom Fields', array( &$this, 'displayCustomFields' ), $postType, 'normal', 'high' );
}
}
}
/**
* Display the new Custom Fields meta box
*/
function displayCustomFields() {
global $post;
?>
<div class="form-wrap">
<?php
wp_nonce_field( 'my-custom-fields', 'my-custom-fields_wpnonce', false, true );
foreach ( $this->customFields as $customField ) {
// Check scope
$scope = $customField[ 'scope' ];
$output = false;
foreach ( $scope as $scopeItem ) {
switch ( $scopeItem ) {
default: {
if ( $post->post_type == $scopeItem )
$output = true;
break;
}
}
if ( $output ) break;
}
// Check capability
if ( !current_user_can( $customField['capability'], $post->ID ) )
$output = false;
// Output if allowed
if ( $output ) { ?>
<div class="form-field form-required">
<?php
switch ( $customField[ 'type' ] ) {
case "checkbox": {
// Checkbox
echo '<label for="' . $this->prefix . $customField[ 'name' ] .'" style="display:inline;">' . $customField[ 'title' ] . '</label> ';
echo '<input type="checkbox" name="' . $this->prefix . $customField['name'] . '" id="' . $this->prefix . $customField['name'] . '" value="yes"';
if ( get_post_meta( $post->ID, $this->prefix . $customField['name'], true ) == "yes" )
echo ' checked="checked"';
echo '" style="width: auto;" />';
break;
}
case "textarea":
case "wysiwyg": {
// Text area
echo '<label for="' . $this->prefix . $customField[ 'name' ] .'">' . $customField[ 'title' ] . '</label>';
echo '<textarea name="' . $this->prefix . $customField[ 'name' ] . '" id="' . $this->prefix . $customField[ 'name' ] . '" columns="30" rows="3">' . htmlspecialchars( get_post_meta( $post->ID, $this->prefix . $customField[ 'name' ], true ) ) . '</textarea>';
// WYSIWYG
if ( $customField[ 'type' ] == "wysiwyg" ) { ?>
<script type="text/javascript">
jQuery( document ).ready( function() {
jQuery( "<?php echo $this->prefix . $customField[ 'name' ]; ?>" ).addClass( "mceEditor" );
if ( typeof( tinyMCE ) == "object" && typeof( tinyMCE.execCommand ) == "function" ) {
tinyMCE.execCommand( "mceAddControl", false, "<?php echo $this->prefix . $customField[ 'name' ]; ?>" );
}
});
</script>
<?php }
break;
}
default: {
// Plain text field
echo '<label for="' . $this->prefix . $customField[ 'name' ] .'">' . $customField[ 'title' ] . '</label>';
echo '<input type="text" name="' . $this->prefix . $customField[ 'name' ] . '" id="' . $this->prefix . $customField[ 'name' ] . '" value="' . htmlspecialchars( get_post_meta( $post->ID, $this->prefix . $customField[ 'name' ], true ) ) . '" />';
break;
}
}
?>
<?php if ( $customField[ 'description' ] ) echo '<p>' . $customField[ 'description' ] . '</p>'; ?>
</div>
<?php
}
} ?>
</div>
<?php
}
/**
* Save the new Custom Fields values
*/
function saveCustomFields( $post_id, $post ) {
if ( !isset( $_POST[ 'my-custom-fields_wpnonce' ] ) || !wp_verify_nonce( $_POST[ 'my-custom-fields_wpnonce' ], 'my-custom-fields' ) )
return;
if ( !current_user_can( 'edit_post', $post_id ) )
return;
if ( ! in_array( $post->post_type, $this->postTypes ) )
return;
foreach ( $this->customFields as $customField ) {
if ( current_user_can( $customField['capability'], $post_id ) ) {
if ( isset( $_POST[ $this->prefix . $customField['name'] ] ) && trim( $_POST[ $this->prefix . $customField['name'] ] ) ) {
$value = $_POST[ $this->prefix . $customField['name'] ];
// Auto-paragraphs for any WYSIWYG
if ( $customField['type'] == "wysiwyg" ) $value = wpautop( $value );
update_post_meta( $post_id, $this->prefix . $customField[ 'name' ], $value );
} else {
delete_post_meta( $post_id, $this->prefix . $customField[ 'name' ] );
}
}
}
}
} // End Class
} // End if class exists statement
// Instantiate the class
if ( class_exists('myCustomFields') ) {
$myCustomFields_var = new myCustomFields();
}
<em>Any suggestions would be much appreciated!</em>
Nick Parsons answers:
Add this code inside the switch statement that starts on line 104 -
case "select": {
echo '<label for="' . $this->prefix . $customField[ 'name' ] .'">' . $customField[ 'title' ] . '</label>';
echo '<select name="' . $this->prefix . $customField[ 'name' ] . '" id="' . $this->prefix . $customField[ 'name' ] . '">';
foreach( $customField[ 'options' ] as $option ){
$selected = ( get_post_meta( $post->ID, $this->prefix . $customField[ 'name' ], true ) == $option ) ? ' selected ="selected"' : '';
echo '<option value="' .$option. '"' .$selected. '">' .$option. '</option>';
}
echo '</select>';
break;
}
You can now define use 'select' as a valid type when defining meta fields in the $customFields array, adding an 'options' array to define possible values for the select element. Example:
array(
"name" => "select_name",
"title" => "Test Select Element",
"description" => "",
"type" => "select",
"scope" => array( "post" ),
"options" => array ("Option 1", "Option 2", "Option 3"),
"capability" => "edit_pages"
)
Jermaine Oppong answers:
lol was gonna paste similar code to Nick Parsons:
case "dropdown": {
// Dropdown
echo '<label for="' . $this->prefix . $customField[ 'name' ] .'" style="display:inline;">' . $customField[ 'title' ] . '</label> ';
echo '<select name="'. $this->prefix . $customField['name'] .'" id="' . $this->prefix . $customField[ 'name' ] . '">';
foreach ($customField['options'] as $key => $value){
$selected = '';
if (get_post_meta( $post->ID, $this->prefix . $customField['name'], true ) == $value) {
$selected = ' selected="selected" ';
}
echo '<option value="'. $value .'" '.$selected.'>'. $value .'</option>';
}
echo '</select>';
break;
}
You can paste this right before default: near the bottom of the code.
You can call this in the same way Nick Parsons has illustrated.
Baki Goxhaj answers:
Here goes the working code: (Everything tested on my local environment)
<strong>Grab the custom field:</strong> <em>(mind the prefix that is added the the custom filed by the script)</em>
<?php echo get_post_meta( $post->ID, '_mcf_select_name', true ); ?>
<strong>The custom fields class</strong>: (everything in place)
if ( !class_exists('myCustomFields') ) {
class myCustomFields {
/**
* @var string $prefix The prefix for storing custom fields in the postmeta table
*/
var $prefix = '_mcf_';
/**
* @var array $postTypes An array of public custom post types, plus the standard "post" and "page" - add the custom types you want to include here
*/
var $postTypes = array( "page", "post" );
/**
* @var array $customFields Defines the custom fields available
*/
var $customFields = array(
array(
"name" => "block-of-text",
"title" => "A block of text",
"description" => "",
"type" => "textarea",
"scope" => array( "page" ),
"capability" => "edit_pages"
),
array(
"name" => "short-text",
"title" => "A short bit of text",
"description" => "",
"type" => "text",
"scope" => array( "post" ),
"capability" => "edit_posts"
),
array(
"name" => "checkbox",
"title" => "Checkbox",
"description" => "",
"type" => "checkbox",
"scope" => array( "post", "page" ),
"capability" => "manage_options"
),
array(
"name" => "select_name",
"title" => "Test Select Element",
"description" => "",
"type" => "select",
"scope" => array( "post" ),
"options" => array ("Option 1", "Option 2", "Option 3"),
"capability" => "edit_pages"
)
);
/**
* PHP 4 Compatible Constructor
*/
function myCustomFields() { $this->__construct(); }
/**
* PHP 5 Constructor
*/
function __construct() {
add_action( 'admin_menu', array( &$this, 'createCustomFields' ) );
add_action( 'save_post', array( &$this, 'saveCustomFields' ), 1, 2 );
// Comment this line out if you want to keep default custom fields meta box
add_action( 'do_meta_boxes', array( &$this, 'removeDefaultCustomFields' ), 10, 3 );
}
/**
* Remove the default Custom Fields meta box
*/
function removeDefaultCustomFields( $type, $context, $post ) {
foreach ( array( 'normal', 'advanced', 'side' ) as $context ) {
foreach ( $this->postTypes as $postType ) {
remove_meta_box( 'postcustom', $postType, $context );
}
}
}
/**
* Create the new Custom Fields meta box
*/
function createCustomFields() {
if ( function_exists( 'add_meta_box' ) ) {
foreach ( $this->postTypes as $postType ) {
add_meta_box( 'my-custom-fields', 'Custom Fields', array( &$this, 'displayCustomFields' ), $postType, 'normal', 'high' );
}
}
}
/**
* Display the new Custom Fields meta box
*/
function displayCustomFields() {
global $post;
?>
<div class="form-wrap">
<?php
wp_nonce_field( 'my-custom-fields', 'my-custom-fields_wpnonce', false, true );
foreach ( $this->customFields as $customField ) {
// Check scope
$scope = $customField[ 'scope' ];
$output = false;
foreach ( $scope as $scopeItem ) {
switch ( $scopeItem ) {
default: {
if ( $post->post_type == $scopeItem )
$output = true;
break;
}
}
if ( $output ) break;
}
// Check capability
if ( !current_user_can( $customField['capability'], $post->ID ) )
$output = false;
// Output if allowed
if ( $output ) { ?>
<div class="form-field form-required">
<?php
switch ( $customField[ 'type' ] ) {
case "checkbox": {
// Checkbox
echo '<label for="' . $this->prefix . $customField[ 'name' ] .'" style="display:inline;">' . $customField[ 'title' ] . '</label> ';
echo '<input type="checkbox" name="' . $this->prefix . $customField['name'] . '" id="' . $this->prefix . $customField['name'] . '" value="yes"';
if ( get_post_meta( $post->ID, $this->prefix . $customField['name'], true ) == "yes" )
echo ' checked="checked"';
echo '" style="width: auto;" />';
break;
}
case "textarea":
case "wysiwyg": {
// Text area
echo '<label for="' . $this->prefix . $customField[ 'name' ] .'">' . $customField[ 'title' ] . '</label>';
echo '<textarea name="' . $this->prefix . $customField[ 'name' ] . '" id="' . $this->prefix . $customField[ 'name' ] . '" columns="30" rows="3">' . htmlspecialchars( get_post_meta( $post->ID, $this->prefix . $customField[ 'name' ], true ) ) . '</textarea>';
// WYSIWYG
if ( $customField[ 'type' ] == "wysiwyg" ) { ?>
<script type="text/javascript">
jQuery( document ).ready( function() {
jQuery( "<?php echo $this->prefix . $customField[ 'name' ]; ?>" ).addClass( "mceEditor" );
if ( typeof( tinyMCE ) == "object" && typeof( tinyMCE.execCommand ) == "function" ) {
tinyMCE.execCommand( "mceAddControl", false, "<?php echo $this->prefix . $customField[ 'name' ]; ?>" );
}
});
</script>
<?php }
break;
}
case "select": {
echo '<label for="' . $this->prefix . $customField[ 'name' ] .'">' . $customField[ 'title' ] . '</label>';
echo '<select name="' . $this->prefix . $customField[ 'name' ] . '" id="' . $this->prefix . $customField[ 'name' ] . '">';
foreach( $customField[ 'options' ] as $option ) :
$selected = ( get_post_meta( $post->ID, $this->prefix . $customField[ 'name' ], true ) == $option ) ? ' selected ="selected"' : '';
echo '<option value="' .$option. '"' .$selected. '">' .$option. '</option>';
endforeach;
echo '</select>';
break;
}
default: {
// Plain text field
echo '<label for="' . $this->prefix . $customField[ 'name' ] .'">' . $customField[ 'title' ] . '</label>';
echo '<input type="text" name="' . $this->prefix . $customField[ 'name' ] . '" id="' . $this->prefix . $customField[ 'name' ] . '" value="' . htmlspecialchars( get_post_meta( $post->ID, $this->prefix . $customField[ 'name' ], true ) ) . '" />';
break;
}
}
?>
<?php if ( $customField[ 'description' ] ) echo '<p>' . $customField[ 'description' ] . '</p>'; ?>
</div>
<?php
}
} ?>
</div>
<?php
}
/**
* Save the new Custom Fields values
*/
function saveCustomFields( $post_id, $post ) {
if ( !isset( $_POST[ 'my-custom-fields_wpnonce' ] ) || !wp_verify_nonce( $_POST[ 'my-custom-fields_wpnonce' ], 'my-custom-fields' ) )
return;
if ( !current_user_can( 'edit_post', $post_id ) )
return;
if ( ! in_array( $post->post_type, $this->postTypes ) )
return;
foreach ( $this->customFields as $customField ) {
if ( current_user_can( $customField['capability'], $post_id ) ) {
if ( isset( $_POST[ $this->prefix . $customField['name'] ] ) && trim( $_POST[ $this->prefix . $customField['name'] ] ) ) {
$value = $_POST[ $this->prefix . $customField['name'] ];
// Auto-paragraphs for any WYSIWYG
if ( $customField['type'] == "wysiwyg" ) $value = wpautop( $value );
update_post_meta( $post_id, $this->prefix . $customField[ 'name' ], $value );
} else {
delete_post_meta( $post_id, $this->prefix . $customField[ 'name' ] );
}
}
}
}
} // End Class
} // End if class exists statement
// Instantiate the class
if ( class_exists('myCustomFields') ) {
$myCustomFields_var = new myCustomFields();
}
<em>PS: Basically Nick's answer above, but with everything in place.</em>