In one of our content page, we have a Facebook share using og tags. The page has og:title with content having "#" and "#". This is getting generated in the run time HTML without any issues.
This is the runtime meta tag from webpage:
<meta property="og:title" content="Check out this awesome project, "interesting title of the event ", and see how we can all #interestingproject with test! #test
Saturday, Dec 2nd at 9:00am">
When this is successfully shared to Facebook, the title is displayed without "#" and "#". When I try to scrape the URL, the og:title shows up without "#" and "#". Tried to do a JavaScript encodeURI of this value. But does not help.
Tried to google as well search through Facebook docs. I could not find any explanation for this. OpenGraph documentation mentioned the value of the tags are Unicode string literals.
Does Facebook strip these characters?
Related
Hello please help me: if I paste link of my site to facebook message, facebook processes it to thumbnail + some text. There is text "Shop powered by PrestaShop". How do I change it?
Prestashop version 1.6.1.4.
Site address : http://myfleur.cz/
Thanks for any help.
Facebook's crawler scrapes the HTML of the URL that is shared. On a regular HTML page (similar to your case) this content is basic and may be incorrect, because the scraper has to guess which content is important, and which is not.
The good news is that you can take control of what the Facebook crawler picks up from each page by using Open Graph meta tags. These tags provide structured info about the page such as the title, description, preview image, and more.
So just add these meta tags in your homepage:
<meta property="og:url" content="<your-webpage-url>" />
<meta property="og:title" content="<new-title>" />
<meta property="og:image" content="<new-image-url>" />
(You can add other meta tags also as mentioned in the link mentioned)
P.S. You can use this url to debug, which content facebook is scraping from your website.
Hope that helps!
The solution in that case is go to
Preferences -> SEO & URLs -> index (edit)
and change there the Meta-Description.
I have been trying to make sure my pages in my new blog are absolutely correct when it comes to integration with facebook etc. When I put my URL in the facebook linter at:
http://developers.facebook.com/tools/debug
And put: myurl.com?fbrefresh=true
It complains that there are 'More Than One OG URL Specified'. I've checked the source and there is only one og:url, I've also checked it from the bottom link on the linter page itself where there is 'Scraped Url: See exactly what our scraper sees for your URL' and again I only found one og:url.
So why is it complaining?
The two URLs that according to facebook are in my page are identical!
You have specified an OG url in two places
<!-- Facebook Opengraph -->
<meta property="og:url" content="http://www.eve.com.mt/2012/11/16/is-living-abroad-something-for-everyone/">
and
<meta property="http://ogp.me/ns#url" content="http://www.eve.com.mt/2012/11/16/is-living-abroad-something-for-everyone/">
A possible cause for this in WordPress is using having two plugins update meta data at the same time.
If you are using the Official Facebook WordPress plugin, your meta might be inserted from it.
We have a like button. We populate the data-href with something like: http://foo.com/stuff/1?tracking=member1
When facebook scrapes our page for the title and images defined in the "og" meta tags, it disregards the original request parameters from the data-href. This means we can't customize the title and image based on the referring member, but this is exactly what we need to do.
We have tried all sorts of combinations of values for the data-href and og:url fields to no avail. Does anyone have any ideas?
within the head tags:
<meta content="This title should be based on the referring member" property="og:title"></meta>
<meta content="Content would go here" property="og:description"></meta>
<meta content="http://foo.com/stuff/1" property="og:url"></meta>
<meta content="http://foo.com/images/hello.png" property="og:image"></meta>
<meta content="Foolandia" property="og:site_name"></meta>
and then our like button tag:
<fb:like data-action="like" data-href="http://foo.com/stuff/1" data-ref="member1" data-send="false" data-show-faces="false" />
So, after several permutations and combinations, this is how we were able to address this issue:
We added the member id to the data-href (http://foo.com/stuff/1?tracking=member1) and removed the og:url from our meta-tags. Facebook now scrapes our page with the url: http://foo.com/stuff/1?tracking=member1 and we're able to customize the title and image displayed on facebook based on the referring member.
Thanks for all the help!
Are you sure the value for og:url tag your URL is returning to the Facebook crawler is the same one in the data-href? facebook will, if it finds a canonical meta tag or og:url tag on the scraped page, discard the metadata and retrieve metadata from the canonical URL instead.
You can test what facebook detects for a URL with Facebook's Debug Tool
My team recently launched a Web app that makes heavy use of Facebook's Like Button. Most of them work fine, but several of the Like URLs aren't recognized correctly by Facebook or its URL Linter. These URLs are for a page on our app that redirects to a corresponding page in a Facebook app...
Example URL:
http://www.3mframeworks.com/pages/redirect?url=http%3A%2F%2Fapps.facebook.com%2Fcouplespeak%3Fv%3Dvideos%26id%3D17
Facebook's URL Linter returns data as if the "id" parameter isn't there:
https://developers.facebook.com/tools/lint?url=http%3A%2F%2Fwww.3mframeworks.com%2Fpages%2Fredirect%3Furl%3Dhttp%253A%252F%252Fapps.facebook.com%252Fcouplespeak%253Fv%253Dvideos%2526id%253D17
Other Open Graph parsers return the correct data:
og:it: http://ogit.heroku.com/inspect?url=www.3mframeworks.com%2Fpages%2Fredirect%3Furl%3Dhttp%253A%252F%252Fapps.facebook.com%252Fcouplespeak%253Fv%253Dvideos%2526id%253D34
OpenGraph.In: http://www.opengraph.in/?url=www.3mframeworks.com%2Fpages%2Fredirect%3Furl%3Dhttp%253A%252F%252Fapps.facebook.com%252Fcouplespeak%253Fv%253Dvideos%2526id%253D34&format=html
I've spent hours searching for an explanation...
Facebook's documentation, under Editing Meta Tags, states:
"Note that og:title and og:type are only editable initially - after your page receives 50 likes the title becomes fixed, and after your page receives 10,000 likes the type becomes fixed." My Like counts are nowhere near these numbers.
"For the changes to be reflected on Facebook, you must force your page to be scraped. The page is scraped when an admin for the page clicks the Like button or when the URL is entered into the Facebook URL Linter. You can programmatically force your page to be scraped by cURL'ing the linter." I have tried all three of these methods without success.
Facebook Like button - fetches "wrong" image suggests that linting an URL doesn't reset the cache as Facebook claims.
Facebook Open Graph not clearing cache suggests this may be Facebook caching that will fix itself after an unknown period of time.
facebook like button liking wrong url suggests waiting 24-32 hours for Facebook's cache to be reset. It has been 64+ hours since my Open Graph tags were last set.
Why is Facebook returning the wrong page (affects Facebook Like and Share URL)? suggests that any URL provided to Facebook (e.g. via a Like Button) before being published should be changed. I tried changing the URL, renaming the id parameter, without success.
The most likely culprit seems to be Facebook caching, but it's already been suspiciously long and since this site is part of a currently live campaign that emphasizes Like activity, I'm hoping someone knows a trick to get this working ASAP. Thanks!
Some piece in Facebook's Graph API and URL Linter drops all but the first of multiple URL parameters.
Graph API
When the parameter string is "?v=videos&id=17", "id" is lost:
https://graph.facebook.com/http%3A%2F%2Fapps.facebook.com%2Fcouplespeak%3Fv%3Dvideos%26id%3D17
When the parameter string is "?id=17&v=videos", "v" is lost:
https://graph.facebook.com/http%3A%2F%2Fapps.facebook.com%2Fcouplespeak%3Fid%3D17%26v%3Dvideos
This doesn't happen if the Graph "id" parameter is declared explicitly: https://graph.facebook.com/?id=http%3A%2F%2Fapps.facebook.com%2Fcouplespeak%3Fv%3Dvideos%26id%3D17
Unfortunately that third point doesn't help my situation: I'm not accessing the Graph directly, so I can't just insert "?id=".
URL Linter
For my app, all parameters are needed to render the correct Open Graph meta tags, and the results support my discovery:
When the nested, encoded parameter string is "?v=videos&id=17", Open Graph tags are rendered for "3M Couple Speak Video Contest". This is the expected behavior when the "id" param is absent:
https://developers.facebook.com/tools/lint?url=http%3A%2F%2Fwww.3mframeworks.com%2Fpages%2Fredirect%3Furl%3Dhttp%253A%252F%252Fapps.facebook.com%252Fcouplespeak%253Fv%253Dvideos%2526id%253D17
When the nested, encoded parameter string is "?id=17&v=videos", Open Graph tags are rendered for "3M Couple Speak Translation Contest". This is the expected behavior when "v=videos" is absent:
https://developers.facebook.com/tools/lint?url=http%3A%2F%2Fwww.3mframeworks.com%2Fpages%2Fredirect%3Furl%3Dhttp%253A%252F%252Fapps.facebook.com%252Fcouplespeak%253Fid%253D17%2526v%253Dvideos
This doesn't happen with non-nested, non-encoded parameter strings:
https://developers.facebook.com/tools/lint?url=http%3A%2F%2Fapps.facebook.com%2Fcouplespeak%3Fv%3Dvideos%26id%3D17
For other Open Graph parsers, switching the order of nested, encoded parameters yields the same data, which is correct:
http://ogit.heroku.com/inspect?url=www.3mframeworks.com%2Fpages%2Fredirect%3Furl%3Dhttp%253A%252F%252Fapps.facebook.com%252Fcouplespeak%253Fv%253Dvideos%2526id%253D17
http://ogit.heroku.com/inspect?url=www.3mframeworks.com%2Fpages%2Fredirect%3Furl%3Dhttp%253A%252F%252Fapps.facebook.com%252Fcouplespeak%253Fid%253D17%2526v%253Dvideos
Unfortunately, again, that third point doesn't help my situation: we need to nest and encode the URL.
This explains the bad data I'm seeing, and why it only happens to the URLs with multiple parameters. I submitted a bug report to Facebook.
The iframe source on that Facebook page is at this url it seems:
couplespeak-3m-production.heroku.com/videos
and that page contains the tags that show up in the Facebook Linter.
<meta content='3M Couple Speak Video Contest' property='og:site_name' />
<meta content="3M Couple Speak Video Contest" property="og:title" />
<meta content="website" property="og:type" />
<meta content="http://apps.facebook.com/couplespeak?v=videos" property="og:url" />
<meta content="http://www.3mframeworks.com/images/video_background.jpg" property="og:image" />
<meta content="100001154487117" property="fb:admins" />
I have a Facebook Application with an iframe based canvas that contains a like button (also iframe), in the head of my iframe i've specified the standard meta tags (og:title, og:url, og:site_name) and they seem to work fine (the information is displayed correctly in the profile wall) except for the title.
I've tested various links of the app with the Facebook URL Linter and the ug:title tag is ignored completly.
Have any of you had any trouble with the open graph tags inside facebook applications?
Any ideeas are apreciated, thanks.
I've tried every possible combination and suggestion in adding og meta tags to my page, but none of them worked. When testing URL with facebook URL Linter it always returned default values defined on application admin page. Like it doesn't see og meta tags. And what was more interesting is that when I look the page source, og meta tags existed but haven't been evaluated by facebook or linter.
Now, in my canvas page I defined login/authentication (and depending redirection etc) at the top, before html and og meta tags definition, and that was the main problem.
If you perform FB login redirection/authentication before providing og meta tags,
then FB crawlers/linter will not be able to detect your meta info and will try to auto-fill it.
I'm having the same problem in my app http://apps.facebook.com/tripline It seems that Facebook doesn't process links to pages inside apps the same way as pages they hit directly.
You can see the difference in the URL Linter:
The og:url on the canvas page: http://apps.facebook.com/tripline/trip.php?id=2015071615051003BEE6FBED6F531103 (og:title is ignored, get trip.php instead)
The url to the actual page loaded in the iframe: http://www.tripline.net/api/fbcanvas/trip.php?id=2015071615051003BEE6FBED6F531103#frame-top (og:title correct, but can't link to this because it's not in the frame)
The page on the main site: http://www.tripline.net/trip/The_Boston_Freedom_Trail-2015071615051003BEE6FBED6F531103 (og:title correct, if i can't figure things out, i'm just going to set the og:url on the canvas page to this)
Not really an answer, but at least you know you're not alone or crazy...which is worth something.