Hide featured image from article

Hallo, how can i Hide the featured image from the inside of the blog articles?

Thanks

I’d recommend adding the following CSS in the customizer/theme options:

.single-post .entry-featured {
  display: none;
}

That should hide the featured image in your blog posts (but not in pages like your archives).

2 Likes

@Frimatek, thanks for chiming in! That CSS certainly does hide the images visibly from the page and gets the job done quickly.

@beatricemartini, one thing to keep in mind with the technique above is that the image is still physically present in your markup. Even though it is not visible, it is will be requested on every page load. If you want to take it one step further and ensure that it is not loading at all, you can overwrite any of X’s views via a child theme. There is an in-depth article on customization best practices here that walks through all of this in great detail.

You’ll definitely want to check out that article, but the basic premise would work as such (let’s assume you’re using Integrity): locate the view of what you want to overwrite and copy that file’s contents to your child theme following the same path. In this case, you’d likely want to update the file at /framework/views/integrity/content.php, which is the main output for the content of a standard post. You could copy that file to your child theme at the exact same location: /framework/views/integrity/content.php, which can now be safely edited in your child theme. When you copy a template to your child theme, WordPress will always load that view first, along with your edits. Inside that file, you could do the following:

<?php

// =============================================================================
// VIEWS/INTEGRITY/CONTENT.PHP
// -----------------------------------------------------------------------------
// Standard post output for Integrity.
// =============================================================================

?>

<article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
  <?php if ( ! is_single() ) : ?>
    <div class="entry-featured">
      <?php x_featured_image(); ?>
    </div>
  <?php endif; ?>
  <div class="entry-wrap">
    <?php x_get_view( 'integrity', '_content', 'post-header' ); ?>
    <?php x_get_view( 'global', '_content' ); ?>
  </div>
  <?php x_get_view( 'integrity', '_content', 'post-footer' ); ?>
</article>

Notice the if ( ! is_single() ) : condition statement wrapping the featured content. This will allow featured images to show up on your blog index but not single blog posts, which gives you the benefit of showing content where you want it, hiding it where you don’t want it, and not loading any extra resources that you don’t need.

Hopefully that helps to shed a little more light onto the usefulness of child themes and what you can do with them. Cheers!

3 Likes

Hi,

First, thanks for the CSS code to hide the featured image!

Now, does anyone know how I can hide the the rest (article title, article author, article category, ‘leave a comment’)? Thank you. :slight_smile:

Hey @Chiloe1992,

To hide article author and category, Browse to Theme Options >> Blog >> Content and disable Post Meta.

To disable comment on individual post Browse to All Posts >> Quick edit any post and disable “Allow Comments” section.

To hide article title add the following CSS code in CSS section in theme options

.entry-title {
     display: none;
 }

Hope this helps.

Regards

1 Like

Awesome! This answers all my questions. Thanks so much. :slight_smile:

You are welcome! :slight_smile:

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.