I included Open Graph Tags to convert my web page to a Facebook page so that if I like my web page, it should appear in Likes & Interests in my Facebook profile. But its not working.
Following are the open graph tags i am including:
<meta property="og:title" content="Proto"></meta>
<meta property="og:url" content="<?=SITE_URL?>"></meta>
<meta property="og:site_name" content="Proto"></meta>
<meta property="og:description" content="Lets you create prototypes for web apps." />
<meta property="og:image" content="<?=SITE_URL?>images/proto.jpg" />
<meta property="og:type" content="website"></meta>
<meta property="fb:app_id" content="284826761590524"/>
I included the Facebook Like button on my site. When I click Like, it does say Haris likes this, but this site does not appear in my Likes & Interests section. Why ???
After converting to Timeline view I did find the Like i made in the Likes section.
Related
I have added the appropriate OG Meta tags to my page (http://yorkschool.korkoladesign.com).
<meta property="og:title" content="Prospectus"/>
<meta property="og:type" content="article"/>
<meta property="og:url" content="http://yorkschool.korkoladesign.com/index.php"/>
<meta property="og:image" content="http://yorkschool.korkoladesign.com/application/files/2914/4908/7529/The_York_School.JPG"/>
<meta property="og:site_name" content="The York School"/>
<meta property="fb:app_id" content="************"/>
<meta property="og:description" content="Test - Our faculty embodies the qualities we hope to inspire in our students: empathy, responsiveness, inventiveness, insight and critical thinking."/>
When I use the OG Object Debugger, it grabs the correct info for each property but when I look at the "When shared..." section, none of this info is there. It still uses the same default info that was present before I added the OG tags. What am I missing?
You have to use the facebook debug tool to fetch your new meta information. Go to https://developers.facebook.com/tools/debug/ enter your URL and click "Fetch new scrape information" to refresh all meta data.
I have a blog where I publicate posts weekly, or whatever. The point is I added opengraph meta elements to my HTML code:
<meta property="og:image" content="http://..." />
<meta property="og:title" content="...">
<meta property="og:description" content="...">
<meta property="og:url" content="http://...">
When I changed my code then disappears the Facebook likes from my posts. Thats all of my modifications. I think this isn't a big thing.
Is there any reason why disappers the likes?
Is there any HTML/PHP/jQuery code to share picture on twitter and facebook? Not just the src of picture, but to display the picture on the sharing screen.
There's PHP & HTML, but not jQuery
Facebook
Facebook has something called Open Graph Protocol, to install them add the following meta tag between <head> of your page
<meta property="og:title" content="My awesome website title" />
<meta property="og:type" content="website" />
<meta property="og:description" content="my example website is on facebook!" />
<meta property="og:url" content="http://example.com" />
<meta property="og:image" content="http://example.com/og_img.jpg" />
Twitter
On the other hand Twitter provide its own meta tags called Twitter Cards to install it
<meta name="twitter:card" content="summary">
<meta name="twitter:url" content="http://example.com">
<meta name="twitter:title" content="My awesome website title">
<meta name="twitter:description" content="my example website is on twitter">
<meta name="twitter:image" content="http://example.com/og_img.jpg" />
Hint
PHP renders a HTML output, but the benefits of PHP is to deal with different page without editing each page meta tags every time you change your meta tags OR if you have a blog and each post has its own permalink and its own title, description, image .. etc, PHP comes handy!
Further reading
Open Graph Protocol
Twitter Cards
How to Create a Twitter Card - David Walsh Blog
How facebook identify the entered hyperlink and get data from that link. it shows thumbnails, text, pictures, etc. Does facebook using any javascript for framework?
Open graph protocol (OGP) is what helps Facebook get specific data from URL i.e. Web page title, site name, description ... etc
To install OGP on your site (page)
Add: prefix="og: http://ogp.me/ns#" into <html> tag
And:
<meta property="og:title" content="{Title}" />
<meta property="og:type" content="{site_type}" />
<meta property="og:url" content="{page_URL}" />
<meta property="og:image" content="{Thumbnail}" />
between <head> tags.
Those above are basic meta properties You can read more about it on OGP
Is there a way to retrieve the content value of a url's og:image property using a https://graph.facebook.com query programmatically?
My og-enabled page (a "url", http://mysite.net/my/page/1234/ in this case) will contain meta tags like these:-
<meta property="fb:admins" content="3132223"/>
<meta property="fb:app_id" content="60376622227"/>
<meta property="og:locale" content="en_US"/>
<meta property="og:title" content="My og title abcdefg "/>
<meta property="og:description" content="This rocks!" />
<meta property="og:site_name" content="mysite.com"/>
<meta property="og:image" content="http://media2.mysite.com/files/albums/displayfb/abc.jpg"/>
<meta property="og:type" content="article"/>
<meta property="og:url" content="http://mysite.net/my/page/1234/"/>
I am aware that I can use facebook debugger like this for example https://developers.facebook.com/tools/debug/og/object?q=http%3A%2F%2Fwww.rottentomatoes.com%2Fm%2Fmatrix%2F
to query a given url and facebook debugger will provide the results. But I need a programmatic way to retrieve the results, not point-and-click on facebook debugger tool.
I did not find any graph api to query an og-enabled web url to easily retrieve other og attributes.
So the alternative, which is widely used, is to scrape the page. Reference answer here - How to get Open Graph Protocol of a webpage by php?