twitter-card

I get "Unable to render Card preview" from the twitter card verifier, even though it says "INFO: Card loaded successfully" in the verification


I am trying to validate my twitter card for https://tjaz.com at: https://cards-dev.twitter.com/validator I get the all clear in the validation log but the card can't load:

No errors in logs but card will not load

My meta tags are defined in pug like this:

       meta(name="description" content="A platform for delivery of online learning, with a special focus on solving the challenges with delivering the online learning B2B. If you deliver online learning B2B you'll want to check out Tjaz.")

        <!-- Google / Search Engine Tags -->
        meta(itemprop="name" content="Tjaz - a platform for delivering online learning.")
        meta(itemprop="description" content="A platform for delivery of online learning, with a special focus on solving the challenges with delivering the online learning B2B. If you deliver online learning B2B you'll want to check out Tjaz.")
        meta(itemprop="image" content="https://tjaz.com/og-logo.png")

        <!-- Facebook Meta Tags -->
        meta(property="og:url" content="https://tjaz.com")
        meta(property="og:type" content="website")
        meta(property="og:title" content="Tjaz - a platform for delivering online learning.")
        meta(property="og:description" content="A platform for delivery of online learning, with a special focus on solving the challenges with delivering the online learning B2B. If you deliver online learning B2B you'll want to check out Tjaz.")
        meta(property="og:image" content="https://tjaz.com/og-logo.png")

        <!-- Twitter Meta Tags -->
        meta(name="twitter:card" content="summary_large_image")
        meta(name="twitter:title" content="Tjaz - a platform for delivering online learning.")
        meta(name="twitter:description" content="A platform for delivery of online learning, with a special focus on solving the challenges with delivering the online learning B2B. If you deliver online learning B2B you'll want to check out Tjaz.")
        meta(name="twitter:image" content="https://tjaz.com/og-logo.png")       

It works fine when I use various other tools to check, and it works fine on LinkedIn. I'm stuck please help if you can?

I tried many variations of the meta tags with the same problem, I was expecting the twitter card to load successfully.


Solution

  • Edit: The preview functionality has been disabled by Twitter mid 2022, that's why it doesn't work:

    https://twittercommunity.com/t/card-error-unable-to-render-or-no-image-read-this-first/62736

    https://twittercommunity.com/t/card-validator-preview-removal/175006

    I found a way to update the old cached image, add ?1 to the url of the image in the meta tag, as described here https://developer.twitter.com/en/docs/twitter-for-websites/cards/guides/troubleshooting-cards#refreshing_tags

    And used the twitter card validator a couple of times, and then about 15 mins later it was using the new image.