WordPress is well known for its great powerful customization feature. Whenever you feel something is required, you can easily achieve that in many ways such as:

  • WordPress plugins
  • Adding functions
  • Editing previously created functions.

featured-post

Here we are going to learn how to add a featured posts section or featured content in your WordPress. Featured contents are used to highlight some content to your visitors. Sometimes it is mandatory to display some important posts first to your audience. So in this tutorial, we’ll learn to make featured posts section.

Add a featured posts section

There is a simple step by step procedure to follow.

Before we proceed let’s take a quick look at what we will need:

WordPress: Yes, an obvious one – you’ll need it installed either locally or on your web server.

How to install WordPress you can read here.

WordPress Theme: You can use any theme which you like the most but here we are using our theme ‘Bharat‘ a simple, beautiful and responsive blog theme.

mythemeshop-black-friday1

There are 3 steps for this procedure.

  1. Creating a checkbox (metabox) in post/page admin area.
  2. Save meta box value.
  3. Display the featured posts on the frontend.

Step 1- Creating a check-box

To add a checkbox to pages/posts edit screen add the following function to your theme’s functions.php file.

<?php function sm_custom_meta() {
    add_meta_box( 'sm_meta', __( 'Featured Posts', 'sm-textdomain' ), 'sm_meta_callback', 'post' );
}
function sm_meta_callback( $post ) {
    $featured = get_post_meta( $post->ID );
    ?>
 
	<p>
    <div class="sm-row-content">
        <label for="meta-checkbox">
            <input type="checkbox" name="meta-checkbox" id="meta-checkbox" value="yes" <?php if ( isset ( $featured['meta-checkbox'] ) ) checked( $featured['meta-checkbox'][0], 'yes' ); ?> />
            <?php _e( 'Featured this post', 'sm-textdomain' )?>
        </label>
        
    </div>
</p>
 
    <?php
}
add_action( 'add_meta_boxes', 'sm_custom_meta' );
?>

After adding this code you will find a checkbox field in your post admin area as shown in the image below:

featured post featured content in wordpress

You just have to enable this checkbox.

Step 2 – Save meta box value

We have done creating a check box in post/page edit screen. Now it is the time to save the value of the checkbox weather checkbox enabled or not.  Now we will create a function to save or update the checkbox value. Add

Add the following code to your function.php file. This code will go just below the above code we created earlier.

<?php 
/**
 * Saves the custom meta input
 */
function sm_meta_save( $post_id ) {
 
    // Checks save status
    $is_autosave = wp_is_post_autosave( $post_id );
    $is_revision = wp_is_post_revision( $post_id );
    $is_valid_nonce = ( isset( $_POST[ 'sm_nonce' ] ) && wp_verify_nonce( $_POST[ 'sm_nonce' ], basename( __FILE__ ) ) ) ? 'true' : 'false';
 
    // Exits script depending on save status
    if ( $is_autosave || $is_revision || !$is_valid_nonce ) {
        return;
    }
 
 // Checks for input and saves
if( isset( $_POST[ 'meta-checkbox' ] ) ) {
    update_post_meta( $post_id, 'meta-checkbox', 'yes' );
} else {
    update_post_meta( $post_id, 'meta-checkbox', '' );
}
 
}
add_action( 'save_post', 'sm_meta_save' );
?>

The update posts meta function will update or save the data to the database of a meta key ‘meta-checkbox’.

Step 3- Displaying the Featured Posts on the Frontend

Now we are in the final step and in this step, we will display the featured posts on the frontend. To display the featured posts we will make a page template in our theme’s directory and add the below code

<?php
  $args = array(
        'posts_per_page' => 5,
        'meta_key' => 'meta-checkbox',
        'meta_value' => 'yes'
    );
    $featured = new WP_Query($args);
 
if ($featured->have_posts()): while($featured->have_posts()): $featured->the_post(); ?>
<h3><a href="<?php the_permalink(); ?>"> <?php the_title(); ?></a></h3>
<p class="details">By <a href="<?php the_author_posts() ?>"><?php the_author(); ?> </a> / On <?php echo get_the_date('F j, Y'); ?> / In <?php the_category(', '); ?></p>
<?php if (has_post_thumbnail()) : ?>
 
<figure> <a href="<?php the_permalink(); ?>"><?php the_post_thumbnail(); ?></a> </figure>
<p ><?php the_excerpt();?></p>
<?php
endif;
endwhile; else:
endif;
?>

Hurray!!

You have done the task successfully .

You can also make your posts featured using Free WordPress plugins.

Hope this article will help you in adding the featured posts functionality in your theme.

Please do Comments if you have any queries. I would love to hear your awesome responses in commenting section.