Ondrej,
HTML validation is something we try to get 'as right as possible', but there are times when it's not possible to do so without compromising in other areas or conflicting with other extensions/templates.
I honestly hadn't seen your post in the other forum. The "Showcase" forum isn't monitored for tech support or suggestions as much as the other 'support' forums, so I never responded there. I'm copying most of the post you made here (and then removing it from there), and I'll respond to each of your points.
First, though, please know that we highly prioritize any usability issues. If there are graphical problems or functional problems on your site, we'll gladly do everything we can to fix them. The validation issues that are introduced by JFBConnect / Facebook almost never cause these types of problems though, so they are much lower priority, if they can be fixed. Also, keep in mind, that almost all sites do not properly validate including Google, Apple, Amazon, Mozilla (Firefox), Facebook, and Joomla's home page.
Now, for your specific points:
1st thing needs to be done and this is related to the template is to change DOC TYPE to:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML+RDFa 1.0//EN" "www.w3.org/MarkUp/DTD/xhtml-rdfa-1.dtd">
Changing the Doctype of a page changes how the browser is meant to parse the page. Almost all Joomla templates use the "XHTML 1.0 Transitional" doctype, or the Strict type. Switching to the RDFa type may clear up validation issues, but it may also cause your template and output to be parsed, read and displayed completely differently. There's no way we could 'force' the doctype to something else for all users as it would likely cause issues for many users and would go against what template developers intended.
This is a compromise that is, unfortunately, necessary when using a CMS. Facebook has made their choice to recommend that Doctype, but has also gone out of their way to ensure that on non-conforming doctypes, their widgets (Like, Comment, etc) will display properly, even if there are validation issues.
Custom code for tagsremaining changes are about replacing standard html elements that are not valid due to the attributes and render elements using JavaScript
2nd changes are related to the components/com_jfbconnect/libraries/facebook.php to change login button
row 320 return '
if ($showSendButton == "false" || $showSendButton == "0")
$showSendButton="false";
else
$showSendButton="true";
$likeButtonText = '
var fbl = document.createElement("fb:like");
fbl.setAttribute("href","'.$url.'");
fbl.setAttribute("show_faces","'.$showFaces.'");
fbl.setAttribute("send","'.$showSendButton.'");
fbl.setAttribute("layout","'.$buttonStyle.'");
fbl.setAttribute("width","200");
fbl.setAttribute("action","'.$verbToDisplay.'");
fbl.setAttribute("font","'.$font.'");
fbl.setAttribute("colorscheme","'.$colorScheme.'");
document.getElementById("jfbcl").appendChild(fbl);
';
FAN button - function _getJFBCFan
original $fanString commented and replaced with
if ($showFaces == "false" || $showFaces == "0")
$showFaces="false";
else
$showFaces="true";
if ($header == "false" || $header == "0")
$header="false";
else
$header="true";
if ($stream == "false" || $stream == "0")
$stream="false";
else
$stream="true";
$fanString = '
var fbf = document.createElement("fb:like-box");
fbf.setAttribute("href","'.$href.'");
fbf.setAttribute("show_faces","'.$showFaces.'");
fbf.setAttribute("stream","'.$stream.'");
fbf.setAttribute("header","'.$header.'");
fbf.setAttribute("width","'.$width.'");
fbf.setAttribute("height","'.$height.'");
fbf.setAttribute("colorscheme","'.$colorScheme.'");
fbf.setAttribute("border_color","'.$$borderColor.'");
document.getElementById("jfbf").appendChild(fbf);
';
Twitter Button - function _getSCTwitterShare
original tagButtonText commented and replaced with
$tagButtonText.='
var tb = document.createElement("a");
tb.setAttribute("class", "twitter-share-button");
tb.setAttribute("href","javascript:http://twitter.com/share");
tb.setAttribute("data-url", "'.$url.'");
tb.setAttribute("data-count", "'.$dataCount.'");
document.getElementById("tweetbutton").appendChild(tb);
';
Google plus button function _getSCGPlusOne
original tabButtonText commented and replaced with
$tagButtonText='
var gp = document.createElement("g:plusone");
gp.setAttribute("size", "'.$size.'");
gp.setAttribute("href","'.$url.'");
gp.setAttribute("annotation", "'.$annotation.'");
document.getElementById("gplus").appendChild(gp);
';
I know this is not the best options especially when button are rendered in cathegory,... view if there is more button - div id must be modified to have unique tags. but as I'm displaying only in the content view - it work ok for me.
Functionality is same like with standard html tags but as this solution renders via java script there are no attributes,... in the html structure and document is valid.
I haven't tested the code you mention, but I'll take your word that it works. However, creating the identical elements using Javascript still will cause validation issues on the page. Most validation checkers don't parse Javascript, but Google and browsers and add-ons definitely do. If your concern is that you don't want validation issues, you're simply masking them by doing this, since the standard
validator.w3.org/ page simply doesn't process the Javascript (which would then add tags that violate the doctype).
Additionally, using the Javascript to do it will slow down the overall page load time. For a page with one or 2 widgets (a like button here and the login button there), that's not a big deal. For a blog view with 10 articles, the 4 social buttons on each and a comment box, the Javascript would slow the page down drastically.
Hope that all makes sense and explains our reasoning. Again, if you are aware of any issues that are caused by the validation issues, we'll gladly go out of our way to fix them.
Thanks for your feedback,
Alex
Latest version still not XHTML compliat
