Scrollbalken in Facebook-iFrame-Tabs deaktivieren

Die iframe-Tabs von Facebook haben eine Begrenzung von maximal 800 Pixeln Höhe. Sobald der Inhalt der Seite, die ihr per iframe-Tab integriert, höher als diese 800 Pixel ist, schneidet Facebook den Inhalt ab und bindet einen Scrollbalken ein. Es entsteht also für gewöhnlich eine sehr benutzerunfreundliche Seite mit zwei verschiedenen Scrollbalken: Einem im iframe und einem im Browserfenster.
Mit folgendem Code-Snippet könnt ihr den Scroller entfernen und Facebook zwingen die volle Höhe der Seite anzuzeigen.

Workshops und Seminare von kulturbanause

Unsere Berlin-Termine für Ende 2017 sind online!

Jetzt Frühbucher-Preise sichern

Scrollbalken deaktivieren

Alles was ihr benötigt um den Scroller auszublenden, ist folgendes Code-Snippet und die Application-ID eures iframe-Tabs. Die App-ID findet Ihr unter folgender Adresse: facebook.com/developers/apps.php

Kopiert folgendes Snippet in Eure HTML- bzw. PHP- Seite direkt hinter den öffnenden body-Tag:


<div id="fb-root"></div>
<script type="text/javascript">
window.fbAsyncInit = function() {
FB.init({
appId: 'XXXXXXXXXXXXXXXXXXXXXXX',
status: true,
cookie: false,
xfbml: true
});
FB.Canvas.setSize({ width: 810, height: XXXXXXX });
};
(function() {
var e = document.createElement('script');
e.async = true;
e.src = document.location.protocol +
'//connect.facebook.net/de_DE/all.js';
document.getElementById('fb-root').appendChild(e);
}());
</script>

Vergesst nicht, die App-ID eures Tabs einzutragen und die Höhe anzupassen. Anschließend könnt Ihr die Datei hochladen. Der Scrollbar sollte nun verschwunden sein.

Update:

Facebook hat den Code zur Entfernung von Scrollbalken zum 1. Januar 2012 verändert. Der oben abgebildete Code enthält jedoch bereits die Neuerungen. Details zu diesem Update könnt ihr auf AllFacebook nachlesen.

Update 2:

Facebook hat im August 2012 das Snippet erneut verändert. Das alte Script funktioniert nichtmehr und muss ausgetauscht werden. Das Snippet in diesem Beitrag ist bereits das neue, funktionsfähige Snippet.