• Resolved chiragagarwal

    (@chiragagarwal)


    While the link share is loading images correctly on Facebook, LinkedIn, Twitter etc., the image is not loading on WhatsApp on pages where multiple og:image tags are present.

    Facebook sharing debugger works fine too!

    Not sure if this is a new development, but wondering if there was a way to fix it since WhatsApp link sharing is core to our business.

    The page I need help with: [log in to see the link]

Viewing 3 replies - 1 through 3 (of 3 total)
  • Plugin Author Rank Math

    (@rankmath)

    Hello @chiragagarwal,

    Thank you for contacting the support.

    It seemed to work fine on our end when we tried to share:
    https://i.rankmath.com/W1gqIX

    With that said, there are a few reasons for the Facebook (or any other social network like WhatsApp) not picking your images and other social tags. We will list them below so you can check which one applies in your case:

    1. First and foremost, you must check the page source of the URL in question. Search for the og:image tag like in this Video:
    https://i.rankmath.com/aJCccE

    If the og:image tag is not found, that means Rank Math is either disabled or not able to print your social tags. Once done checking if Rank Math is enabled, you must check why it isn’t able to print social content by following this troubleshooting guide:
    https://rankmath.com/kb/check-plugin-conflicts/

    Make sure to follow all the instructions carefully.

    2. Assuming the og:image tag was found in step 1, we can proceed to find the issue.

    Scenario 1: You are using minification on your website and your cache plugin is inputting too much inline CSS into your page source that your OpenGraph tags are pushed way too down your page’s source:
    https://i.rankmath.com/y4WIgQ

    If this is the cache, you must move your inline CSS to a file because Facebook and other social networks will only look for OpenGraph tags in the first 60kbs of your page’s source. If they don’t find it, they will assume you haven’t added them. They don’t want to waste their resources crawling huge pages looking for OpenGraph tags.

    Scenario 2: The gain browser cache option in most cache plugins like W3 Total Cache is known to not play well with Facebook’s OpenGraph detection. If you have it enabled, disable it. The option for W3 Total Cache is at WP > Performance > Browser Cache > HTTP (gzip) compression
    https://i.rankmath.com/BbaiC6

    Then, clear your website and server cache (including Cloudflare – if enabled)

    Once you are done, you might want to test again here:
    https://developers.facebook.com/tools/debug/

    Click the Scrape Again button:
    https://i.rankmath.com/A5z7WK

    You should now see the OpenGraph tags update including the image.

    Hope that helps and please do not hesitate to let us know if you need our assistance with anything else.

    Thread Starter chiragagarwal

    (@chiragagarwal)

    Appreciate the insights! Yes, it was the critical css delivery from WP-rocket plugin that blocked the og:image. It’s now loading the image.

    However, we’d prefer to show only the featured product image instead of product gallery image on WhatsApp share. Would there be a way to do that?

    At the moment it is picking the LAST image from product gallery.

    Plugin Author Rank Math

    (@rankmath)

    Hello @chiragagarwal

    Have you added featured images to your products?

    This is the order that the plugin follows when picking up the image:
    Image set in the social tab of individual products
    Featured image
    First image in the content
    The default image from the titles & meta settings

    Hope that helps. Thank you.

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Multiple og:image tags for WooCommerce Products showing empty image on WhatsApp’ is closed to new replies.