Facebook sharer.php, how to have multiple og:image tags? [duplicate]

北城以北 提交于 2019-11-28 19:19:36
Eddie

I've been using multiple images for a while now. Use multiple og:image meta tags like this:

<meta property="og:image" content="http://www.example.com/image01.jpg">
<meta property="og:image" content="http://www.example.com/image02.jpg">

Any pages that have already been shared (with one image) can be updated by loading the link in the debugger/linter here: https://developers.facebook.com/tools/debug/

The debugger/linter will not show a preview of all the images – it just shows the last one (I believe below it does mention what images it has pulled through) however it does work.

I came here with the same problem. After some digging, I found that you can have multiple og:image tags.

From Facebook Developers, under og:image:

We support PNG, JPEG and GIF formats. You may include multiple og:image tags to associate multiple images with your page.

Keep in mind it may take some time for Facebook to recognize that you have added new images to the meta as the spider does cache. Links you have already shared using the like button or copied into your status are affected by this.

EDIT: If you're having problems with Facebook showing the same images even though you've changed your OG tags, it's probably because Facebook has cached it. If this is the case, go check out your tags using Facebook's OG Debugger here.

I found a solution to this by adding the images to the body and not in the meta information, then just hiding them, like this;

<body> ...

<img src="http://image1" width="41" height="41" border="0" alt="text describing the image" style="visibility:hidden" /><br/>

<img src="http://image2" width="41" height="41" border="0" alt="text describing the image" style="visibility:hidden" /><br/>

etc ... </body>

It just came to me from reading that if no og:image property is given then thumbnails are taken from the body, and it worked even if hidden. You could probably remove the width, heigh etc to tidy it up, but I thought why both waste time with that when it gets hidden anyway, I just cut and paste and made it hidden.

Hope this helps.

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!