How to Remove Featured Images From Posts

Hi there,

First I would like to thank you for this fantastic theme. I've been using on my WP and enjoy it a lot. Anyway, my issue is that I would like to remove the featured image from appearing inside of my posts.

I want to keep my featured post images just appearing in my website's blog section. How can I do this?

Thanks, Jordan

Hey Jordan, thanks for your kind words and welcome to Beans community.

You may add the code snippet below in your child theme functions.php.

add_action( 'wp', 'beans_child_setup_document' );

function beans_child_setup_document() {

  // Only apply if for single view.
 if ( is_single() ) {
    beans_remove_action( 'beans_post_image' );
  }

}

There is a ton of stuff you can change on the page just by modifying actions using Beans Actions API. For HTML markup, you would be using the Beans Markup API. I linked it to the documentation so that you can take a look. If you don't understand 100%, don't sweat it, it will come over time and the community and I are here to help 🙂

When modifying actions or markup in functions.php, we would usually do it in a function added to a 'wp' action (beans_child_setup_document() in the example above) so that we have access to the WordPress Conditional Tags functions such as is_single() that way we can modify parts of the document conditionnally. If you where doing it in a page template, you wouldn't need to wrap it in a functions.

If this is a little to much, don't worry about. Feel free to post a question when you face challenges and take it one at the time 🙂

Ha... thanks a lot! I've already made a couple of changes to my theme. Just was looking for that one 🙂

Hello Thierry, thanks for your great themes I've tried your code snippet and it worked. But I need a different thing with the featured image. I want to remove the featured image from the blog page too. So the features iamge is just shown in a slider in home page. Can you tell me how to do this? And one more thing, how to hide page or post title just for the home and blog page?

Thanks, Pandhu

Hi Pandu,

Here is what you can add to your child theme functions.php

add_action( 'wp', 'example_setup_document' );

function example_setup_document() {

  // Remove post title for front page and blog page.
  if ( is_front_page() || is_home() ) {
   beans_remove_action( 'beans_post_title' );
  }

 // Remove post image except for the front page.
 if ( !is_front_page() ) {
   beans_remove_action( 'beans_post_image' );
  }

}

Note how the actions are wrapped in example_setup_document() (you may rename the prefix according to your project) which is in a wp action callback. We do that have access to the WordPress Conditional Tags and conditionally run our actions.

This is fine to do in functions.php since to code are still short but if you were to do a lot more modifications, it would be good to use template files as explained in this article. When using template files, only the stuff which applies globally goes into functions.php, the rest goes in your template files without any conditional tags since it only applies when the template file is used. So in your example, the tip I would give you is to add beans_remove_action( 'beans_post_image' ); (without the wrapping function) in your functions.php so that the image is removed globally. Then since you only need it on the front page you would add beans_reset_action( 'beans_post_image' ); in your front-page.php template file which essentially says "hey, I need the post image here so reset the action to cancel the remove".

Pandhu, I always try to give as much explanation as possible but if you don't understand everything 100%, don't sweat, we are here to help 😯

Happy coding,

I'll try your code. And thanks for the explanations, it was a great tips for beginner like me. I'll give a try to read the article you'd shown me. Any suggestion another documentation to read for me?

Well it is a tough one because it really depends how well you know WordPress itself.

If you read and understand all Beans documentation and have a good understand of WordPress and UIkit, then will be a Ninja and will pretty much be able to build any websites rapidely in a professional and optimized way without any plugins (maybe a fields plugin such as ACF depending on the layout complexity).

Take it easy if you just started though, one step at the time 🙂

Just tried your code. It worked just as I wanted. Thanks Thierry for the code and espescially for the themes.

// Remove post image except for the front page.
if ( !is_front_page() ) {
  beans_remove_action( 'beans_post_image' );
}

I modify the code above to

// Remove post image except for the front page.
if ( !is_front_page() || !is_home() ) {
 beans_remove_action( 'beans_post_image' );

  // Move the post image above the post title.
  beans_modify_action_hook( 'beans_post_image', 'beans_post_title_before_markup' );
}

Why is the featured image not shown on the blog page? Am I doing wrong with the code?

Hey Pandhu,

The is_front_page() and is_home() are two different Conditional Tags when the blog posts index differs from the website front page (see more). The way you modified your code is basically saying "if it is not the front page or not the blog posts index, don't display the image", which is why it is not displayed on your blog.

Hope that helps,

Isn't my code saying "if it is not the front page or not the blog posts index, don't display the image"? That means the function give an order: "Hey Beans, show the image on the front page and blog page"

Or I should use

if ( is_home() ) {
 beans_reset_action( 'beans_post_image' );

 // Move the post image above the post title.
  beans_modify_action_hook( 'beans_post_image', 'beans_post_title_before_markup' );
}

Hey Pandhu, you are right I forgot the word "not" in my previously reply (I just edited it to rectify it). In your previous comment you said

> I want to remove the featured image from the blog page too

As you can see in my reply, the code to remove the image says "if it is not the front page, remove image" which means the image is removed everywhere (including the blog index) besides for the front page.

// Remove post image except for the front page.
if ( !is_front_page() ) {
  beans_remove_action( 'beans_post_image' );
}

In most scenarios, there are different ways to get to the same result so you may remove the image globally and only reset it where you need it which will be the same result. I think you have understood how to use with Beans Actions and Conditional Tags so you may apply it according to your need 🙂

Happy coding,

Ah, I am sorry Thierry.

In previous comment, I did want to remove the image in the blog page too and yes I can ge that with the code you wrote in reply to that comment.

And about showing the image in blog page, it is another thing. I mean, what if I want to show the image in front page and blog page and move the image above the title only in blog page. So I modify your code. The image is shown on the front page but still not shown on the blog post page.

Thanks

I mean, what if I want to show the image in front page and blog page and move the image above the title only in blog page.

// Only apply ot the front page and blog index.
if ( !is_front_page() && !is_home() ) {
    beans_remove_action( 'beans_post_image' );    
}

// Move the post image above the post title if blog index.
if ( is_home() ) {
    beans_modify_action_hook( 'beans_post_image', 'beans_post_title_before_markup' );
}

Ah...I forgot to clear all the cache. The image is all shown now. Thanks for the help Thierry.

But actually I modify the code. I don't know why if I use your code the image is not shown even after I clear the cache, so I modify your code and after clear the cache again it works.

// Remove post image except for the front page.
if ( !is_front_page() ) {
    beans_remove_action( 'beans_post_image' );
}

// Show the image on blog page
if ( is_home() ) {
    beans_reset_action( 'beans_post_image' );

    // Move the post image above the post title.
    beans_modify_action_hook( 'beans_post_image', 'beans_post_title_before_markup' );
}

Hi Pandhu, I slightly modified the code in my previous answer which should fix the issue (the image if statemement was using || instead of &&).

Please give it a try with the updated code snippet and let me know 🙂

Thanks,

It works.

I think I will use your code rather than I've already used.

Thanks Thierry, Works like a charm 🙂