I have problem with Facebook-sharing my page with visible image.
Address is: http://www.fotomachina.pl/steosoft/test/test2/
When I share it on Facebook title and description shows correctly but instead of image there is blank white space.
What's wrong? Below my tags used in of the website:
<link rel="image_src" href="http://www.fotomachina.pl/steosoft/test/test2/gif/2017_07_19_14_06_10_small.jpg" />
<meta property="og:title" content="Test Page Title test" />
<meta property="og:site_name" content="Test Page" />
<meta property="og:url" content="http://www.fotomachina.pl/steosoft/test/test2" />
<meta property="og:description" content="Test Page Description Content test" />
<meta property="og:type" content="article" />
<meta property="og:image" content="http://www.fotomachina.pl/steosoft/test/test2/gif/2017_07_19_14_06_10_small.jpg" />
<meta property="og:image:type" content="image/jpg" />
<meta property="og:image:width" content="750" />
<meta property="og:image:height" content="563" />
<meta property="article:author" content="https://facebook.com/fotomachina" />
Some cache on server was causing problems. Question is irrelevant.
Related
I am trying to get an S3 video to play in line on Facebook. My site is https://sigtwo.com/vlog/14/.
S3 Video: https://s3.amazonaws.com/spsttestbucket/20190220_142312_NF_2000k.mp4
I believe I used the proper tags as other parts of the post seem to work fine.
Meta tags are as follows:
<meta property="og:title" content="SigTwo Mapping & Imagery Solutions" />
<meta property="og:type" content="website" />
<meta property="og:url" content="http://sigtwo.com/vlog/14/" />
<meta property="og:description" content="Too many potholes on Storrow Drive after this winter. Someone needs to fix it." />
<meta property="og:image" content="http://sigtwo.com/static/img/OrangeMaskHeight500.png" />
<meta property="fb:app_id" content="571517186592163" />
<meta property="og:video:url" content="https://s3.amazonaws.com/spsttestbucket/20190220_142312_NF_2000k.mp4" />
<meta property="og:video:type" content="video/mp4" />
<meta property="og:video:height" content="720" />
<meta property="og:video:width" content="1280" />
Here are results of debugger where everything seems fine:
https://developers.facebook.com/tools/debug/sharing/?q=http%3A%2F%2Fsigtwo.com%2Fvlog%2F14%2F
when facebook share debugger is scraping the page it shows this warning:
The 'og:image' property should be explicitly provided, even if a value can be inferred from other tags.
The following required properties are missing: og:url, og:type, og:title, og:image, og:description, fb:app_id
although all these meta tags are in the page when we look at the page source code like below:
<meta property="fb:app_id" content="966242223397117" />
<meta property="og:title" content="asaaaa" />
<meta property="og:image" content="" />
<meta property="og:image:width" content="900" />
<meta property="og:image:height" content="578" />
<meta property="og:site_name" content="+INP" />
<meta property="og:description" content="saaasaaa" />
<meta name="twitter:description" content="sasdaaaa">
<meta property="og:url" content="https://www.inp.plus/news/45792" />
<meta property="og:type" content="article" />
the thing is it does not read those tags with this type of link
/news/34131
but it does read the same tags with other type of links
articles/321
with tags like below:
<meta property="fb:app_id" content="966242223397117" />
<meta property="og:title" content="asdaaaa" />
<meta property="og:image" content="https://www.inp.plus/userfiles/Image/articles/2018/05/20180511_39395.jpg" />
<meta property="og:image:width" content="900" />
<meta property="og:image:height" content="581" />
<meta property="og:site_name" content="+INP" />
<meta property="og:description" content="fdaaaa" />
<meta name="twitter:description" content="asdfaaa">
<meta property="og:url" content="https://www.inp.plus/articles/299" />
<meta property="og:type" content="article" />
I mean is there a difference between them to make the second one seen by the facebook scraper not the first one.
I have the below tags in my facebook share page but the image is not appearing for the first time in my share dialogue box.
<meta property="fb:app_id" content="xxxxx" />
<meta property="og:type" content="article" />
<meta property="og:site_name" content="xxxx" />
<meta property="og:url" content="http://web.dailyhunt.in/buzz/video/english/fresh/but-gabriel-boschilia-24-as-monaco-fc-lorient-4-0-2016-17-frsh-hi-139074" />
<meta property="og:title" content="But Gabriel BOSCHILIA (24') / AS Monaco - FC Lorient (4-0) - / 2016-17" />
<meta property="og:image" content="http://tcdn.newshunt.com/images/items/1/3/9/0/74/139074_share.jpg" />
<meta property="og:image:width" content="400" />
<meta property="og:image:height" content="300" />
Search for solution and found Facebook ignoring OG image on first share.
But I have already added those tags. Please suggest where am I wrong.
I have a web page that shows video and people can share it to facebook.
here are the open graph meta tags im using:
<meta property="fb:app_id" content="app_id" />
<meta property="og:url" content="https://www.domain.com/show/245" />
<meta property="og:type" content="website" />
<meta property="og:title" content="Website tile" />
<meta property="og:description" content="Website description" />
<meta property="og:video" content="https://www.domain.com/uploads/09250522_18.mp4" />
<meta property="og:video:url" content="https://www.domain.com/uploads/09250522_18.mp4" />
<meta property="og:video:secure_url" content="https://www.domain.com/uploads/09250522_18.mp4" />
<meta property="og:image" content="https://www.domain.com/uploads/thumbnail.png" />
<meta property="og:video:type" content="video/mp4" />
<meta property="og:video:width" content="1280" />
<meta property="og:video:height" content="720" />
*not actual domain name and app id, for privacy purpose
When i check the page using sharing debugger, it works okay, no error whatsoever.
The shared video also looks okay, just like normal video. But when i try to play it, it shows "download file" link to the video file instead.
Any idea why this is happening? i tried using different video, using 3rd party tools like addThis to generate the share button, but the result is the same.
Just figured it out!
You need to call "og:video:type" before you set video source.
I know it's weird, but this prevents api to set video source to "flash".
So your meta tag should look like this:
<meta property="og:url" content="someurl" />
<meta property="og:type" content="video.other" />
<meta property="og:title" content="yourtitle" />
<meta property="og:image" content="https://url.com/img.png">
<meta property="og:video:type" content="video/mp4"/>
<meta property="og:video" content="https://url.com/video.mp4" />
<meta property="og:video:url" content="https://url.com/video.mp4" />
<meta property="og:video:secure_url" content="https://url.com/video.mp4" />
<meta property="og:video:width" content="videoWidth"/>
<meta property="og:video:height" content="videoHeight"/>
<meta property="fb:app_id" content="id" />
I shared my site in fb and in place where the image should be it says just "index of /". ??
I have these in my head:
<head prefix="og: http://ogp.me/ns#">
<meta name="viewport" content="width=device-width, initial scale=1.0"/>
<meta property="og:description" content="Graphic design etc other stuff..." />
<meta property="og:title" content="Audiovisual" />
<meta property="og:locale" content="en_US" />
<meta property="og:image" content="/images/ogimage.png" />
<meta property="og:image:type" content="image/png" />
<meta property="og:image:width" content="1200" />
<meta property="og:image:height" content="630" />
<link rel="canonical" href="http://audiovisuaalinen.work/english.html" />
<meta property="og:url" content="http://audiovisuaalinen.work/english.html" />
<meta property="og:type" content="product" />
<meta property="fb:admins" content="1385587538423284" />
If you want to control more of what Facebook uses in their snippets, you can add open graph tags to your site. Then Facebook will use those tags to populate the title, description, thumbnail, etc. when shared on Facebook.
You have to use an absolute URL for the Open Graph image:
<meta property="og:image" content="http://audiovisuaalinen.work/images/ogimage.png" />