I'd like to have a custom field interface show up only when a certain template is assigned to a particular WordPress page.
Any ideas?
asked May 24, 2011 at 15:03
-
If it doesn't need to be 'live' (i.e. changing the page template doesn't need to make the metabox appear / disappear immediately) see this related question: wordpress.stackexchange.com/questions/48611/…– Stephen HarrisCommented Apr 11, 2012 at 10:57
-
@StephenHarris Thanks for the comment. I wound up going with the WPAlchemy MetaBox class, which includes a "per template" option in the setup.– Jonathan WoldCommented Apr 11, 2012 at 14:32
Add a comment
|
2 Answers
The best way to approach this situation is via JavaScript. That way, whenever the selected value changes, you can instantly hide/show the related metabox.
Use wp_enqueue_script() in functions.php to load a custom JavaScript file in the admin area:
add_action('admin_enqueue_scripts', 'my_admin_script');
function my_admin_script()
{
wp_enqueue_script('my-admin', get_bloginfo('template_url').'/my-admin.js', array('jquery'));
}
The script itself, which requires jQuery, simply hides or shows a metabox based on the selected value in the page template dropdown list. In this example, I'm only showing the metabox for post thumbnails in case the default page template is selected:
(function($){
$(document).ready(function() {
var $page_template = $('#page_template')
,$metabox = $('#postimagediv'); // For example
$page_template.change(function() {
if ($(this).val() == 'default') {
$metabox.show();
} else {
$metabox.hide();
}
}).change();
});
})(jQuery);
And, just for fun, here's a shorter, less verbose, version of the same script:
(function($){
$(function() {
$('#page_template').change(function() {
$('#postimagediv').toggle($(this).val() == 'default');
}).change();
});
})(jQuery);
-
Wow, thank you! I'll be giving this a test soon and will report back accordingly. Commented May 26, 2011 at 15:11
-
So awesome...this is just what I needed. Worked perfect for me. Thank you!!!– RossCommented Jun 14, 2011 at 21:14
-
Sorry but I'm a real beginner in javascript and I know the stuff which is there is what I need, but it seems I'm not able to do things in the correct way...So I'm not sure to understand what I've to change in the javascript file.. Is it possible to have more explanation for a nooby like me? ;)– user12082Commented Jan 15, 2012 at 13:26
Rather than rendering the metabox only to hide it with jQuery you can use this. The only difference being that the hiding/showing of the metabox requires selecting 'Update' after changing the drop-down field.
function add_meta_box() {
global $post;
if(!empty($post)) {
$pageTemplate = get_post_meta($post->ID, '_wp_page_template', true);
if($pageTemplate == 'your-page-template-here.php' ) {
add_meta_box( $id, $title, $callback, 'page', $context, $priority, $callback_args );
}
}
}
add_action( 'add_meta_boxes', 'add_meta_box' );
Just update lines 6 and 7 as desired.
