Link preview not shown on any social media

Question

I was testing to see how my links appear when they are shared on WhatsApp or other social media. I found that it only shows the link, but not the meta description and page/post image etc.

I am using the latest WordPress version and Yoast SEO plugin.

How to fix it?

UPDATE: I tried some stuff hoping it will solve the problem but sadly, nothing helped: I deleted and re-installed Yoast SEO, I tried RankMath, All-in-one-seo, none of them helped. I right clicked on the page to view the source, the code looks fine and I can see the related meta in the headings but it is not applied. I mean still when I share my link, it is a simple link, no preview no nothing.

I even tried to use the code recommended by WpBeginner, that also didn't solve the problem.

I'm still looking for a way to see my links with it's preview on any soacial media.

Robots.txT and .htaccess not blocking anything.

Update2 This is the code that I use: (I have tested it with my own urls btw))

    //Adding the Open Graph in the Language Attributes
function add_opengraph_doctype( $output ) {
        return $output . ' xmlns:og="http://opengraphprotocol.org/schema/" xmlns:fb="http://www.facebook.com/2008/fbml"';
    }
add_filter('language_attributes', 'add_opengraph_doctype');
 
//Lets add Open Graph Meta Info
 
function insert_fb_in_head() {
    global $post;
    if ( !is_singular()) //if it is not a post or a page
        return;
       echo '<meta property="fb:app_id" content="Your Facebook App ID" />';
        echo '<meta property="og:title" content="' . get_the_title() . '"/>';
        echo '<meta property="og:type" content="article"/>';
        echo '<meta property="og:url" content="' . get_permalink() . '"/>';
        echo '<meta property="og:site_name" content="SITE NAME"/>';
    if(!has_post_thumbnail( $post->ID )) { //the post does not have featured image, use a default image
        $default_image="IMAGE ADDRESS"; //replace this with a default image on your server or an image in your media library
        echo '<meta property="og:image" content="' . $default_image . '"/>';
    }
    else{
        $thumbnail_src = wp_get_attachment_image_src( get_post_thumbnail_id( $post->ID ), 'medium' );
        echo '<meta property="og:image" content="' . esc_attr( $thumbnail_src[0] ) . '"/>';
    }
    echo "
";
}
add_action( 'wp_head', 'insert_fb_in_head', 5 );