Docs

[lbelinfante]

Hello,

I would love to have the featured image within my blog post look similar to the skinny image that appears in the blog archives. I like the banner look of those images and was wondering if I could get the same look when people click into an actual post. Please let me know.

[Christopher]

Thanks for writing in! To assist you with this issue, we’ll first need you to provide us with your URL. This is to ensure that we can provide you with a tailored answer to your situation. Once you have provided us with your URL, we will be happy to assist you with everything.

[lbelinfante]

This reply has been marked as private.

[Lely]

Hi There,

Thank you for the URL. Regretfully, at this time I am not entirely certain what it is you would like to accomplish based on the information given in your post. If you wouldn’t mind providing us with a little more clarification on what it is you’re wanting to do (perhaps some screenshots), we’ll be happy to provide you with a response once we have a better understanding of the situation.

[lbelinfante]

Of course. On the single blog entry the featured image appears at the top of the page full size before the user can view the title. I would like the image to appear wide and skinny at the top of the post. An ideal size would be how the featured images look on the archive page. Does that make more sense? Please let me know.

[Rue Nel]

Hello There,

Thanks for the updates! Upon checking your url, it no longer exist.

To customize the feature image in your blog post, I will just that you have the same setup as your live site. Because what you are trying to accomplish requires a template customization, we would like to suggest that you use a child theme. This allows you to make code changes that won’t be overwritten when an X update is released. After your child theme is setup, please review how we recommend making template changes in Customization Best Practices.

After the child theme is set up, please add the following code in your child theme’s functions.php file

// Custom feature image image
// =============================================================================
function x_featured_image( $cropped = '' ) {

  $stack     = x_get_stack();
  $fullwidth = ( in_array( 'x-full-width-active', get_body_class() ) ) ? true : false;
  $bgimage   = x_ethos_entry_cover_background_image_style();

  if ( has_post_thumbnail() ) {

    if ( $cropped == 'cropped' ) {
      if ( $fullwidth ) {
        $thumb = get_the_post_thumbnail( NULL, 'entry-cropped-fullwidth', NULL );
      } else {
        $thumb = get_the_post_thumbnail( NULL, 'entry-cropped', NULL );
      }
    } else {
      if ( $fullwidth ) {
        $thumb = get_the_post_thumbnail( NULL, 'entry-fullwidth', NULL );
      } else {
        $thumb = get_the_post_thumbnail( NULL, 'entry', NULL );
      }
    }

    switch ( is_singular() ) {
      case true:
        printf( '<div class="entry-thumb" style="%s; min-height: 230px; background-position: center center; background-size: cover;"></div>', $bgimage );
        break;
      case false:
        printf( '<a href="%1$s" class="entry-thumb" title="%2$s">%3$s</a>',
          esc_url( get_permalink() ),
          esc_attr( sprintf( __( 'Permalink to: "%s"', '__x__' ), the_title_attribute( 'echo=0' ) ) ),
          $thumb
        );
        break;
    }

  }

}
// =============================================================================

We would loved to know if this has work for you. Thank you.

[Author]

Posts