爲 Halo 博客添加 Twitter 卡片支持

已向 Halo 官方提了相關 issue,可能會在 2.0 加入相關支持。

每次想把文章分享到 Twitter 的時候,都顯示的是一條長長的url,一點都不美觀,一點都沒有想點進去的慾望。

看到別人的分享鏈接都會形成卡片,稍微查了一下果然需要往頁面上添加元數據。

那麼如何在 Halo 添加 Twitter 卡片支持呢?
往主題的公共head添加如下代碼即可:

<meta name="twitter:card" content="summary" />
<meta name="twitter:site" content="${blog_title!}" />
<meta name="twitter:creator" content="${user.nickname!}" />
<meta property="og:url" content="${post.fullPath!}" />
<meta property="og:title" content="${post.title!}" />
<meta property="og:description" content="${post.summary!}" />
<meta property="og:image" content="${post.thumbnail!}" />

添加完畢後可以使用官方校驗工具來查看是否成功:https://cards-dev.twitter.com/validator

對了,如果您域名的 DNS 服務在國內的話,Twitter 似乎無法正常鏈接,所以卡片很可能不會生效((

ERROR: Fetching the page failed because the fetcher cannot resolve the address.
# 鏈接失敗返回的log
# 我在考慮一些特殊方法解決這個問題

附:Twitter Card 官方文檔

# 教程  Twitter  Halo 

评论

Your browser is out-of-date!

Update your browser to view this website correctly. Update my browser now

×