分享网页文章到微信时如何自定义缩略图、链接、标题和摘要

(弄了一圈,回来不知道哪里出错了,只有收藏的时候可以显示,发朋友圈和发送给好友还是不行,知道的大神帮个忙呗。)

1、分享网页文章到微信时自定义缩略图、链接、标题和摘要的方法:

下面笔者就将上面问题笔者的解决方案贴出来,由于微信分享是通过WeixinJSBridge实现的。所以用户只需要将下面这段Js代码复制到网页中,定义好对应的参数即可。

var imgUrl = 'http://#www.timsion.com/xxx.jpg';

var lineLink = 'http://#www.timsion.com/904';

var descContent = "天晟网络 -

专注站长技术和互联网资讯!";

var shareTitle = '天晟网';

var appid = '';

function shareFriend() {

WeixinJSBridge.invoke('sendAppMessage',{

"appid": appid,

"img_url": imgUrl,

"img_width": "200",

"img_height": "200",

"link": lineLink,

"desc": descContent,

"title": shareTitle

}, function(res) {

//_report('send_msg', res.err_msg);

})

}

function shareTimeline() {

WeixinJSBridge.invoke('shareTimeline',{

"img_url": imgUrl,

"img_width": "200",

"img_height": "200",

"link": lineLink,

"desc": descContent,

"title": shareTitle

}, function(res) {

//_report('timeline', res.err_msg);

});

}

function shareWeibo() {

WeixinJSBridge.invoke('shareWeibo',{

"content": descContent,

"url": lineLink,

}, function(res) {

//_report('weibo', res.err_msg);

});

}

// 当微信内置浏览器完成内部初始化后会触发WeixinJSBridgeReady事件。

document.addEventListener('WeixinJSBridgeReady', function onBridgeReady() {

// 发送给好友

WeixinJSBridge.on('menu:share:appmessage', function(argv){

shareFriend();

});

// 分享到朋友圈

WeixinJSBridge.on('menu:share:timeline', function(argv){

shareTimeline();

});

// 分享到微博

WeixinJSBridge.on('menu:share:weibo', function(argv){

shareWeibo();

});

}, false);

2、分享网站文章到微信朋友圈时带指定缩略图的好处和不能实现的问题?

分享网站文章到微信朋友圈时,显示指定缩略图或指定LOGO,这样的好处很多,一是增加品牌的曝光率和美誉度(这是与你的网站发的网站直接相关的),二是可以增加网站的访问量,对于提高网站在搜索收获的收录及自然提名是很有好处的。

但使用这种方法的企业经常会遇到这样的问题:1)文章中没有图片时分享出去的缩略图一栏是空白的(图片无法加载的那种情形),显示效果非常差;2)文章的图片无法被抓取成为缩略图;3)文章里有多张图片时自己想要设为封面的图片无法实现。

3、分享网页到微信朋友圈,怎样才能带缩略图?

微信官方没有公布其抓取缩略图的规则,有做这方面探索的人会发现自己发布在文章的图片有时会抓取,有时又被忽略,“时灵时不灵”,相当郁闷,其实,可以通过一些技术手段来利用朋友圈分享网页的规则,实现想达到的效果。具体方法如下:

1)如果你想在分享的文章中固定设置为贵公司的LOGO,可以在每一篇文章的内容中放一个隐藏的LOGO图片,记住,不要使用Display:none;的方法设置,只需把img的width和height属性都设置为0即可;

2)如果你希望文章有图片时抓取文章图片作为缩略图,内容中没有图片时默认使用公司的LOGO,则可以把隐藏的logo放到文章末尾,自然就能实现这样的效果了。

代码示例:

在我们的网站网页 html 代码中的之后增加

应用时注意把http://www.debake.cn/logo.jpg这个地址改成你的图片地址。

(个人试的是把img放在body之后,文章内容之前做隐藏,收藏的时候微信网页的规则会自动抓取,不过分享的时候可能规则不一样,还是不显示的。

原文地址:http://www.timsion.com/web/35747.html)

你可能感兴趣的:(分享网页文章到微信时如何自定义缩略图、链接、标题和摘要)