Skip to content

Instantly share code, notes, and snippets.

@accessomnath
Created August 12, 2017 14:32
Show Gist options
  • Save accessomnath/51d157ba62e1a3e4f549f43627876eac to your computer and use it in GitHub Desktop.
Save accessomnath/51d157ba62e1a3e4f549f43627876eac to your computer and use it in GitHub Desktop.
Adding two extra image field in cpt in wordpress
<?php
//init the meta box
add_action('after_setup_theme', 'custom_postimage_setup');
function custom_postimage_setup()
{
add_action('add_meta_boxes', 'custom_postimage_meta_box');
add_action('save_post', 'custom_postimage_meta_box_save');
}
function custom_postimage_meta_box()
{
//on which post types should the box appear?
$post_types = array('slider');
foreach ($post_types as $pt) {
add_meta_box('custom_postimage_meta_box', __('More Featured Images', 'bsale'), 'custom_postimage_meta_box_func', $pt, 'side', 'low');
}
}
function custom_postimage_meta_box_func($post)
{
//an array with all the images (ba meta key). The same array has to be in custom_postimage_meta_box_save($post_id) as well.
$meta_keys = array('second_featured_image', 'third_featured_image');
foreach ($meta_keys as $meta_key) {
$image_meta_val = get_post_meta($post->ID, $meta_key, true);
?>
<div class="custom_postimage_wrapper" id="<?php echo $meta_key; ?>_wrapper" style="margin-bottom:20px;">
<img src="<?php echo($image_meta_val != '' ? wp_get_attachment_image_src($image_meta_val)[0] : ''); ?>"
style="width:100%;display: <?php echo($image_meta_val != '' ? 'block' : 'none'); ?>" alt="">
<a class="addimage button"
onclick="custom_postimage_add_image('<?php echo $meta_key; ?>');"><?php _e('add image', 'yourdomain'); ?></a><br>
<a class="removeimage"
style="color:#a00;cursor:pointer;display: <?php echo($image_meta_val != '' ? 'block' : 'none'); ?>"
onclick="custom_postimage_remove_image('<?php echo $meta_key; ?>');"><?php _e('remove image', 'yourdomain'); ?></a>
<input type="hidden" name="<?php echo $meta_key; ?>" id="<?php echo $meta_key; ?>"
value="<?php echo $image_meta_val; ?>"/>
</div>
<?php } ?>
<script>
function custom_postimage_add_image(key) {
var $wrapper = jQuery('#' + key + '_wrapper');
custom_postimage_uploader = wp.media.frames.file_frame = wp.media({
title: '<?php _e('select image', 'yourdomain'); ?>',
button: {
text: '<?php _e('select image', 'yourdomain'); ?>'
},
multiple: false
});
custom_postimage_uploader.on('select', function () {
var attachment = custom_postimage_uploader.state().get('selection').first().toJSON();
var img_url = attachment['url'];
var img_id = attachment['id'];
$wrapper.find('input#' + key).val(img_id);
$wrapper.find('img').attr('src', img_url);
$wrapper.find('img').show();
$wrapper.find('a.removeimage').show();
});
custom_postimage_uploader.on('open', function () {
var selection = custom_postimage_uploader.state().get('selection');
var selected = $wrapper.find('input#' + key).val();
if (selected) {
selection.add(wp.media.attachment(selected));
}
});
custom_postimage_uploader.open();
return false;
}
function custom_postimage_remove_image(key) {
var $wrapper = jQuery('#' + key + '_wrapper');
$wrapper.find('input#' + key).val('');
$wrapper.find('img').hide();
$wrapper.find('a.removeimage').hide();
return false;
}
</script>
<?php
wp_nonce_field('custom_postimage_meta_box', 'custom_postimage_meta_box_nonce');
}
function custom_postimage_meta_box_save($post_id)
{
if (!current_user_can('edit_posts', $post_id)) {
return 'not permitted';
}
if (isset($_POST['custom_postimage_meta_box_nonce']) && wp_verify_nonce($_POST['custom_postimage_meta_box_nonce'], 'custom_postimage_meta_box')) {
//same array as in custom_postimage_meta_box_func($post)
$meta_keys = array('second_featured_image', 'third_featured_image');
foreach ($meta_keys as $meta_key) {
if (isset($_POST[$meta_key]) && intval($_POST[$meta_key]) != '') {
update_post_meta($post_id, $meta_key, intval($_POST[$meta_key]));
} else {
update_post_meta($post_id, $meta_key, '');
}
}
}
}
?>
//calling them.....
<?php echo wp_get_attachment_image(get_post_meta($post->ID, 'second_featured_image', true), 'medium_large'); ?>
<?php echo wp_get_attachment_image(get_post_meta($post->ID, 'third_featured_image', true), 'medium_large'); ?>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment