Commenti Facebook per layout liquidi

Su molti siti internet si è diffuso l’utilizzo di un plugin per ricevere i commenti dagli utenti Facebook direttamente all’interno del sito web. Questo plugin, utilizzando la proceduta guidata, genera del codice con una larghezza fissa di default. Questo non è ottimale per tutti i siti che hanno un layout liquido, progettati per adattarsi automaticamente alla larghezza dello schermo.

Con il semplice script JQuery di seguito ho fatto in modo di rimuovere questa limitazione. Lo script prevede anche di intervenire anche ad ogni ridimensionamento della finestra (es. rotazione dello schermo su tablet).

$(document).ready(function(){
	$(".fb-comments").attr("data-width", $(".fb-comments").width( ));
});

$(window).resize(function(){
	$(".fb-comments").attr("data-width", $(".fb-comments").width( ));
	$(".fb-comments SPAN").css("width", $(".fb-comments").width( ));
	$(".fb-comments IFRAME").css("width", $(".fb-comments").width( )); 
});

Lo script è stato provato con JQuery v1.8.3 e le librerie JS Facebook per HTML5 sui browser Firefox e Chrome versione desktop.

Ulteriori informazioni: