Kategorien
Social Media

Google Plus auf Webseite einbinden

Google Plus auf Webseite einbinden und das möglichst unkompliziert und schnell: In diesem Artikel möchte ich das Vorgehen kurz erklären. Es ist in der Regel in wenigen Minuten gemacht. Falls man ein CMS oder Blogsystem wie Word Press hat, dann geht das in der Regel noch schneller mit einem Plugin.

Hat man kein etabliertes System wie Word Press oder dergleichen und kann nicht auf bereits fertige Plugins zurückgreifen, dann muss man den HTML-Code per Hand an die richtige Stelle platzieren.

Den Code für Google Plus erhält man auf der Google+ Platform unter Google Developers. (Achtung, nicht wundern: Der Generator für den Code wird etwas verzögert im oberen Teil der Seite nachgeladen.)

Und so sieht der Google Plus Generator dann aus, nachdem er geladen wurde:

button-generator

Im linken oberen Bereich muss man zuerst die Größe (size) auswählen. Entsprechend sieht man in der rechten Vorschau den Button. Man hat die Auswahl zwischen „small“, „medium“, „standard“ und „tall“. Hier auf seomeo.de sieht man links und unter dem Beitrag den Google+ Button in der Größe „tall“.

In der ComboBox unter annotation kann man die Ausrichtung der Anzeige für die gemachten Empfehlungen festlegen. Bei inline wird die Anzahl im laufenden Textfluss angezeigt. Bei der Auswahl bubble wird die Anzahl als Seifenblase, ähnlich wie bei Comics, entweder oben oder rechts vom Button selbst angezeigt. Ob rechts oder oberhalb hängt von der ausgewählten Buttongröße ab.

Unter width legt man die Breite des gesamten Buttonbereichs fest.

Mit der vierten Einstellung legt man noch die Sprache (language) fest. Bei der Ausrichtung inline steht zuerst die Anzahl der Empfehlung und anschließend folgender Text rechts neben dem Plus-Button: „Auf Google empfehlen“.

Unter Advanced options kann man noch folgende Einstellungen festlegen:

  • Asynchronous
  • HTML5 valid syntax

Interessant ist hier die Option URL. Hier kann man, wenn man möchte, eine feste Adresse für die Empfehlung / Like festlegen. Wird keine URL festgelegt, dann wird immer die Internetadresse ausgelesen, auf der der Button gerade zu sehen ist und angeklickt wurde.

Nachdem man sich durchgeklickt hat, erscheint rechts im Textfeld der fertige Code. Dieser könnte so aussehen:

<!– Place this tag where you want the +1 button to render. –>
<div class=“g-plusone“ data-annotation=“inline“ data-width=“300″></div>

<!– Place this tag after the last +1 button tag. –>
<script type=“text/javascript“>
window.___gcfg = {lang: ‚de‘};

(function() {
var po = document.createElement(’script‘); po.type = ‚text/javascript‘; po.async = true;
po.src = ‚https://apis.google.com/js/plusone.js‘;
var s = document.getElementsByTagName(’script‘)[0]; s.parentNode.insertBefore(po, s);
})();
</script>

Den oberen <div>-Tag kann man nun kopieren und platziert ihn an eine beliebige Stelle auf der eigenen Webseite. Unterhalb muss man noch den zweiten Teil (Javascript Code) in den HTML-Quelltext einfügen. Ich empfehle den zweiten Teil kurz vor dem schließenden <body>-Tag einzufügen (vor </body>).

Wo man den Empfehlen-Button in die Webseite einbindet, ist einem selbst überlassen. Je auffälliger im sichtbaren Bereich, desto höher ist die Wahrscheinlichkeit, dass er gesehen und schließlich von einem Nutzer geklickt wird. Social Media ist wichtig und sollte nicht vernachlässigt werden.

Kategorien
Tutorials

WordPress Theme optimieren

Jeder Blogger sollte auch sein WordPress Theme optimieren. Aus SEO-Sicht sind die meisten Themes schlecht optimiert. Besonders die h1-, h2- und h3-Tags werden in vielen Themes falsch genutzt.

Die Artikel des Blogs werden nach Aufnahme in die Suchmaschinen in den meisten Fällen zwar gut gelistet, jedoch sollte man trotzdem einige Tags im Theme anpassen.

Schaden kann es vermutlich nicht. Es es durchaus realistisch, dass der Blog nach der Anpassung noch besser gefunden wird.

h1-Tag aus dem Header entfernen

Auf vielen Blogs entdecke ich immer wieder den Tag <h1> … </h1> an der falschen Position. WordPress Theme-Designer verwenden diesen HTML-Tag anscheinend sehr gern, um den allgemeinen Titel des Blogs im Header zu definieren. Das ist natürlich möglich und erstmal nicht wirklich falsch.

Allerdings hat der Tag h1 eine sehr wichtige Rolle für Suchmaschinen. Der Tag beeinflusst das Ranking und sollte korrekt verwendet werden. Dieser sollte nicht auf jeder Seite identisch sein, wie es in den erwähnten Themes sehr oft der Fall ist.

Die Überschrift (h1) sollte den Inhalt der Unterseite kurz zusammenfassen und die wichtigsten Schlüsselwörter beinhalten. Man sollte im entsprechenden Header-Template des Themes <h1> … </h1> durch beispielsweise <span> … </span> ersetzen und die CSS (Stylesheet) dahingehend anpassen. Dieser Schritt sollte mit ein wenig HTML-Erfahrung binnen wenigen Minuten erledigt sein.

Tipp: Die Templatedatei des Headers befindet sich in einem Theme normalerweise im Unterordner /wp-content/themes/DEIN-THEME-NAME/header.php und kann entsprechend editiert werden.

Überschrift im Content platzieren

Nachdem der h1-Tag aus dem Header entfernt wurde, sollte dieser anschließend im Artikel platziert werden. Sehr oft ist hier bereits der h2-Tag als Überschrift bzw. Titel für den Artikel (Post) verwendet worden.

Der <h2> … </h2> sollte jetzt noch durch <h1> … <h2> ersetzt werden. Das entsprechende Template ist in der Regel die Datei single.php im oben erwähnten Themeordner.

Wenn im Theme eine Sidebar vorhanden ist, dann sollten je nach Bedarf auch die Überschriften in der Sidebar (<h3> … </h3>) abgeändert werden, da diese ebenfalls auf jeder Unterseite identisch sein könnten.