Custom fields WordPress

Sean H answers:

Hi borzoid,

Not sure if this is what you're looking for but I created my own simple plugin which adds a new admin page called "Custom Fields". In there I created a textarea. I'll also dig out the image upload code for you if that's what you need. But here's my plugin anyway.

Copy this code into a file called custom-page.php, and put it into a folder called "custom-page", INSIDE your plugins folder. Then visit the plugins page and activate it.


<?php
/*
Plugin Name: Custom Page
Plugin URI:
Description: Custom Page. <a href="admin.php?page=custom-page">Visit page</a>
Author:
Version: 1.0
Author URI:
*/

//add plugin page in menu
add_action('admin_menu', 'custom_page_menu');
function custom_page_menu() {
add_menu_page('Custom Page', 'Custom Page', 'publish_posts', 'custom-page', 'custom_page_show');
}


function custom_page_show() {

$current_user = wp_get_current_user();
$user_id = $current_user->ID;

// update user properties
if (isset($_POST['submit'])) {
update_user_meta( $user_id, 'about_me', ( isset($_POST['about_me']) ? $_POST['about_me'] : '' ) );
}

$user = get_userdata( $user_id );
?>

<div class="wrap" id="custom-page">

<h2>Custom Page</h2>

<form action="" method="POST">
<table class="form-table">
<tr>
<td>Text Area Field: </td>
<td><textarea class="text-area" id="about_me" name="about_me"><?php echo $user->about_me; ?></textarea></td>
</tr>
</table>

<input type="submit" name="submit" value="Save Changes" class="button-primary"/>
</form>

</div>

<?php

}

?>


Let me know if this is what you needed, and I'll code the rest for you.

All the best
Sean

---

Arnav Joy answers:

so here is my answer for the meta boxes

now create a js file and named it as custom-js.js , place it in js folder of your theme.

put following code into custom-js.js

jQuery(function(jQuery) {



jQuery('.custom_upload_image_button').click(function() {

formfield = jQuery(this).siblings('.custom_upload_image');

preview = jQuery(this).siblings('.custom_preview_image');

tb_show('', 'media-upload.php?type=image&TB_iframe=true');

window.send_to_editor = function(html) {

imgurl = jQuery('img',html).attr('src');

classes = jQuery('img', html).attr('class');

id = classes.replace(/(.*?)wp-image-/, '');

formfield.val(id);

preview.attr('src', imgurl);

preview.attr('width', "100");

preview.attr('height', "100");

tb_remove();

}

return false;

});



jQuery('.custom_clear_image_button').click(function() {

var defaultImage = jQuery(this).parent().siblings('.custom_default_image').text();

jQuery(this).parent().siblings('.custom_upload_image').val('');

jQuery(this).parent().siblings('.custom_preview_image').attr('src', defaultImage);

return false;

});



});



now in functions.php place following code:-


wp_enqueue_script('custom-js', get_template_directory_uri().'/js/custom-js.js');



function add_custom_meta_box() {

add_meta_box(

'custom_meta_box', // $id

'Custom Fields', // $title

'show_custom_meta_box', // $callback

'page', // $page

'normal', // $context

'high'); // $priority

}

add_action('add_meta_boxes', 'add_custom_meta_box');

$prefix = 'custom_';
$custom_meta_fields = array(
array(
'label' => 'Image1',
'name' => 'Image1',
'desc' => 'A description for the field.',
'id' => $prefix.'image1',
'type' => 'image'
)

,
array(
'label' => 'Description',
'name' => 'desc',
'desc' => 'A description for the field.',
'id' => $prefix.'desc',
'type' => 'textarea'
)

);

function show_custom_meta_box() {
global $custom_meta_fields, $post;
// Use nonce for verification
echo '<input type="hidden" name="custom_meta_box_nonce" value="'.wp_create_nonce(basename(__FILE__)).'" />';

// Begin the field table and loop
echo '<table class="form-table">';
foreach ($custom_meta_fields as $field) {
// get value of this field if it exists for this post
$meta = get_post_meta($post->ID, $field['id'], true);
// begin a table row with
echo '<tr>
<th><label for="'.$field['id'].'">'.$field['label'].'</label></th>
<td>';
switch($field['type']) {
case 'image':
$image = get_template_directory_uri().'/images/image.png';
echo '<span class="custom_default_image" style="display:none">'.$image.'</span>';
if ($meta) { $image = wp_get_attachment_image_src($meta, 'medium'); $image = $image[0]; }
echo '<input name="'.$field['id'].'" type="hidden" class="custom_upload_image" value="'.$meta.'" />
<img src="'.$image.'" class="custom_preview_image" alt="" width="100" height="100" /><br />
<input class="custom_upload_image_button button" type="button" value="Choose Image" />
<small> <a href="#" class="custom_clear_image_button">Remove Image</a></small>
<br clear="all" /><span class="description">'.$field['desc'].'';
break;

case 'textarea':
echo '<textarea name="'.$field['id'].'" id="'.$field['id'].'" cols="60" rows="4">'.$meta.'</textarea>
<br /><span class="description">'.$field['desc'].'</span>';
break;
} //end switch
echo '</td></tr>';
} // end foreach
echo '</table>'; // end table


}


function save_custom_meta($post_id) {
global $custom_meta_fields;

// verify nonce
if (!wp_verify_nonce($_POST['custom_meta_box_nonce'], basename(__FILE__)))
return $post_id;
// check autosave
if (defined('DOING_AUTOSAVE') && DOING_AUTOSAVE)
return $post_id;
// check permissions
if ('page' == $_POST['post_type']) {
if (!current_user_can('edit_page', $post_id))
return $post_id;
} elseif (!current_user_can('edit_post', $post_id)) {
return $post_id;
}

// loop through fields and save the data
foreach ($custom_meta_fields as $field) {
$old = get_post_meta($post_id, $field['id'], true);
$new = $_POST[$field['id']];
if ($new && $new != $old) {
update_post_meta($post_id, $field['id'], $new);
} elseif ('' == $new && $old) {
delete_post_meta($post_id, $field['id'], $old);
}
} // end foreach
}
add_action('save_post', 'save_custom_meta');




now in page.php get the values as ..


<?php
$imgID1 = get_post_meta(get_the_ID(),'custom_image1',true);

if(!empty( $imgID1)) {
$imgData1 = get_post($imgID1, ARRAY_A);
$imgSRC = $imgData1['guid'];
}

else
$imgSRC = get_bloginfo('template_url').'/images/default.jpg';

$custom_desc = get_post_meta(get_the_ID(),'custom_desc',true);
if(empty( $custom_desc))
$custom_desc = 'Put default message here';

?>

let me know if you have any problem in implementing it.


---

---

---

---