According to my testing, Facebook's crawlers do not render client-side templates like a browser.
I want to avoid a webserver and building HTML files for Open Graph objects at all costs. I want to generate the meta tags on the fly via the URL, but it seems Facebook cannot do this.
Can someone from Facebook please confirm? I asked the head of Open Graph at #mobiledevcon and she said that Facebook can render stuff like {{value}}
My meta tags are as follows, and they render fine in every browser. But the Facebook Open Graph Debugger only sees the raw text, not the interpolated content.
<meta property="{{meta.property}}" content="{{meta.content}}">
When you think about it it should be clear, why this does not work.
The Facebook crawler downloads the HTML as it is served by the server. The Facebook crawler will not execute any JavaScript, like all the crawler will not execute the JavaScript. This is due to security restrictions and for speed reason (they do not have the time execute JavaScript on their servers.)
There is no way around this. If you want the crawler to index you page, you need to give them directly what you want them to read.
Tip: You could use something like phantom.js to render your pages on the server side and serve this to the crawlers.
The solution is basically to use some kind of server-side user-agent detection to pick up whenever a social media crawler arrives.
Use the ?_escaped_fragment_ method along with a prerender service. Facebook will respect the same crawlable Ajax specification as Google. Please see https://developers.google.com/webmasters/ajax-crawling/docs/specification
Related
I have been reading about using Open Graph (OG) meta tags to improve the way facebook works with your website. I have read two tutorials that say to create an application and use the application ID. But I am not developing an application, all I have is a business page... Can I just the page ID?
Can anybody also point out any good, simple resources around the using OG in my website?
Thanks
The sharer.php method (which is deprecated) allows you to post without an application. The feed/post method appears to require an app_id, though it's possible that there's some way around that. On the bright side, there's nothing complex about creating an application, so, if that's what you must do, I'd say just do it :)
Here is an example of how it works *with an app using the feed/post method (you'll need to click the "Post to feed" link at the top (yes I know it doesn't look like a link!).
and Here is the same exact example only using Sharer (notice that this time it's pointing at a slightly different url (drawImageForFB2.php instead of drawImageForFB4.php).
I use a php to render the tags based on the vidId that I collect but that's neither here nor there... you could just as easily have this as a static HTML page.
The innards of the OG tag are just about identical and the app_id tag in the OG is entirely optional as it pertains to the second example).
Oh, and addthis does it using the dialog api which looks like this
https://www.facebook.com/dialog/feed?redirect_uri=http://s7.addthis.com/static/postshare/c00.html&app_id=140586622674265&link=http://support.addthis.com/customer/portal/articles/381222-optimize-facebook-sharing#.UQ8bBJM9KQk.facebook&name=Optimize%20Facebook%20Sharing&description=
I was wondering if Search Engine spiders can see the comments, when I open the source of the page the comments are not showing up (same as with disqus), so I'm assuming when the search engines crawl the page they won't see the comments either? Is this assumption correct? If so, is there a way to change this?
Found the solution:
http://developers.facebook.com/docs/reference/plugins/comments/
How can I get an SEO boost from the comments left on my site?
The Facebook comments box is rendered in an iframe on your page, and
most search engines will not crawl content within an iframe. However,
you can access all the comments left on your site via the graph API as
described above. Simply grab the comments from the API and render them
in the body of your page behind the comments box. We recommend you
cache the results, as pulling the comments from the graph API on each
page load could slow down the rendering time of the page.
Only what get thrown to a crawl engine the crawl engine can see, hence these comments should be outputted in able to get crawled and saved into the SE database or whatever it uses to collect data about websites, you might check the headers the connection request came from, if it belongs to a crawl engine and that's called a user agent in our case humans (browsers), here you can find a way to detect crawlers using PHP, after detecting it you force the comments to be shown in order to get crawled, here also a good resource on how to deal with crawlers from Google itself.
Now if you're talking about Facebook comments, it's impossible to let them indexed by the crawler or SE, when a crawler attempt to visit one of the Facebook pages it won't be able to see users' data because of the login page, and if you are talking about Facebook plugins you may do what what I suggested above, article talking about Facebook comments crawling.
My site has a feed system and when user clicks on any one of those feed snippets (the object), I want the action to be publish in their Facebook news feed. So I'm really confused on how to go about it because as far as I'm aware this is how you post actions on Facebook's JavaScript SDK:
FB.api('/me/namespace:action?object=url','post')
How do you dynamically change the properties of the object? Are there parameters you can send? As far as I'm concerned, Facebook asks you to give pass a URL and it'll grab the <meta> information from that URL?
Am I supposed to perform a GET request with my own server and change the meta tags dynamically. This sounds like more work than it needs to be. For example, what if the feed includes a paragraph of text, it'll be impractical for me to post that as a get request and then urldecode the entire thing.
I'm not sure I totally understand your question, but...
You can dynamically change the tags for facebook og: properties, but you have to do it before the page loads (e.g. using PHP as opposed to javascript). After you send the post using the javascript SDK, facebook crawls the page and looks for the info in the og: meta tags.
I'm working on a few e-commerce applications where I'd like users to be able to 'Like' products. It's not always possible to embed the og: meta tags on the page that's being 'Liked', either because it's not in our control, or because it's deep in an AJAX application.
I've hit upon the idea of building a proxy for OpenGraph objects. I can point the Like button to the proxy URL, which will serve up all the og: metadata describing the product, including a canonical URL.
The trouble is that Facebook follow the canonical URL and parse that for metadata, rather than the proxy page.
Is this a bug in FB's parser, or am I missing something?
I'd appreciate any help or clarification you could offer.
Thanks in advance,
Ross
If you're using the <link rel="canonical" ...> tag, maybe try to exclude it from the proxy page's source code when the user-agent of the user is the Facebook user-agent. This way, user's browsers and search engines see and recognize the canonical url, and the Facebook page crawler doesn't.
Is there a way to embed a Facebook page wall into a website? Without using Graph API?
I want to have the wall exactly as styled from Facebook, with all actions to Like, Comment and Share but from my website.
I'm sorry but there is no way to easy reproduce your wall on your website. You can easily get contents (but it will not reflect the facebook's wall as some content is filtered), using facebook's javascript sdk or graph api, but you won't be able to add universal like button using javascript sdk for every posts, as facebook requires to like some objects (like pages) directly with their like social plugin.
You can check a lot of facebook widgets you can easily implement on your website using Javascript SDK on the fbrell application.
Happy facebook programming!
Based on these requirements, would an iframe produce the desired effect? Maybe even a regular frame? (I haven't used those in a long time, so I don't remember if there's some restriction that would prevent loading external content with them).
When you say you want these actions "from your website" what exactly do you mean? Do you just want to wrap the Facebook content with your own (in a frame) or do you want to actually do something locally with these actions, intercepting them somehow?
You will need to use FBML. or custom code from for using Graph API, i dont think you can do it any other way. look up facebook documentaion for details.
There is no way you can embed the same wall, yet you can use paste your wall's contents on your webpage,
If you want Share, Like and comment button to perform action on your webstie then you have to create your own db and user management
But...
Share, Like and Comment buttons which will effect your original wall in facebook is not possible.
double think. I have been working on a Wall Feed for Pages for some time now, what you are looking for can be done, but you would need to use the Graph API to accomplish..
Sample Here http://shawnsspace.com/plugins/wallfeed.php Likes, Commenting is disabled.
Emulates the Wall for http://facebook.com
I used a combination of Graph API "PHP-SDK 3.1.1", "Javascript SDK". This can be done with pure client side Javascript though.