Facebook like buttons erroneously handled as one - html

I've implemented the like button on my WP blog, but for some reason some of them (not all of them) are interpreted as being the same button. If I press like, I will also like the ones that is interpreted as the same. I can't figure out why. There are several other problems with what is shared on Facebook, but I think those problems are connected to this one.
It worked great for a few days, then I started getting an error each time I pressed the like button. After fiddling with the og:type value the error disappeared, but instead now I get this strange behaviour.
My implementation is so simple, I can't really think of any causes:
<div class="fb-like"><fb:like href="<?php the_permalink();?>" show_faces="true" width="600" font="arial"></fb:like></div>
I've found that the behaviour changes depending on what og:type I define in the header section, but with no value producing the correct result.
the blog can be seen at http://blog.parkov.dk/ (in Danish, though).
Anyone has experience with this?

Remove the href parameter and instead use the Open Graph meta tags. I see that you are using them but some required tags are missing:
og:title
og:url
IMPORTANT NOTE:
For the homepage use blog as og:type!

Related

Why is my anchor href path, appending to the URL?

I'm utterly baffled by the following situation I find myself in and truthfully, I have no idea why the following is occurring or how to solve the issue.
Here's what's happening;
I have the following anchor;
<a href=”https://www.google.com/intl/en/policies/terms”
rel="nofollow"
target="_blank">
Terms
</a>
If the user clicks this anchor it results in the following URL:
https://www.example.com/contact/"https:/policies.google.com/terms
Naturally I was expecting the following URL to be loaded;
https://policies.google.com/terms
At first I thought it might be a syntax error, somewhere, so pulled the anchors and checked the code. I can't see any errors anywhere. From there, I tested other links in the page. (All are working fine.) So I thought 'well if they are working, maybe it was a typo in the code?', I rewrote the anchors and the same issue still occurs (strange).
So my second thought was the URL has to be weird somehow, so I used a couple of substitutes,
www.google.com, www.youtube.com, and www.facebook.com. All URLs resulted in the same result. Is the target href="" simply being appended to the URL?
I'm not doing anything fancy with my URLs, or JavaScript so why is this occurring? Has anyone ever encountered this? Or maybe a better question would be: How would one debug something like this?
You used incorrect double quotation marks. Take a look very closely at the HTML tags below:
<p class="text-muted">We'll get back to you within 1-2 business days.</p>
<p class="small text-muted">(This site is protected by reCAPTCHA and the <br>Google
Privacy Policy and
Terms of Service apply.)</p>
The quote used in p tag is " and it is different with the one used in the a tag, which is ”.
You need to replace it with ".
<p class="text-muted">We'll get back to you within 1-2 business days.</p>
<p class="small text-muted">(This site is protected by reCAPTCHA and the <br>Google
Privacy Policy and
Terms of Service apply.)</p>

HTML rel="up" attribute?

I'm using mobile template HTML files on a PHPBB forum.
I tested the html for errors at http://validator.w3.org/
The test results showed the following error
Line 24, Column 66: {navlinks.FORUM_NAME}
Bad value up for attribute rel on element a: The string up is not a registered keyword or absolute URL.
Not having heard back from the author and not finding much on Google search, I'm trying to understrand what rel="up" does, if anything constructive.
Can't find any mention as an official HTML attribute
http://www.w3schools.com/tags/att_link_rel.asp
wondering if it's probably safe to just remove the phrase rel="up"
The Internet Assigned Numbers Authority (IANA) keeps a list of link relationships The latest version is from March 21 2013.
up: Refers to a parent document in a hierarchy of documents.
Unfortunately, despite the fact that this registry was long established, it was decided that HTML5 would not use this registry and would use a Wiki page to list the conforming link types instead.
Up, is listed in a rather insane section marked "dropped without prejudice", which nobody seems to know what to do with, or how to get those link types out of.
It's safe to drop it, but some browsers and browser plugins make use of it. For example, I use a Firefox plugin called "Link Widgets" like this to make use of the link type.
From: http://www.w3.org/MarkUp/html3/dochead.html
REL=Up
When the document forms part of a hierarchy, this link references the immediate parent of the current document.
If this is causing any specific problems or unexpected results, please post your code. Thanks.

Facebook Like Box issues - my patience ended

