Home > WordPress > Upload Multiple Featured Images in a Post OR Page

Upload Multiple Featured Images in a Post OR Page

In this tutorial, I’ll explain to you how to upload multiple featured images in any post type and pages and then show them at the front end.

We can do this with ACF (Advance custom field) plugin and with custom meta box creation.

Add Meta Box in Post Type and Pages:

The add_meta_box() hook used to add a meta box in posts or pages. It gives us a screen to add/edit data and save with post. We just need to pass the specific parameters and run with hook/action.

In this code, we run an action hook add_meta_boxes and this custom_postpage_meta_box is the callback function to run when add_meta_boxes action hit.
Here we declare the variable $post_types to hold the array for on which post types should the box appear? You can change the value of this variable as per your need. E.g:- array('post','page','custom-post'). add_meta_box() this function run the meta box screen in your post type. And you will see another featured image box container. You can change the label of your meta box and can set the position priority like I set in the above code.

Load the Field in the Meta Box:

Look at the above code, we declare the meta key for each box to save in the backend against post ID and field for upload/delete the image with the javascript function of wp.media. This will allow you to open wp media in the popup and select the featured image which you want to select.

And after this, you will see the box appears in the backend of the post or page.

Save the value of meta box:

We will use save_post action hook to save the meta box value against the post or page value.

Now, in this function, first we checked that the user has permission to edit that specific post type or not. If it not allowed then it will return the message “You have no permission to edit this post types”. If the user has permission then it will check the wp_nonce_field() for what data is coming from the same source and verify it. Then it will pass the value to update_post_meta() to save in the database.

After saving the value of the meta box (another featured image) you can access it with this code.

wp_get_attachment_image() this function used for get the image source with html generated. And inside this I used get_post_meta() function. I think you already know this how to get the post meta with this function. So use this and show on your post where you want.

All code together:

That’s it. We learned how to Upload multiple featured images with custom code without any plugin.
Have any query please let me know in the comment box.

Photo of author

About Aman Mehra

Hey there! I'm Aman Mehra, a full-stack developer with over six years of hands-on experience in the industry. I've dedicated myself to mastering the ins and outs of PHP, WordPress, ReactJS, NodeJS, and AWS, so you can trust me to handle your web development needs with expertise and finesse. In 2021, I decided to share my knowledge and insights with the world by starting this blog. It's been an incredible journey so far, and I've had the opportunity to learn and grow alongside my readers. Whether you're a seasoned developer or just dipping your toes into the world of web development, I'm here to provide valuable content and solutions to help you succeed. So, stick around, explore the blog, and feel free to reach out if you have any questions or suggestions. Together, let's navigate the exciting world of web development!

Leave a Comment