Start Joomla!-Freunde "Goolge +1"- und "Gefällt mir"-Button von Facebook in Joomla 1.5.x einfügen

"Goolge +1"- und "Gefällt mir"-Button von Facebook in Joomla 1.5.x einfügen

E-Mail PDF

Ihren Webauftritt ergänzen um den "Google +1"- und "Gefällt mir"-Button von Facebook in Joomla 1.5.x

Inzwischen laufen viele Informationen über die Communities Facebook und in Zukunft voraussichtlich auch Google +1. Als Anbieter einer Internetseite möchte man gefunden werden, und dazu können die Buttons von Facebook und Google beitragen, denen man nun auf den Internetseiten immer häufiger begegnet.

Es gibt für Joomla inzwischen auch Plugins, die einfach zu handhaben sind, die haben mir aber noch nicht richtig gefallen. Also bette ich den JavaScript-Code für die Buttons in die Beiträge direkt mit ein.

Zunächst zu Goolge:

Bei Google +1 besteht der Code, der eingefügt werden muss, aus zwei Teilen. Einer ist einmalig in dem File index.php einzufügen, ein zweiter Teil kommt an die Stelle des Artikels, an dem der Button erscheinen soll.

Bearbeiten des Files index.php:

Wählen Sie im im Menü Erweiterungen den Menüpunkt Templates aus. Wählen Sie dann das Template aus, das Sie verwenden (ist mit einem Stern als Standard gekennzeichnet). Danach erscheint eine neue Maske mit Buttons am oberen Fensterrand.

HTML bearbeitenÖffnen Sie dort über den Button HTML bearbeiten die Datei index.php aus, die Sie dann bearbeiten können.

Tragen Sie nun im Head-Bereich die Zeilen ein, die gelb markiert sind:

index_php

Hier noch einmal der Code zum Kopieren:

<script type="text/javascript" src="https://apis.google.com/js/plusone.js">

  {lang: 'de'}

</script>

Ich habe den Code direkt über dem Ende des Head-Bereichs </head> eingefügt, danach dann bitte speichern. Dies ist eine einmalige Angelegenheit, wohingegen die Buttons in jedem Artikel separat eingefügt werden müssen. 

Einfügen im Beitrag:

In dem Artikel, in dem Sie den Google +1-Button verwenden möchten, fügen Sie die folgende Zeilte ein.

<g:plusone size="small"></g:plusone>

Dies geht jedoch nicht im WYSIWYG-Modus. Sie müssen in den Code-Modus wechseln.

show/hide

Den Code-Modus erreichen Sie über Ihren Editor, indem Sie auf [show/hide] klicken (am oberen linken Rand des Editors). Suchen Sie dann die geeignete Stelle im Beitrag, wo Sie den Button anzeigen möchten.

Nun zu Facebook:

Facebook benötigt den folgenden Code:

<iframe src="http://www.facebook.com/plugins/like.php?href=http%3A%2F%2www.weblink.de&amp;layout=button_count&amp;show_faces=true&amp;width=450&amp;action=like&amp;colorscheme=light&amp;height=80" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:100%; height:30px;" allowTransparency="true"> </iframe>

Dabei ist www.weblink.de hier nur ein Platzhalter. Hier muss der Weblink ihres Beitrages eingetragen werden, in dem der Facebook-Button erscheinen soll. Für den Beitrag, den Sie gerade lesen wäre dass dann der folgende Code:

<iframe src="http://www.facebook.com/plugins/like.php?href=http%3A%2F%2www.happerschoss.net/joomla-freunde/104-qgoolge-1q-und-qgefaellt-mirq-button-einfuegen&amp;layout=button_count&amp;show_faces=true&amp;width=450&amp;action=like&amp;colorscheme=light&amp;height=80" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:100%; height:30px;" allowTransparency="true"> </iframe>

Wie im Google-Bereich beschrieben, fügen Sie diesen Code an die Stelle im Beitrag ein, wo der "Gefällt mir"-Butten dann angezeigt werden soll.

Sollen beide Buttons zusammen erscheinen, sähe der Code wie folgt aus.

google_facebook_button

Und hier der Code auch noch mal zum Herunterladen. 

Ich habe den Code in ein PDF-File eingefügt, Sie können den Code aus dem PDF-File dann kopieren.


Zuletzt aktualisiert am Sonntag, den 18. März 2012 um 15:17 Uhr  

Machen Sie mit

Sie kennen Happerschoß schon als Kind oder seit vielen Jahren. Dann kennen Sie sicherlich auch Geschichten und Anekdoten von Happerschoß und Umgebung. Erzählen Sie, schreiben Sie, berichten Sie. Die Happerschosser werden sich freuen, etwas über ihr Dorf zu erfahren. Melden Sie sich, schreiben Sie eine Mail direkt über den Kontaktbereich oder natürlich auch über Info@happerschoss.net.