如何自定义QQ移动端卡片分享的主标题、副标题、缩略图? - wordpress开发

有的人分享的链接自带标题和副标题和缩略图,就很好看,但是我自己的却是机械截取的一团,这篇wordpress开发教程就教大家如何解决这个问题

在分享我们写的博文时,会遇到这样一种情况,有的人分享的链接自带标题和副标题和缩略图,就很好看,但是我自己的却是机械截取的一团,看起来就不舒服,那么是咋回事呢?这个就是代码层面的原因了,这篇wordpress开发教程就教大家如何解决这个问题。

  • 参考来源: https://www.dpaoz.com/143
如何自定义QQ移动端卡片分享的主标题、副标题、缩略图? - wordpress开发-Npcink
背景图片
如何自定义QQ移动端卡片分享的主标题、副标题、缩略图? - wordpress开发-Npcink

H5手Q分享通用接口代码片段

<meta itemprop="name" content="网页标题">

<meta itemprop="description" content="网页描述">

<meta itemprop="image" content="缩略图">

将一以上代码写在页面head标签中。

H5手Q分享通用接口参数说明

itemprop="name"

网页标题,不同社交APP截取的长度都不一样,然后手机屏幕大小也会再次不同程度裁减文字。微信只用这个标题。

itemprop="description"

网页简介/摘要,和网页标题一样有长度限制,如果小屏幕可能还会裁减。微信不会使用到这个标签。

itemprop="image"

网页缩略图/分享图标,显示在分享内容的左边,图片支持.jpg、.png等常见格式,建议使用200px*200px的图片,如果太大可能读取比较慢。

除了代码层面解决问题,你还可以通过wordpress插件来生成海报,分享海报出去,也是一个不错的选择:

如何自定义QQ移动端卡片分享的主标题、副标题、缩略图? - wordpress开发-Npcink
如何自定义QQ移动端卡片分享的主标题、副标题、缩略图? - wordpress开发-Npcink

WP Poster - WordPress文章分享海报插件

为你的网站添加文章分享海报功能,显示在文章内容底部,由Canvas绘图生成,非PHP后端生成,节省服务器资源。
如何自定义QQ移动端卡片分享的主标题、副标题、缩略图? - wordpress开发-Npcink
如何自定义QQ移动端卡片分享的主标题、副标题、缩略图? - wordpress开发-Npcink

博客社交分享组件WP插件 - 打赏/点赞/微海报/社交分享四合一

网站赞助打赏是一款支持使用支付宝和微信支付的文章赞助打赏的wordpress插件。
WP开发

wordpress开发 - 添加fancybox画廊支持

2020-3-25 22:07:44

WP开发

禁止指定用户登录(小黑屋) - wordpress开发

2020-3-31 23:23:52

⚠️
Npcink上的部份代码及教程来源于互联网,仅供网友学习交流,若您喜欢本文可附上原文链接随意转载。
无意侵害您的权益,请发送邮件至 link@baimu.org 或点击右侧 私信:Muze 反馈,我们将尽快处理。
0 条回复 A文章作者 M管理员
    暂无讨论,说说你的看法吧
个人中心
购物车
优惠劵
今日签到
有新私信 私信列表
搜索