I have a website page (https://ondeajudo.com/projeto/b710e2eaf38844aabbfc251a46006cde) where I added the meta tags for Facebook images as follows:
<meta property="og:image" content="https://projectify-bucket.s3.amazonaws.com/project_pictures/2017-05-17/f256709d685122ed83feab210cad5557-1495044621290.png" />
<meta property="og:image:url" content="https://projectify-bucket.s3.amazonaws.com/project_pictures/2017-05-17/f256709d685122ed83feab210cad5557-1495044621290.png" />
<meta property="og:image:secure_url" content="https://projectify-bucket.s3.amazonaws.com/project_pictures/2017-05-17/f256709d685122ed83feab210cad5557-1495044621290.png" />
<meta property="og:image:type" content="image/png" />
<meta property="og:image" content="https://projectify-bucket.s3.amazonaws.com/project_pictures/2017-05-17/f256709d685122ed83feab210cad5557-1495044684603.png" />
<meta property="og:image:url" content="https://projectify-bucket.s3.amazonaws.com/project_pictures/2017-05-17/f256709d685122ed83feab210cad5557-1495044684603.png" />
<meta property="og:image:secure_url" content="https://projectify-bucket.s3.amazonaws.com/project_pictures/2017-05-17/f256709d685122ed83feab210cad5557-1495044684603.png" />
<meta property="og:image:type" content="image/png" />
<meta property="og:image" content="https://projectify-bucket.s3.amazonaws.com/project_pictures/2017-05-17/f256709d685122ed83feab210cad5557-1495044625413.png" />
<meta property="og:image:url" content="https://projectify-bucket.s3.amazonaws.com/project_pictures/2017-05-17/f256709d685122ed83feab210cad5557-1495044625413.png" />
<meta property="og:image:secure_url" content="https://projectify-bucket.s3.amazonaws.com/project_pictures/2017-05-17/f256709d685122ed83feab210cad5557-1495044625413.png" />
<meta property="og:image:type" content="image/png" />
When I post this link in my Facebook timeline to share, all images shows up correctly for selection.
sharing inside Facebook using the page url
But when I use the share button inside my website using the Facebook sdk, only the first image shows up and no selection is possible.
How do I allow image selection when sharing through the facebook sdk inside my page?
Thanks
<meta property="og:image" content="https://projectify-bucket.s3.amazonaws.com/project_pictures/2017-05-17/f256709d685122ed83feab210cad5557-1495044621290.png" />
<meta property="og:image:url" content="https://projectify-bucket.s3.amazonaws.com/project_pictures/2017-05-17/f256709d685122ed83feab210cad5557-1495044621290.png" />
<meta property="og:image:secure_url" content="https://projectify-bucket.s3.amazonaws.com/project_pictures/2017-05-17/f256709d685122ed83feab210cad5557-1495044621290.png" />
<meta property="og:image:type" content="image/png" />
<meta property="og:image" content="https://projectify-bucket.s3.amazonaws.com/project_pictures/2017-05-17/f256709d685122ed83feab210cad5557-1495044684603.png" />
<meta property="og:image:url" content="https://projectify-bucket.s3.amazonaws.com/project_pictures/2017-05-17/f256709d685122ed83feab210cad5557-1495044684603.png" />
<meta property="og:image:secure_url" content="https://projectify-bucket.s3.amazonaws.com/project_pictures/2017-05-17/f256709d685122ed83feab210cad5557-1495044684603.png" />
<meta property="og:image:type" content="image/png" />
<meta property="og:image" content="https://projectify-bucket.s3.amazonaws.com/project_pictures/2017-05-17/f256709d685122ed83feab210cad5557-1495044625413.png" />
<meta property="og:image:url" content="https://projectify-bucket.s3.amazonaws.com/project_pictures/2017-05-17/f256709d685122ed83feab210cad5557-1495044625413.png" />
<meta property="og:image:secure_url" content="https://projectify-bucket.s3.amazonaws.com/project_pictures/2017-05-17/f256709d685122ed83feab210cad5557-1495044625413.png" />
<meta property="og:image:type" content="image/png" />
Related
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.
I am trying to post two videos in single playlist without using any flash player. I have tried following code.
<meta property="og:site_name" content="Test" />
<meta property="og:url" content="LINKING_URL" />
<meta property="og:title" content="test!!!!" />
<meta property="og:image" content="preview_image_url" />
<meta property="og:type" content="video.tv_show" />
<meta property="og:video:url" content="http://mydomain/video1.mp4" />
<meta property="og:video:secure_url" content="https://mydomain/video1.mp4" />
<meta property="og:video:url" content="http://mydomain/video2.mp4" />
<meta property="og:video:secure_url" content="https://mydomain/video2.mp4" />
<meta property="og:video:type" content="video/mp4" />
<meta property="og:video:width" content="480" />
<meta property="og:video:height" content="360" />
By applying this, First video is displaying on my FB wall and its playing also.
Actually I need to add two videos in single post video but its adding only one.
I have tried with video.episode, video.other, video.movie. But there is no successful result.
Any Suggestion?
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" />
I am hosting videos on a website, and have created Open Graph video tags so that when a page like example.com/video/my-new-video is shared on Facebook that video can be played in the Facebook newsfeed, but there's no link back to example.com/video/my-new-video.
The Open Graph tags in this case look like this:
<meta property="og:title" content="My New Video" />
<meta property="og:description" content="This is my new video about sharing videos" />
<meta property="fb:app_id" content="xxxxxxxxxxxxx" />
<meta property="og:image" content="http://example.com/video/my-new-video/poster-image.jpg" />
<meta property="og:url" content="http://example.com/video/my-new-video/" />
<meta property="og:type" content="video" />
<meta property="og:video" content="http://example.com/video/my-new-video/video-file.swf" />
<meta property="og:video:secure_url" content="https://example.com/video/my-new-video/video-file.swf" />
<meta property="og:video:type" content="application/x-shockwave-flash" />
<meta property="og:video:width" content="1280" />
<meta property="og:video:height" content="720" />
If I remove the og:video URL that points to the SWF to play the video I get the video's image and description with a link to example.com/video/my-new-video but it's not possible to play the video in the Facebook newsfeed.
The Open Graph tags in this case look like this:
<meta property="og:title" content="My New Video" />
<meta property="og:description" content="This is my new video about sharing videos" />
<meta property="fb:app_id" content="xxxxxxxxxxxxx" />
<meta property="og:image" content="http://example.com/video/my-new-video/poster-image.jpg" />
<meta property="og:url" content="http://example.com/video/my-new-video/" />
<meta property="og:type" content="video" />
<meta property="og:video" content="http://example.com/video/my-new-video/iframe-embed.php" />
<meta property="og:video:secure_url" content="https://example.com/video/my-new-video/iframe-embed.php" />
<meta property="og:video:type" content="text/html" />
<meta property="og:video:width" content="1280" />
<meta property="og:video:height" content="720" />
Is there a way to both let the video play in the Facebook feed and link back to the page it's on?
im trying to display the player from Vimeo on the facebook wall (after clicking the link share).
<html>
<head>
<title>Some title</title>
<meta name="title" content="Some title" />
<meta name="description" content="Some description" />
<link rel="image_src" href="http://b.vimeocdn.com/ts/xxx/xxx/xx.jpg" />
<link rel="video_src" href="http://player.vimeo.com/video/XXXXXX" />
<meta name="video_height" content="360" />
<meta name="video_width" content="640" />
<meta name="video_type" content="application/x-shockwave-flash" />
<meta name="medium" content="video" />
</head>
<body></body>
</html>
using this, facebook doesn't load the video directly. Im not sure why its not working, so anyone with experience - can you tell me where i fail?
Use the new Facebook open graph meta tags. I grabbed the vimeo link by going to a vimeo video, clicking embed, clicked "old embed code", and grabbing the url.
<meta property="og:image" content="http://b.vimeocdn.com/ts/xxx/xxx/xx.jpg"/>
<meta property="og:video" content="http://vimeo.com/moogaloop.swf?clip_id=xxxxxxxx&server=vimeo.com&show_title=1&show_byline=1&show_portrait=1&color=00ADEF&fullscreen=1&autoplay=0&loop=0" />
<meta property="og:video:height" content="360" />
<meta property="og:video:width" content="640" />
<meta property="og:video:type" content="application/x-shockwave-flash" />