I am having some issues with the new facebook like button. It shows up fine, however for some reason it's not pulling the title of the page.
I have the and I am using og:title, all are filled in, when I view the source of the iframe created on the load of he button, the in there is blank. I am also trying to put the tweetmeme and that's seeing that title and not the meta, or the normal page title.
What am I doing wrong?
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:og="http://opengraphprotocol.org/schema/" xmlns:fb="http://developers.facebook.com/schema/">
<fb:like href="<?=$url?>" layout="button_count" show_faces="false" width="100" font="arial"></fb:like>
UPDATE: Complete Head
<head>
<title>Ladder 15 Gets A New Menu!</title>
<meta content="Growing up can be hard to do, especially in the Mad River family. But Ladder 15 has come into its own over the winter. With some new cocktails, wine selection, a hefty new beer list and veteran Chef David Ansill in the kitchen, you can check your fist pump at" name="Description">
<meta content="" name="Keywords">
<meta content="cities2night inc." name="author">
<meta content="Cities2Night 2010" name="copyright">
<meta content="en-us" name="language">
<meta content="General" name="rating">
<meta content="index,follow" name="robots">
<meta content="text/html; charset=UTF-8" http-equiv="Content-Type">
<meta content="Ladder 15 gets a new menu!" name="tweetmeme-title">
<meta content="Ladder 15 gets a new menu!" property="og:title">
<meta content="article" property="og:type">
<meta content="http://philly.cities2night.com/articles/show/listing/11/ladder-15-gets-a-new-menu" property="og:url">
<meta content="http://philly.cities2night.com/public/article_images/11.jpg" property="og:image">
<meta content="c0176da0ec38aaf107c0ef6c8cdeee38" property="fb:app_id">
<meta content="Philly2night.com" property="og:site_name">
<meta content="Growing up can be hard to do, especially in the Mad River family. But Ladder" property="og:description"></head>
Are you using a development URL? This is the page that I see when I visit the link specified by your "og:url", which has the title "Philly2night.com's Articles" and no open graph meta data specified. I imagine this is probably an issue, as Facebook will likely try to pull info from the available URL.
Also, for the pages you listed that have a good number of "likes" already, you may run into this issue:
You can update the attributes of your
page by updating your page's
tags. Note that og:title and og:type
are only editable initially - after
the page receives 10 likes, these
properties become fixed to avoid
surprising users who have liked the
page already, and changing the title
or type tags will result in your page
losing any existing likes.
From the FB Open Graph Protocol explanation.
Related
So I have this cakephp project, when I share the link to facebook i don't get og:description, og:image etc, even though everything seems to be there.
My code: (Views/Layouts/default.ctp)
<head>
...
<meta property="og:url" content="<?=Configure::read('og_url');?>landing" />
<meta property="og:title" content="<?=Configure::read('app_title');?>" />
<meta property="og:description" content="<?=Configure::read('og_description');?>" />
<meta property="og:image" content="<?=Configure::read('og_image');?>" />
...
</head>
I initialize everything in bootsrap.php so all my files can have access to these values.
Which produces this, View Page Source:
<head>
...
<meta property="og:url" content="https://www.philippidescompetition.com/landing" />
<meta property="og:title" content="Back To School Spin & Win! " />
<meta property="og:description" content="Συμπλήρωσε τα στοιχεία σου και παίξε "Spin & Win"!" />
<meta property="og:image" content="https://www.philippidescompetition.com/img/wheel/og_image_s.jpg" />
...
</head>
So far so good, but when I share the link on facebook I don't get any of the meta data.
I tried the debugger tool, but it didn't really help.
I want to share philippidescompetition.com/landing this link, which redirects to the facebook app page or to the actual url philippidescompetition.com/users/register on my server, according to if its from a desktop or mobile, so am thinking this redirect causes the issue, but if I share philippidescompetition.com/users/register which doesn't have a redirect, all meta data are still empty
Any ideas?
You need to add an exception to your automatic redirect for the Facebook scraper.
It can be recognized by its User-Agent, see https://developers.facebook.com/docs/plugins/faqs#faq_1748179212062572
I am going crazy over this, like going gray haired instantly.
I hope someone can help me.
I am currently developing a website which has accommodations.
They have a page for each accommodation with details of that item.
Before the document is put out to the browser, I collect all meta data for Open Graph with php and output it all in the head of the document with the use of og meta tags.
A strange thing happens at all these pages, for example http://parclaclusure.internetanders.nl/nl/accommodaties/lodgetenten/
Because when I use the Facebook Debugger on that url it comes up with different results than the browser gives me in the source code.
The things I did to rule out any problems on my part:
Checked the HTML with the W3C validator, it checks out, no errors
Used an extra parameter to ensure that de meta data is not cached # Facebook, like adding ?test=1234 to the url
Search on Stackoverflow (and the rest of the interwebs) for the same problem, couldn't find any
Can anyone point out what's wrong with my og meta tags? or why they are ignored/changed in Facebook. (Facebook uses the og meta data of a page located 1 step higher -> http://parclaclusure.internetanders.nl/nl/accommodaties/)
Note: Please be discrete with the website address, because it's a development environment and not yet meant to go public, live or viral :P, thanks!
It looks like a session problem. I have the feeling a session is set after all the required data is loaded.
What I notice is that after a page refresh I see different content.
Hope this helps...
You need to check your page with the OpenGraph Debugger : https://developers.facebook.com/tools/debug/
It will update the content of your OG tags in Facebook. It doesn't update the content each time someone share your page, only on debug.
EDIT : On your code :
<meta property="og:image" content="http://parclaclusure.internetanders.nl/uploads/defaults/default.facebook.png" />
<meta property="og:image" content="http://parclaclusure.internetanders.nl/uploads/images/300x300-e04fcee6a2ba22c917d1c45e6c61b926.jpg" />
<meta property="og:image" content="http://parclaclusure.internetanders.nl/uploads/images/300x300-0cb0ca4759b278c22f075c781a628956.jpg" />
<meta property="og:image" content="http://parclaclusure.internetanders.nl/uploads/images/300x300-6c63e58a9ba8d555f277d34d2daeddc5.jpg" />
<meta property="og:image" content="http://parclaclusure.internetanders.nl/uploads/images/300x300-73f0f66a0d05d0bf570254f1eb7072f8.jpg" />
<meta property="og:image" content="http://parclaclusure.internetanders.nl/uploads/images/300x300-063fcc1f10db6bdb3e2d3c4d053f76db.jpg" />
<meta property="og:image" content="http://parclaclusure.internetanders.nl/uploads/images/300x300-1c0526d2cc3c916fc3c67d0b83e6f7f9.jpg" />
<meta property="og:image" content="http://parclaclusure.internetanders.nl/uploads/images/300x300-a850047c2225b1b9e5d5fddae1d1c7bf.jpg" />
<meta property="og:image" content="http://parclaclusure.internetanders.nl/uploads/images/300x300-25094d3a08fb093983dedffdcaf14c88.jpg" />
<meta property="og:image" content="http://parclaclusure.internetanders.nl/uploads/images/300x300-3414c0ad4780a27ad8326007ec3987ae.jpg" />
<meta property="og:image" content="http://parclaclusure.internetanders.nl/uploads/images/300x300-845b24160e9fe438e851a6b2fb17af17.jpg" />
<meta property="og:image" content="http://parclaclusure.internetanders.nl/uploads/images/300x300-0e2b4efe0d30745ea34afc9b01bb6eb4.jpg" />
What do you expect from this ? You are supposed to have only one OG:image metatag...
I am currently trying to set up the ability to publish open graph stories for an app but I am running into trouble with facebook's scraper. *Note: I am replacing the values in the parenthesis with their correct values; the php is hosted on wpengine.
I have put the example php code
(mydomian)/opengraph.php and when I enter (mydomian)/opengraph.php?fb:app_id=(my_id)&og:type=(type)&og:title=(title)&og:description=(descr)&og:image=(image)&body=(body) it generates the object as expected.
Unfortunately when I run it through the debugger I get:
Errors That Must Be Fixed
Object Missing a Required Value: Object at URL '(mydomain).wpengine.com/opengraph.php' of type 'website' is invalid because a required property 'og:type' of type 'string' was not provided.
Redirect Path
original: (mydomian).wpengine.com/opengraph.php?fb:app_id=(my_id)&og:type=(type)&og:title=(title)&og:description=(descr)&og:image=(image)&body=(body) it generates the object as expected.
301: (mydomain).wpengine.com/opengraph.php //looks like it's redirecting and scraping this page instead
the end result of the scrape is
<!DOCTYPE html>
<html>
<head prefix="og: http://ogp.me/ns# product: http://ogp.me/ns/product#">
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<meta property="fb:app_id" content="">
<meta property="og:url" content="(mydomain).wpengine.com/opengraph.php">
<meta property="og:type" content="">
<meta property="og:title" content="">
<meta property="og:image" content="">
<meta property="og:description" content="">
<title>Product Name</title>
</head>
<body>
</body>
</html>
Like I said before when I visit this page via web browser myself the html contains the correct values, but for some reason the facebook scraper is getting just the base php with no input. Any ideas?
Decided to go around the problem and use our plugin to generate the meta properties per post instead. If anyone else comes across this issue, the code at http://www.wpbeginner.com/wp-themes/how-to-add-facebook-open-graph-meta-data-in-wordpress-themes/ seems to be working for our purposes. We generate a bunch of xml from custom post types for our app and that's what we needed to publish stories about.
I have read and follow: this link, but the problem still exist.
My site is http://crossrt.net/election2013 and code below is added to tag.
<meta property="og:title" content="General Election 13 unofficial website"/>
<meta property="og:url" content="http://crossrt.net/election2013"/>
<meta property="og:image" content="http://crossrt.net/election2013/images/icon.png"/>
and the Facebook show me:
but when i share my url on Facebook, nothing is show:
Although this had been past about 22 days, but now only answer to this question. Perhaps the answer can help for someone. Following is the current meta tag:
<meta property="og:title" content="General Election 13 unofficial website"/>
<meta property="og:description" content="Unofficial website of election" />
<meta property="og:url" content="http://crossrt.net/election2013/"/>
<meta property="og:image" content="http://crossrt.net/election2013/images/icon.jpg"/>
What mistake I make in this question is that I use PNG transparent image as the og:image, so now I have a new JPG to replace it.
I know this is quite stupid, but it does fix my problem. Everything works well now.
I made my website My SMS Buddy and i have included one facebook like button to sharing my website on facebook. But, whenever i clicked on the like button, it is only showing my website url,but it is not showing thumbnail,title,description, although i have written the code for all the information inside the main page. This is the sample code of the main page
<head>
<meta property="og:title" content="My SMS Buddy" />
<meta property="og:type" content="activity" />
<meta property="og:url" content="http://www.eravikant.com" />
<meta property="og:image" content="http://www.eravikant.com/images/image.jpg" />
<meta property="og:site_name" content="My SMS Buddy" />
<meta property="fb:admins" content="100002723853376" />
<meta property="og:description" content="Share and Send Free Sms Anywhere In India Which Support Upto 160 Characters Long Sms Without Any Advertisements Attached with the Sms To Any Mobile In India With Easy Group Messaging" />
</head>
<body>
<iframe src="//www.facebook.com/plugins/like.php?href=http%3A%2F%2Fwww.eravikant.com&send=false&layout=box_count&width=60&show_faces=true&action=like&colorscheme=light&font=segoe+ui&height=90" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:60px; height:90px;" allowTransparency="true"></iframe>
</body>
Need suggestion, what am doing wrong here...
Suggestion will be appreciated ...
There are some really odd things in your page's HTML. You have duplicates of your opening and closing HEAD, BODY and wrapping HTML tags. This is invalid HTML and doesn't parse at all. This also won't show your page properly in web browsers since it won't know which part of the HTML to render. This is what is confusing Facebook.
Remove the first HTML opening and closing (plus its contents) and Facebook should get your OG Metadata fine. It's in the second HTML HEAD metadata and that looks fine.