Join the social network of Tech Nerds, increase skill rank, get work, manage projects...
 
  • How to add Custom Metabox in a particular page in Wordpress?

    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 482
    Comment on it

    Hello readers, In this tutorial I will guide you to "How to add Custom Metabox in a particular page in Wordpress."

     

    In WordPress, If you want to add or save some extra field in a post, custom post type or in the page. So basically we can make a meta-box for this. We can also create our custom meta box for save extra field related to a particular post, page or custom post.

     

    Normally if we can create a custom meta-box for the post it will appear all the post. But in case you want the meta-box to appear in a specific post or page then you need to do some minor changes in your custom meta-box code.

     

    Below is the default code of Meta-box for a background image that appears all the pages.

     

    /*
    * Custom Metabox for Page Backgroung Image
    */
    
    add_action( 'admin_init', 'background_metabox' );
    function background_metabox()
    {
    	add_meta_box( 'caption_meta_box',
    		'Page Backgroung Image Metabox',
    		'background_review_meta_box',
    		'page', 'normal', 'high'
    	);    
    }
    
    //Add custom post meta boxes
    function background_review_meta_box( $post ) {    
        $background_caption = esc_html( get_post_meta( $post->ID, 'background_caption', true ) );
        ?>
        <table style="width:100%;">
    		<tr>
    		    <td style="width: 20%">Background Image</td>
    		    <td style="width: 40%">
    		    	<input type="text" size="70" name="background_caption" placeholder="Background Image" value="<?php echo $background_caption; ?>">
    		    </td>
    		</tr>
        </table>
        <?php
    }
    
    // Save custom post meta values
    add_action( 'save_post', 'background_metabox_fields', 10, 2 );
    function background_metabox_fields( $caption_metabox_id )
    {
    	if ( isset( $_POST['background_caption'] ) )	{
    		update_post_meta( $caption_metabox_id, 'background_caption', $_POST['background_caption'] );
    	}
    }

     

    In below, Heading Meta-box will appear only in home page. In this code we can use the particular page ID which we want custom meta-box and compare with post ID, if post->ID and frontpage->ID are same, then the meta-box will appear in front page (home page). I use this code in my recent project.

     

    /*
    * Custom Image Heading Box
    */
    function only_home_settings() {
       // only add this meta box to the page selected as front page:
       global $post;
       $frontpage_id = get_option('page_on_front');
       if($post->ID == $frontpage_id):
          add_meta_box('Home', 'Home:', 'only_home_form', 'page', 'side', 'core');
       endif;
    }
    // other meta box bits (form function and save function)
    add_action( 'add_meta_boxes', 'only_home_settings' ); 
    
    //Add custom meta boxes in page
    function only_home_form( $post ) {    
        $heading_caption = esc_html( get_post_meta( $post->ID, 'heading_caption', true ) );
        ?>
         <table style="width:100%;">
    		<tr>
    		    <td style="width: 20%">Heading Caption</td>
    		    <td style="width: 40%">
    		    	<input type="text" size="70" name="heading_caption" placeholder="Heading Caption" value="<?php echo $heading_caption; ?>">
    		    </td>
    		</tr>
        </table>
         <?php
    }
    
    // Save custom post meta values
    add_action( 'save_post', 'heading_metabox_fields', 10, 2 );
    function heading_metabox_fields( $caption_metabox_id )
    {
    	if ( isset( $_POST['heading_caption'] ) )	{
    		update_post_meta( $caption_metabox_id, 'heading_caption', $_POST['heading_caption'] );
    	}
    }

     

    I hope it helps you. Thankyou!!

     

 0 Comment(s)

Sign In
                           OR                           
                           OR                           
Register

Sign up using

                           OR                           
Forgot Password
Fill out the form below and instructions to reset your password will be emailed to you:
Reset Password
Fill out the form below and reset your password: