validen Google+1 Button einbauen
Google+1 jeder kennt mittlerweile das Social Network. Empfehlungen, Bewerten und Tauschen von interessanten Webseiten macht man mit einem Klick auf den Google +1 Button. Voraussetzung hierfür ist lediglich ein Google-Konto. Im eingeloggten Zustand kann man schnell beliebte oder sehenswerte Webseiten hinzufügen und diese mit anderen Google-Usern tauschen. Wie baut man nun den Google +1 Code in die eigene Webseite ein, das Benutzer deine Seite empfehlen und bewerten können?
Direkt vor dem </body> fügt man folgenden Java-Script Code ein:
- data-size=”small”; “medium” oder “tall” (Größe des +1 Buttons)
- data-count=”false” oder “true” (Anzeige der Klicks, Empfehlungen)
- data-href=”http://www.domain.de“ (Angabe der URL die empfohlen werden soll)
Direkt vor dem </body> fügt man folgenden Java-Script Code ein:
<script type="text/javascript" src="http://apis.google.com/js/plusone.js">{lang: 'de'}</script>
<script type="text/javascript">/* <![CDATA[ */ document.getElementById('g_plus_one').innerHTML = '<div class="g-plusone" data-href="http://www.webspider24.de/"></div>';/* ]]> */</script>
Für WordPress Blogs ändert man beispielsweise die data-href auf <?php the_permalink();?>
Die class=”g-plusone” kann man noch zusätzlich ergänzen mit:
- data-size=”small”; “medium” oder “tall” (Größe des +1 Buttons)
- data-count=”false” oder “true” (Anzeige der Klicks, Empfehlungen)
- data-href=”http://www.domain.de“ (Angabe der URL die empfohlen werden soll)
Wichtig ist für die korrekte Funktionalität im Java-Script, das alle zusätzlichen Variablen mit data- beginnen, nicht wie auf einigen Webseiten beschrieben nur mit size, href oder count.Im Quellcode, dort wo der Button erscheinen soll, fügt man nun noch ein:
<div id="g_plus_one"></div>
Der ganze Code gibt zudem ein valides HTML zurück.
