您的足迹:首页 > 网站技巧 >QQ/微信如何自定义分享链接缩略图?

QQ/微信如何自定义分享链接缩略图?

我们每天都在逛QQ空间和朋友圈,细心的朋友一定会发现有的人分享的链接会显示缩略图,这样可以吸引人点击引来流量,其实QQ或者微信分享链接的缩略图是可以自定义的,下面就教大家如何自定义QQ/微信分享链接缩略图?

以前大家的做法是设置一张图片放在网页的body顶部,然后设置隐藏,代码如下:

<!--QQ/微信分享标题图--><div style="display:none;"><img src="http://ws234.com/content/templates/emlog_dux/images/fxlogo.png"></div>
做SEO的都知道使用js或display:none等方法隐藏链接,从而使用户在正常浏览网页的时候无法看到这个链接,隐藏链接是被搜索引擎严令禁止的,一旦发现,惩罚将会非常严重,轻则降低网页权重,重则清空网页的索引记录,所以不推荐使用这种方法,我们可以用如下方式实现类似效果:
<!--QQ/微信分享标题图--><div style="width:0px;height:0px;overflow:hidden;"><img src="http://ws234.com/content/templates/emlog_dux/images/fxlogo.png></div>
在QQ/微信中,我都亲测可用,效果如下图所示:

2.png

大家也可以直接用手机扫描下面二维码分享链接体验实际效果:

3.png

其实腾讯官方也给出了相关的文档说明,我们也可以借鉴参考:手机QQAPI-腾讯移动Web开发平台

// 另外使用meta同样可以达到该接口的作用
 <meta itemprop="name" content="这是分享的标题"/>
 <meta itemprop="image" content="http://ws234.com/content/templates/emlog_dux/images/fxlogo.png" />
 <meta name="description" itemprop="description" content="这是要分享的内容" />
本文作者:王商   文章标题:QQ/微信如何自定义分享链接缩略图?
本文地址:http://ws234.com/post-432.html     本文已被百度收录!
版权说明:若无注明,本文皆为“王商博客”原创,转载请保留文章出处。

相关推荐

发表评论

路人甲 表情

看不清楚?点图切换

网友评论(1)

一直想知道这个是怎么弄的,学习了
乐赚168 5个月前 (2016-10-07) 回复