Twitter Card validator errors with WordPress, SSL

Since I am committing to creating more sharable content on my otherwise barren website, I figured I would knock out two birds with one stone and share a fix I applied to my website: solve my Twitter Card validation errors.

The issue came up when I was trying to post a link to my website on Twitter, but instead of seeing a preview of my post, all that was tweeted out was a bland link.

When I tested my website on Twitter’s Card Validator, it came back with this nondescript error:

Twitter Card Validator displaying “Unable to render Card preview,” and, “ERROR: Fetching the page failed because other errors.”

Well. That’s useful.

Ideally, I would see this:

Alas, a Twitter Card.

Ah, that looks nice. See, tweets that contain rich content are 26% more likely to get an interaction. If you care about social media at all, that matters! Supposedly…

The Yoast plugin for WordPress works great for generating the <meta> tags that Twitter looks for, but if you are using HTTPS — which you SHOULD be doing — and you don’t have it setup properly, you’ll see nothing.

After searching around, several other frustrated webmasters pointed out that this particular error is usually due to an SSL issue. One suggestion was to enable ASE128 so that Twitterbot can crawl your page. Another pointed to robots.txt possibly blocking Twitterbot.

Thankfully, the fix was simpler and less sketchy: include the fullchain in your VirtualHost block.

SSLCertificateFile /path/to/cert.pem
SSLCertificateChainFile /path/to/chain.pem
SSLCertificateKeyFile /path/to/privkey.pem

Restart Apache and you should be good to go.