Suchmaschinenoptimierung Praxis mit TYPO3

Facebook Pinwände, Like-Buttons oder sonstigen Facebook Inhalte für die eigene Webseite werden ja per iframe-Code eingebunden. In den meisten Fällen erzeugt der gelieferte Quellcode von Facebook allerdings einen nicht immer gewünschten Rahmen um die Inhalte herum.

Leider lässt sich der Rahmen nicht per CSS > border:none; entfernen, da das CSS der eigenen Webseite keinen Einfluss auf die geladene Webseite im iframe hat (oder haben darf).

Mit einem einfachen Trick kann der Rahmen der Facebook Inhalte doch entfernen werden:
Um das IFRAME wird ein DIV gesetzt, welches kleiner ist und die Eigenschaft “overflow:hidden” bekommt. Dann muss nur noch das IFRAME in diesem DIV um einige Pixel nach außen positioniert werden:

das HTML

<div id=”likebox-frame”>
<iframe src=”http://www.facebook.com/… width=”300″ height=”400″></iframe>
</div>

das CSS

#likebox-frame{
width: 298px;
height: 398px;
overflow: hidden;
}

#likebox-frame iframe{
margin-top: -1px;
margin-left: -1px;
}

Spiele ein wenig mit den Werten der iframe Größe und im CSS, viel Freude..