（实操）如何让link里面的缩略图显得高大上
本帖最后由 Laura婷 于 2014-6-27 15:01 编辑http://www.suonuo.net/data/attachment/album/201406/27/094636oioqufft6fvtlrtr.jpg
如何让link里面的缩略图显得高大上
前段时间接到一个客户的问题， 同样是在专页上发布链接， 为什么Sammydress的链接缩略图是那种小小的的正方图， 而romwe, lightinthebox的却是高大上的长方形， 表现力特别好？
http://www.suonuo.net/data/attachment/album/201406/27/094636mi8oc42c269fzn2c.jpg
相信很多电商们都会遇到这样的问题，链接缩略图的展示问题。想要知道如何做成romwe这样的高大上效果，斑马告诉你得从2个方面下手。
http://www.suonuo.net/data/attachment/album/201406/27/094636mi8oc42c269fzn2c.jpg
第一： 指定链接缩略图
在浏览器中点击右键， 查看页面源代码， 在head区域你会看到这么一段：
http://www.suonuo.net/data/attachment/album/201406/27/100935ve2fapqodn1mf7kd.jpg<meta property="og:image" 开头的标签就是让你指定链接中出现的缩略图是哪一张，如果你的页面中没有这个meta标签， 那么把链接复制到Facebook上后， Facebook会读取当前页面的其他图片， 让你选择出现哪一张缩略图。
指定图片的meta标签通常会和安装Facebook的插件时候一起设定， 当用户点击like或share按钮时， 可以确保链接中展示的图片就是当前产品页面的产品图片， 而不是这个页面其他的产品。
第二： 图片宽度- 大于400px
第一步只是个开始，想要图片高大上， 必须在图片尺寸上下工夫。 还记得在粘贴链接时，链接缩略图是可以指定的吗？而Facebook建议的上传图片尺寸是600*315px.
http://www.suonuo.net/data/attachment/album/201406/27/094637kk4kesxzzqufjuz8.png
而在Facebook实际读取链接时，只要图片宽度大于400px，图片就会展现出自动调整后的宽图缩略图。我们下载下来了上图中所示sammydress和lightinthebox的指定展示图片，结果尺寸对比如下：
http://www.suonuo.net/data/attachment/album/201406/27/094638m4dms9mmd9kz455p.jpg
当链接po到Facebook上后， 阿卡曼服务器会对图片进行修整，将图片修正成符合Link缩略图的图片比例，并将图片缓存在服务器上，而不是直接从网站调取。而sammydress由于本身图片宽度小于400px，连377px都不够，而无法展示出宽图。 见下图所示：
http://www.suonuo.net/data/attachment/album/201406/27/094639oycyd8ltpscshc5h.png
因此想要高大上的宽图， 大家记得使用宽度大于400px的指定缩略图哦！
本文由斑马转载，请仅供参考 此贴必火，高大上啊~
页:
[1]