I'm trying to set up a Like Box in this website: http://filmefilmes.com/breu
The Facebook Page of the site is: http://www.facebook.com/pages/BREU/278537375497440
I have tried all methods. iFrame, FBML, etc.
When you click the "like" button it returns a Error that says the page can't be reached.
When I pass the site on the debugger the error is:
You have < meta> tags ouside of your < head>. This is either because
your < head> was malformed and they fell lower in the parse tree, or
you accidentally put your Open Graph tags in the wrong place. Either
way you need to fix it before the tags are usable.
Which is incorrect because the tags are obviously inside the page's head.
And i get this warning too:
The og:locale property should be explicitly provided, even if a value
can be inferred from other tags.
I have to deliver this website very soon and I've spent some hours trying to correct this and to find solutions in forums etc.
As I have changed methods I believe the error is somewhere in the markup of my page but I don't really have a clue.
Help will be heavily appreciated, thanks.
Having a quick look at the site I can see you DO have <meta> tags outside of the <head> element, these are inside a second <head> tag further down the page.
Check your facetek div.
few of your meta tags are unclosed. ("/>")
thus, closing within them is parser error.
fix it and it should go fine

errors on firefox

i have 2 errors coming up on firefox. Theses errors are shown below.
1-there is no attribute "property". This refers to the line below:
<meta property="og:title" content="blahblahblah"/>
This is to do with linking it to social networks i.e facebook etc
2-there is no attribute onerror. This refers to the line below:
<img src="281.jpg" width="125" height="125" onerror="onImgErrorSmall(this)"/>
This basically displays a default image if the actual image dose not show up.
the question really is, i know these are not valid attributes but how can i get around them, if anyone has any ideas id be grateful.
For the meta tag there is no property attribute
For the img tag there is no attribute called onerror
No way to get around them as they are not part of the html markup
Live with them or remove - they will never validate against a web standard
You pasted stuff into a wysiwyg editor directly from Microsoft Office or OpenOffice document.
These properties are proprietary.
You should clean up or remove the markup before pasting. (Most of wysiwyg editors in use today have this function (a.k.a. paste from Word))
This link may be able to help you out.
onerror is only supported by the "browser" that Microsoft makes.

IE8 claims my page has an error, firefox doesn't, and I can't find any error. Help!

This is something of a follow-up question to my question here. You can find the HTML source in a text file here.
When I load that page in IE8, I get the "Done, but with errors on page." message in my status bar. The detail view shows
Expected identifier
sms Line: 147
Code: 0 Char: 67
and I see absolutely no problems anywhere near there. In IE8, the page is still behaving erratically w/r/t the randomly losing focus as mentioned in my other question.
When I load the same exact page in Firefox (using Firebug) the console shows no errors and the page works perfectly. Any thoughts on what's going on here? This is driving me nuts and making me want to give up on even trying to write an IE friendly page.
Edit: Thanks for all the comments! This page is written as a JSP, so I edit in Eclipse. I found an Eclipse warning about the onblur event for the username field. I switched it from
onblur="alert(document.activeElement + ' class:' + document.activeElement.class)"
to
onblur="alert(document.activeElement)"
and that made the bizarre IE page error vanish. I had been trying to give more info (namely, its CSS class) about specifically which element is stealing focus - to my own detriment, apparently, since Javascript was interpreting the '.class' part in the Java(script) sense there is no class property (I should have been using className).
And, no, the page doesn't validate. But the errors were mostly/all ones that just didn't make sense to me, such as
Line 14, Column 41: Attribute "LANGUAGE" is not a valid attribute. Did you mean "language"?
But I'm still stuck trying to figure out why, as I enter text in the username & password fields, focus randomly switches to a div (working on figuring out which div currently).
Edit 2: It's the div between the two "global nav" comments, at the very top of the body. Still no idea why it's happening, though.
The problem appears to be the line
onBlur="alert(document.activeElement + ' class:' + document.activeElement.class)"
when you take off the ".class" it loads without issue. Are you sure ".class" is valid?
Does your HTML validate?
I agree, IE does a terrible job giving developers information about page errors. I only support IE on the principle that users shouldn't have to download twenty-odd browsers to go to their favorite websites. Web developers have a responsibility to make it "just work". Browser developers have a responsibility to communicate with each other and conform to standards.
Run your javascript through JSLint. You probably have a missing semicolon somewhere or a comma at the end of an object property that shouldn't be there. Firefox is more forgiving than IE when it comes to those types of syntax errors.
Edit: The inline js in your page seems to be OK. Check the contents of qm_scripts.js.
When I remove the .class from document.activeElement.class the error goes away.
The real issue is that you need to be able to debug your JS in IE 8, correct? There is a tool for that! :)