When I paste a friend's wordpress site url in a facebook comment, I see the following extra text (I've changed the url for anonymity) The home page of the wordpress blog is titled "Home"
For some reason facebook adds the extra lines in i.e. where it says "You may use these HTML tags and ... " or perhaps the wordpress generated html get incorrectly parsed/referenced in the facebook comments browser.
I have zero wordpress experience but do understand CMS concepts well. Any help on how to resolve this will be much appreciated by my friend. I can disclose the url if its really needed to resolve the issue. I decided to try posting the question with an anonymous url first, just in case this is a known, encountered-before issue.
Wondering if the facebook graph-api has anything to do with this? (FB graph-api is not my forte either as I'm more into iOS development)
Home
http://mywordpressfoo.net/
You may use these HTML tags and attributes:
<a href="" title=""> <abbr title=""> <acronym title="">
<b> <blockquote cite=""> <cite> <code> <del datetime="">
<em> <i> <q cite=""> <strike> <strong>
It sounds like your friend's blog does not have OpenGraph tags. Facebook uses these to determine how URLs display when posted on their site (e.g. YouTube URLs display embedded videos, Flickr URLs photos, etc.).
You can find more information about the metatags that Facebook supports in their OpenGraph documentation. Your friend will probably want to make individual posts "Articles", while the homepage should be a "Blog" or a "Website".
Depending on your friend's competency with editing WordPress templates, they might find it easier to integrate Facebook's official WordPress plugin, which includes support for OpenGraph tags.
Related
This is my post featured image.
This is my post entitled "First post" with social icons at the bottom for sharing using social media feather plugin
This is what shows up when I clicked the facebook button
The image above shows that it doesn't return the right image set as featured image for the first post to be shared in facebook. I also encountered the same problem using WP Social Sharing. Can anybody help me solve this please. Thanks a lot.
Facebook, and other platforms that allow social sharing (LinkedIn, Twitter, G+, etc), all use a protocol called OpenGraph.
In it's simplest form, OpenGraph is a series of meta tags placed on a web page that describe that page. Common tags include a title of the page, description, image and a category. It is this OpenGraph image that Facebook uses in it's preview for the social share.
The tag itself is called og:image, and Facebook suggest it is at least 1200x630 pixels, although they will still use the image if it is less than that. As a side note for anyone viewing this thread and having the same issue with Facebook apps - you'll need to serve the image over HTTPS for that, something you don't need to do in this case.
I would suggest viewing the source of your page and finding the OpenGraph tags. If none are present (very possible) then Facebook is just doing it's best based on what it sees on the page. You can remedy this by adding your own tags, or using one of the many OpenGraph plugins available for WordPress.
More information on Facebook's best practices for social sharing are available.
I am having humbling issues with Facebook and Wordpress
I am using
WP ver 3.4.1
FB plugin Version 1.0.2
I Installed the plugin. Created a Facebook app.
What is happening is I am sharing the page on Facebook using Facebooks share button, send button, and subscribe button. Even if I copy and paste the post I get the following in the feed description.
You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym >title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <>strike> <strong>
I think it is in a Facebook PHP file, but I looked there. I am kind of stumped to say he least.
Yes. For some reason the Facebook for Wordpress plugin pulls in the comment instructions as the default description it uses in the og:meta tags, especially when there is no text associated with your posts or no excerpt set.
On my sites, I use the Facebook for Wordpress plugin for connectivity, but I've given up letting it generate my meta tags. I use Wordpress SEO instead, since you can specify what text should be in your description, titles, etc. There are other plugins that also do the same.
To inhibit the Facebook for Wordpress meta tags, add this to your theme's functions.php:
//Remove the Facebook for WP tags until they get their s**t together.
remove_action('wp_head', 'fb_add_og_protocol', 10);
Twitter has a beautiful share API. If I want to customize text, I just include it in the URL I'm linking to:
<a href="https://twitter.com/share"
class="twitter-share-button"
data-text="whoa, check out this SUPER-EASY CUSTOMIZED TWEET TEXT!"
data-via="foo">
Tweet
</a>
My question is whether there is a way to do this with Facebook, Google Plus, and LinkedIn.
I want to be able to do this without having to put og meta tags in the link target. Basically instead of the link target having knowledge of the message, I want the share button itself to have that knowledge.
Thanks
It is a good idea to populate your pages with metadata to describe them to non-human systems including search engines, social networks, screen readers etc. For Google+, you have your choice methods: Schema.org metadata, OpenGraph, or simple meta names/descriptions. You can read more about how to populate snippets from your site at https://developers.google.com/+/plugins/snippet/
I'm integrating a Like button in the individual blog posts on my company's website ( www.atlas-games.com , blog by CLASSIC Blogger at http://blog.atlas-games.com ... can't use a widget). Unfortunately the metadata isn't passing through, so in Facebook it looks like:
Michelle Nephew likes a link.
Atlas Games: Charting New Realms of Imagination <--website's name, not post title
The item links work correctly on "link" and "Atlas Games ..." directing to the individual post, but it's using generic text rather than the individual post's title, the site name I specified for Facebook, and the image.
Object Debugger comes up with Inferred Property errors for URL, Title, and Image, though I specify them in the header of my page. For some reason Facebook just isn't finding the metadata, seems like. See the report here:
http://developers.facebook.com/tools/debug/og/object?q=http%3A%2F%2Fblog.atlas-games.com%2F
I'm having trouble posting my code here ... View Source, though, and you'll see the Meta Property tags in the header and the iframe in the post's footer code (commented out right now).
This is the third time over the course of several months that I've spent hours trying to get this to work, with no luck, so it's not a temporary issue. Any suggestions?
It seems like the structure of the HTML might be the issue as it could be stopping Facebook finding the Open Graph tags.
Fixing these validation errors might allow the tags to be parsed:
http://validator.w3.org/check?uri=http%3A%2F%2Fblog.atlas-games.com%2F&charset=%28detect+automatically%29&doctype=Inline&group=0
Also there are some template variables in the OG tags which aren't being replaced with values:
<meta property="og:title" content="<$BlogItemTitle$>" />
I have the same problem on my blog! And I can't even insert html for the facebook like button directly from facebook developers, into my blog, my blogger blog tells me that the html is erred. I think it has something to do with blogger being a google blog and google now having google+. I noticed all my problems began when google+ came out, I think google is possibly screwing up the facebook like buttons on google sites, to gain monopoly through "share on google+" .
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.