Un workaround per Facebook

Come inserire un attributo XHTML illegale.

Dalla fine di novembre 2009 in testa a tutte le pagine del sito è presente un piccolo pulsante per collegare la pagina al proprio profilo di Facebook.

Per farlo si trova su Facebook questo codice

<a name="fb_share"
type="button_count"
href="http://www.facebook.com/sharer.php">Condividi</a>
<script src="http://static.ak.fbcdn.net/connect.php/js/FB.Share"
type="text/javascript"></script>

da inserire nella propria pagina web.

Funziona tutto regolarmente, il bottone appare di colore blu con l'icona giusta, purtroppo questo codice non permette più di validare la pagina con le specifiche XHTML 1.1 in quanto l'attributo name non è ammesso per i tag a e va sostituito con l'attributo id.

Purtroppo così facendo non funziona più lo script di Facebook che applica lo stile al bottone che comunque funziona lo stesso.

L'unico stratagemma possibile è utilizzare del codice javascript che aggiunga l'attributo incriminato prima che parta lo script che lo richiede; il codice necessario è veramente poco:

// The Strawberry Field website client side scripting
// copyright (c) 2009-2013 Roberto Ceccarelli - The Strawberry Field
// http://strawberryfield.altervista.org
// script released under Creative Commons License - http://creativecommons.org/licenses/by-nc-sa/3.0/

// workaround per inserire l'attributo name nel tag <a>

var addNameFromId = function(idtag) {
var element = document.getElementById(idtag);
element.setAttribute('name',idtag);
};

// addNameFromId('fb_share');

// per compatibilit� tag funzioni social
/*
var addFacebookTags = function() {
var element = document.getElementById("fb-like");
element.setAttribute("data-send","true");
element.setAttribute("data-width","150");
element.setAttribute("data-layout","button_count");
element.setAttribute("data-show-faces","true");
};

var addFacebookBoxTags = function() {
var element = document.getElementById("fb-like-box");
element.setAttribute("data-stream","true");
element.setAttribute("data-header","true");
element.setAttribute("data-width","600");
element.setAttribute("data-href","https://www.facebook.com/pages/The-Strawberry-Field-soluzioni-per-comunicare/215366443032");
element.setAttribute("data-show-faces","true");
};
*/
var addTwitterTags = function() {
var element = document.getElementById("twitter-share-button");
element.setAttribute("data-via","RobyStrawberry");
element.setAttribute("data-lang","it");
};

var addTwitterBoxTags = function() {
var element = document.getElementById("twitter-timeline");
element.setAttribute("data-widget-id","289855632226521088");
};

var addLinkedinTags = function() {
var element = document.getElementById("linkedin-button");
element.setAttribute("data-counter","right");
};

var addPinterestTags = function() {
var element = document.getElementById("pinterest-button");
element.setAttribute("data-pin-do","buttonFollow");
};

Inoltre bisogna modificare il codice da inserire nella pagina inserendo il richiamo a questo nuovo script

<a id="fb_share"
title="Condividi su facebook"
type="button_count"
href="http://www.facebook.com/sharer.php">Condividi</a>
<script src="./style/facebooksharer.js"
type="text/javascript"></script>
<script src="http://static.ak.fbcdn.net/connect.php/js/FB.Share"
type="text/javascript"></script>

Così facendo si ottiene di avere la pagina validata, lo script funzionante, e io ho occupato un pomeriggio fra tutto; ma mi chiedo: che fastidio dava quell'attributo name?