I’m making a Template Portfolio for wordpress , I’m having some difficulty with the addition of a Metabox in the backend of a custom page .
I have a page ” About Me” with the progressbar to show the skills , and I would add in bakend a Metabox to change the percentage of the progressbar , now I could see the Metabox on the backend of all pages and through jquery i hide it if the address of the page is not as expected , there is any way to make the display more generic and associate the Metabox to a custom page template ?
this is the code that i have in my function.php, it works well , but I would make it less specific
<?php
add_action('add_meta_boxes', 'box_percentuale');
function box_percentuale() {
add_meta_box(
'percentuale',
'Mdifica progress bar',
'box_percentuale_style',
'page'
);
}
function box_percentuale_style($post) {
?>
<div>
<h4>Percentuale skills</h4>
<label>HTML</label><input type="number" name="html" value="<?php echo get_post_meta($post->ID, 'html', true); ?>">
<label>CSS</label><input type="number" name="css" value="<?php echo get_post_meta($post->ID, 'css', true); ?>">
<label>JQUERY</label><input type="number" name="jquery" value="<?php echo get_post_meta($post->ID, 'jquery', true); ?>">
<label>WORDPRESS</label><input type="number" name="wordpress" value="<?php echo get_post_meta($post->ID, 'wordpress', true); ?>">
<label>ILLUSTRATOR</label><input type="number" name="illustrator" value="<?php echo get_post_meta($post->ID, 'illustrator', true); ?>">
<label>PHOTOSHOP</label><input type="number" name="photoshop" value="<?php echo get_post_meta($post->ID, 'photoshop', true); ?>">
</div>
<script>
jQuery(document).ready(function($) {
var url = window.location.href;
var urlPagina = 'http://localhost/wordpress/wp-admin/post.php?post=34&action=edit';
$('#percentuale').css('display', 'none');
if (url == urlPagina) {
$('#percentuale').show();
};
});
</script>
<?php
}
add_action('save_post', 'slava_percentuale');
function slava_percentuale($post_id)
{
if(isset($_POST['yiw_progetti_link'])) {
update_post_meta($post_id, 'html', intval($_POST['html']));
update_post_meta($post_id, 'css', intval($_POST['css']));
update_post_meta($post_id, 'jquery', intval($_POST['jquery']));
update_post_meta($post_id, 'wordpress', intval($_POST['wordpress']));
update_post_meta($post_id, 'illustrator', intval($_POST['illustrator']));
update_post_meta($post_id, 'photoshop', intval($_POST['photoshop']));
}
}
?>
You can achieve that using something like:
Quick note: if you go to a page with a default page template and select “About” from the templates dropdown, you’ll have to first save your page in order for the meta box to appear (ie. it will not appear the moment you change the dropdown). I don’t believe this will be an issue in your case, but I thought it’s worth mentioning.