博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
分享网页到微信朋友圈,显示缩略图的方法
阅读量:2385 次
发布时间:2019-05-10

本文共 759 字,大约阅读时间需要 2 分钟。

       现在微信是时下最流行的社交媒体,只要有一个手机,就可以轻松玩转微信,所以,微信推广就成了站长朋友或微商们的一个非常重要的一个手段。如果你是一个站长,在分享自己网站文章到时,可能会碰到一个奇怪的问题——分享网站文章到微信朋友圈缩略图却不显示(如下图,标红处就没有显示文章图片),这是怎么一回事呢?怎么解决呢?

     15175139_mPqk.jpg

解决方法:

在我们的网站网页 html 代码中的<body>之后增加<img src="http://wanlimm.com/wp-content/themes/wanlimm/images/logo.jpg" width="0" height="0" />

注意事项:

1、这个logo.jpg图片尺寸不能太小,在120*100以上就可以了。

2、图片放到了body之后,微信应该会默认取页面中第一种图片。
3、用JPG图片,如果格式是png的,微信朋友圈可能会直接把他忽略了。
4、width和height都设为0,style不能设置为Display:none。
5、把http://www.ttlsa.com/news/wechat-no-images/images/logo.jpg这个地址改成你的图片地址。

通过这样弄,分享到微信朋友圈的网址文章就会显示缩略图,而且是显示文章内容中的第一张图片。

网页中<body>紧接着加一个

     

图片宽高大于400px,最好是一个正方形的图片

经过本人验证,加上上边的HTML标签后,分享网页链接到朋友圈后,缩略图会显示出来。如果是自己的网站,可以通过方法抓取到文章内容的第一张图片,然后将图片的地址放入到以上的代码中即可。

转载于:https://my.oschina.net/corwien/blog/660824

你可能感兴趣的文章
前端进阶(三)从0到1学AJAX,这篇就够了!
查看>>
强大的CSS:实现平行四边形布局效果
查看>>
强大的CSS:var变量的局部作用域(继承)特性
查看>>
强大的CSS: 使用“变量种子计数器”扩展动画更多可能性
查看>>
强大的CSS:focus-visible伪类真的太6了!
查看>>
强大的CSS:3种姿势实现26个英文字母的案例
查看>>
强大的CSS:placeholder-shown伪类实现Material Design占位符交互效果
查看>>
强大的CSS:图形绘制合集,方便你我!
查看>>
强大的CSS:scroll-snap滚动事件停止及元素位置检测
查看>>
程序员30岁前,月薪达不到30K,该何去何从?
查看>>
只要记住这五点,学习任何新编程语言都不是问题
查看>>
常见的前端开发CSS 面试题及回答策略
查看>>
缺前端是假的,缺优秀前端是真的
查看>>
前端入门那么容易,工作很难找吗?
查看>>
Web前端很难学?html、css t、JavaScrip知识架构图分享
查看>>
常见的前端开发:Javascript 面试题及回答策略
查看>>
web前端开发学习推荐这5本书
查看>>
Windows资源管理器相关信息获取
查看>>
windows资源管理器及ie监听
查看>>
No module named 'Crypto'
查看>>