[Resolved] Featured Image is distorted in Excerpt, not in Post

Home Forums Support [Resolved] Featured Image is distorted in Excerpt, not in Post

Home Forums Support Featured Image is distorted in Excerpt, not in Post

Viewing 11 posts - 1 through 11 (of 11 total)
  • Author
    Posts
  • #2304701
    auerbach

    In Pathogenews.com, I recently revised the Home page to add a thumbnail of each post’s Featured Image to the Excerpts that appears on Home. This works fine.

    However, the captions on images (which have these) do not appear in the posts or excerpts.

    I just added this CSS in an attempt to right-align the captions:

    p.wp-caption-text.thumb-caption-text {
    text-align: right;
    line-height: 22.5px;
    margin-top: 0.5em;
    }

    That seems to have corrected a previous problem (the featured images showed up in a “squashed” format in some excerpts), but as previously, the captions still do not display.

    I’d welcome any suggestions.

    Alex

    #2304744
    Ying
    Staff
    Customer Support

    Hi there,

    I’m not sure I fully understand your question, captions won’t show up for featured images by default.

    Do you want the featured image to show its caption on the homepage?

    #2304766
    auerbach

    Hi Ying. Thanks for the quick response. Yes, I would like the caption to show up BOTH in the post itself AND in the excerpt on the Home page.

    I did not understand that captions don’t show up by default; the Featured Image entry area does have a place to enter a caption, which I think to most users would suggest that the caption displays on the page.

    Please let me know how to override this default and have the caption display in the post and in the excerpt.

    If it is not possible for both the post and excerpt to display the caption, can I place a standard image in the text of the post, using “Insert Media,” and also have that image also display in the excerpt on the Home page?

    Alex

    #2304965
    David
    Staff
    Customer Support

    Hi there,

    try adding this PHP Snippet to your site:

    add_action( 'post_thumbnail_html', 'db_auto_single_featured_caption', 10 );
    function db_auto_single_featured_caption( $html ) {
        $caption = get_the_post_thumbnail_caption();
        if ( !empty($caption) ){
          $html .= '<div class="wp-caption">'. $caption . '</div>';
        }
        return $html;
    }
    #2305497
    auerbach

    Thanks, David. That did it!

    #2305691
    David
    Staff
    Customer Support
    #2314962
    auerbach

    Hi Again.

    The solution above added the featured image to excerpts and posts. Thank you for that.

    However, the handling of captions (which I use on only some featured images) is a problem.

    The captions display correctly on the Home page. But in full-page posts, the captions overlay the photos. For example, see https://pathogenews.com/treatment-for-tinnitus/, https://pathogenews.com/long-acting-injectable-drug-for-tuberculosis/, https://pathogenews.com/potential-long-term-treatment-for-asthma/, etc.

    Please tell me how to move the captions down slightly on the full pages, while leaving them as is when viewed in the excerpts on the Home page.

    Also, I’d like the captions to center under the images, rather than aligning to the right. (I’ve tried changing the CSS (of which my knowledge is quite limited), but without success.

    See the private information below.

    Thanks,

    Alex

    #2315090
    Fernando
    Customer Support

    Hi Alex,

    You can try adding this CSS in Appearance > Customize > Additional CSS:

    .single .featured-image .wp-caption {
        line-height: 1.5;
        text-align:center;
    }
    #2315963
    auerbach

    Hi Fernando,

    Thanks so much for the quick response. It worked, moving the caption lower and centering it in the full-page posts!

    However, in the excerpts on the Home page, the captions are not centered. Can I impose on you for advice on how to center these as well?

    I appreciate your help!

    #2315998
    Ying
    Staff
    Customer Support

    Hi there,

    You can change Fernando’s CSS to this:

    .wp-caption {
        line-height: 1.5;
        text-align:center;
    }
    #2316021
    auerbach

    Thanks, Ying. That did it!

Viewing 11 posts - 1 through 11 (of 11 total)
  • You must be logged in to reply to this topic.