一、标题

微信分享链接的小标题:自动拉取title标签的内容。

二、链接的小图标

今天测试的时候发现,网页链接在QQ浏览器上打开,分享的小图片是有显示的,

自动获取网页上的一张图片,但是为什么微信浏览器分享到朋友圈时图片却不显示呢?


dg1wc1i2.png

想要的效果:

微信å享é¾æ¥è·åæ é¢åå°å¾ç

现实效果:

微信å享é¾æ¥è·åæ é¢åå°å¾ç

在网上搜了一下发现,原来是因为 微信浏览器上自动拉取的图片必须是大于300*300px的图片,( 会取


最近一张图片符合条件的)。


解决办法:


(一)


在boby 和head之间添加下面的代码即可,图片路径自行修改。


*注意这个图片必须是大于300px*300px的


 


< bod y >


< div style ='margin:0 auto;width:0px;height:0px;overflow:hidden;  ' >


< img src='/image/data/pic300.jpg' / >


< /div >

      < /bod y >


(二)


 


   var imgUrl = 'http://www.baidu.com/images/share.jpg';  // 分享后展示的一张图片

   var lineLink = 'http://www.baidu.com'; // 点击分享后跳转的页面地址

   var descContent = "小灰博客,敬请访问!";  // 分享后的描述信息

   var shareTitle = '小灰博客';  // 分享后的标题


var appid = '';  // 应用id,如果有可以填,没有就留空


        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);

微信扫码下载APP解决方案

微信跳转外部浏览器