I am working on an real estate applicatoin and using facebook like in that.
Url : 21flats.com
you can see 3 deals at home page. if you will click on the deal name then it will show the detailed page where you will have facebook like. Now the problem is with the facebook liking of deals. every deal is submitting/posting with a random image. I mean when you click facebook like then it does not post the og:image but sometimes do. You can view source the page. You can click on each of the deals and can see different thing happening.
Thanks
Shamrma - this is related to your use of OG:type Only the root of the domain 21flats.com should have the OG:type of website, all other pages should be article or what they represent. You can read about the proper usage of OG:type here https://developers.facebook.com/docs/opengraph/#types
Use article for any URL that represents transient content - such as a
news article, blog post, photo, video, etc. Do not use website for
this purpose. website and blog are designed to represent an entire
site, an og:type tag with types website or blog should usually only
appear on the root of a domain.
EDIT: 11/14/2011 - 10:45am CST.
The Open Graph protocol defines four required properties:
og:title - The title of your object as it should appear within the
graph, e.g., "The Rock".
og:type - The type of your object, e.g., "movie". See the complete
list of supported types.
og:image - An image URL which should represent your object within the
graph. The image must be at least 50px by 50px and have a maximum
aspect ratio of 3:1. We support PNG, JPEG and GIF formats. You may include multiple
og:image tags to associate multiple images with your page.
og:url - The canonical URL of your object that will be used as its
permanent ID in the graph, e.g.,
http://www.imdb.com/title/tt0117500/.
Related
Here's the scenario, when you post a link to Facebook, the scraper makes an open graph story based on og tags. However, I woudl like to know if it's possible to change the image retrieved by the scraper with one loaded by the user.
Imagine it like this, I want to post a link but the referenced site has no image, I'd like to modify the story so that its image is one I upload manually. Is that possible?
I found the answer in the API as suggested by CBroe. To clarify, I'm posting to a page, not to a profile, so I used the parameter link to, obviously, specify the link I was sharing. I also used the parameter picture to replace the thumbnail the scraper fetches with one I wanted.
This picture is a url, not an uploaded file, if someone is wondering.
So, the final array that will be sent to Facebook's API looks like this:
$data = ['message' => 'your message', 'link' => 'your-link.com', 'picture' => 'url/to/image.jpg'];
As I said, this will post a link to a page and replace the thumbnail fetched from Facebook's scraper with the image specified in the picture parameter.
Hope this helps anyone else with the same question :)
If I correct understood your question.
FB takes image from OG tag, no other way, also you cannot change this tag dynamically. I faced a long time ago with problem, that scraper could not find image on dynamically generated page. The solution was - send to FB another permament link. For example - permament link on main page site.com/module, this page for sharing to FB site.com/module/?c=123123123 (generated page by user, $c - here uniq parameter which was responsible for image in OG tag)
So - anyway if want to share page with picture - it should be contained in OG tags.
If you share a definition page on Facebook from UrbanDictionary.com, the preview image is a screenshot of the definition itself. The same image appears on Google Images. The URL of the image is http://urbandictionary.com/render_definition.php?defid=[the same id as the post]
My question is, how do I make my website do that? I have a website with quotes and would like each quote to be indexed in Google Images as well as display as preview image when shared on social media. I use Wordpress, if that is relevant.
You should be able to use OpenGraph og:image to set an image URL for your page. You need to have a page that will render the image for you.
<meta content="<page_image_url>" property="og:image">
AFAIK, WordPress has a service called mShots that can take snapshots of your page for you. I couldn't find terms of service for it; but if you want to take that route, the following URL will generate a snapshot of http://example.com:
http://s.wordpress.com/mshots/v1/http://example.com/
I've been searching for this a lot but have not found exactly what I'm looking for.
So, I have a page (index.php) which displays my YouTube channel's uploaded videos as thumbnails, and either displays them inline above the thumbnails, or as links that redirect to Youtube. What I'd like to do, is to get the video's ID (which is in the a href link) and post it to another page (video.php) that shows the full embedded video (of the ID in question), with title & description. Is this possible to do?
My site is loosely based on this: http://www.yvoschaap.com/youtube.html and I've tried Youmax, but like said, they only play videos inline. I want to pass the ID of a clicked video as a parameter to the video.php page.
Sorry if this is confusing, but I'm still quite new to programming :)
You can look into Youtube Data API.
The main link you will need to retreive a list of all Videos for a channel will be somewhat like:
https://www.googleapis.com/youtube/v3/search?key={your_key_here}&channelId={channel_id_here}&part=snippet,id&order=date&maxResults={number_of_videos_you_want}
It will recieve it's response in JSON Format containing information like your Video ID which you can pass as Parameter to your video.php page
I'm building an image library site. It will be mostly private but I'd like users to be able to directly use certain images in facebook posts by special URLs.
The URLs look plain enough: http://example.com/some/path/image.jpg although they're actually generated on demand by a script.
But when I paste that URL (the URL of the image, not a page with the image on) to Facebook it just comes up with the domain name; it does not thumbnail the image.
There are many questions about open graph meta tags - but that's to do with pages, and this question is about the case of a post with a direct image URL. I notice that it works for images from imgur, for example.
Is there something in the way the image is served, or something about the quality of the image itself that I can change to get facebook to work? Or is it just something like facebook knows to treat certain image sites a different way?
Thanks.
I think Facebook grabs the image using some kind of OpenGraph "Browser". So you need to serve it meta information depending on the User-Agent, which is
facebookexternalhit/1.1 (+https://www.facebook.com/externalhit_uatext.php)
for Facebook.
So when a user browser hits your URL you serve the image, when it's facebook you serve it open-graph meta-data.
The only thing, off the top of my head, that I can think of is your favicon for that page.
Visit http://www.w3.org/2005/10/howto-favicon for information on favicons in html.
This question already has answers here:
Closed 11 years ago.
Possible Duplicate:
How does Facebook Sharer select Images?
When I attach a link on facebook I get the title, url, description and images from that page.
But facebook separates the images and gives just the important ones. And this is what I don't understand.
For example, attach this link
http://tonlinegames.com/
- This is a gaming site with photos about the games.
When you attach it facebook will give you as results only the image about the games, but there are a lots of other images like buttons and so one.
Facebook makes use of Open Graph meta tags when available:
http://developers.facebook.com/docs/opengraph
Otherwise, it probably just uses common sense heuristics (title, h1, p tags, large images, etc).
There is an official tool called URL Linter that displays which info facebook takes from the page. It doesn't explain which exact rules it uses but there is some useful info in the "debug" section.
there some patterns that facebook could be trying.
like the first image that is greater than 50x50 (usually the first big image is the right one).
or maybe it looks for the image that is a link to the site itself, since many sites have one like this.
probably facebook combines more than one of these kind of patterns to be more accurate.
It probably just looks at the largest images within the body of the website. I'm sure they also have some constraints on what image size can be. Too small wouldn't work when coming up in somebodies feed.