Skip to content
Advertisement

Get the ALT text of Featured Image

I’m just starting to learn WP coding stuff. Please don’t be too hard on me.

I always see most of the answers for this question are something like or close to this:

$thumbnail_id = get_post_thumbnail_id( $post->ID );
$alt = get_post_meta($thumbnail_id, '_wp_attachment_image_alt', true);
<img src="<?php the_post_thumbnail_url('post-thumbnails-home-page'); ?>" alt="<?php echo $alt; ?>" />

I find it hard to convert <?php echo $alt; ?> to something that fits to my code:

// Featured Items
function display_featured_item($atts, $before = '', $sep = '', $after = '')
{
    
    $atts = shortcode_atts(array(
        'post_id' => 0,
    ), $atts, 'display-featured-item');
    
    $id = $atts['post_id'];
    $tag_list = get_the_term_list( $id, 'post_tag', $before, $sep, $after );
    
    if ($id == '0') return '';

    $data = '<div class="promotion-wrapper">';
    $data .= '<h2><a href="' . get_permalink($id) . '">' . get_the_title($id) . '</a></h2>';
    $data .= '<p>' . get_the_excerpt($id) . '</p>';
    $data .= '<p><a href="' . get_permalink($id) . '" class="reg-link">Learn more</a></p>';
    $data .= '<p><img src="' . get_the_post_thumbnail_url($id, 'full') . '" alt=""/></p>';
    $data .= '<p>' . apply_filters( 'the_tags', $tag_list, $before, $sep, $after, $id ) . '</p>';
    $data .= '</div>';
    return $data;
}
add_shortcode('display-featured-item', 'display_featured_item');

I’ve been searching all over the internet for a couple of hours now and hoping to find answers that could possibly work to my code but I still got no luck.

If some of you know how to do this, it will definitely make my day. TIA! 🙂

Advertisement

Answer

After checking my other code snippets, I noticed this different way of using variables.

All I had to do was to change: $data .= '<p><img src="' . get_the_post_thumbnail_url($id, 'full') . '" alt=""/></p>'; to: $data .= get_the_post_thumbnail($id, 'full');


This will be the final code to display WordPress Posts [Title, Excerpt, Learn more (link), Thumbnail/Featured Image, and Tags] using a Shortcode:

// Featured Items
function display_featured_item($atts, $before = '', $sep = '', $after = '')
{
    $atts = shortcode_atts(array(
        'post_id' => 0,
    ), $atts, 'display-featured-item');
    
    $id = $atts['post_id'];
    $tag_list = get_the_term_list( $id, 'post_tag', $before, $sep, $after );
    
    if ($id == '0') return '';

    $data = '<div class="promotion-wrapper">';
    $data .= '<h2><a href="' . get_permalink($id) . '">' . get_the_title($id) . '</a></h2>';
    $data .= '<p>' . get_the_excerpt($id) . '</p>';
    $data .= '<p><a href="' . get_permalink($id) . '" class="reg-link">Learn more</a></p>';
    $data .= get_the_post_thumbnail($id, 'full');
    $data .= '<p>' . apply_filters( 'the_tags', $tag_list, $before, $sep, $after, $id ) . '</p>';
    $data .= '</div>';
    return $data;
}
add_shortcode('display-featured-item', 'display_featured_item');

Then, add this shortcode [display-featured-item] to any of your page/post.

User contributions licensed under: CC BY-SA
10 People found this is helpful
Advertisement