Viele miteinander vernetzte Menschen

Share-Buttons und Social Icons

Veröffentlicht am

|

Aktualisiert am

Beim Erstellen einer WordPress-Website sollte man früher oder später dafür sorgen, dass Blogartikel oder sonstige Inhalte der Website möglichst einfach via Social Media weitergesagt werden können. Außerdem sollte man dem Besucher seiner Website das Auffinden der Social-Media-Präsenzen, die zur Website gehören, erleichtern.

Beides geschieht meist mit den Logo-Symbolen, die die einzelnen Netzwerke genau dafür anbieten. Das kann gerade Einsteiger aber schnell verwirren: Was ist was und wie unterscheidet man sie auf der Website?

Inhaltsverzeichnis

Share-Buttons zum Weitersagen

Natürlich kann man jede einzelne Seite im Web ganz einfach weiterempfehlen, indem man ihre URL aus der Adresszeile des Browsers kopiert und diese dann in der gewünschten Social-Media-Plattform per Hand in einen Beitrag einfügt. Per Smartphone geht es noch einfacher, denn dort gibt es diese Teilen-Option bereits im Browser.

Dasselbe kann man beim Erstellen einer Website mit dem Einsatz von sogenannten Share-Buttons, also Schaltflächen zum Teilen von Inhalten, anbieten.

Das Plugin »Shariff Wrapper«

Wenn man im WordPress-Pluginverzeichnis nach entsprechenden Lösungen sucht, findet man viele verschiedene Ergebnisse. Was die meisten davon jedoch gemeinsam haben, ist, dass sie nicht DSGVO-konform sind, also nicht den rechtlichen Vorgaben entsprechen. Das liegt daran, dass sie auf Skripten basieren, die dafür sorgen, dass die IP-Adresse eines Besuchers bereits an das betreffende Netzwerk gesendet wird, wenn er nur auf die Seite kommt. Also noch bevor er den betreffenden Button angeklickt hat.

Um dieses ungefragte Nach-Hause-Telefonieren zu verhindern, gibt es Plugins, die statt solcher Skripte statische Links verwenden. Die machen erst dann etwas, wenn man sie wirklich anklickt, und sind damit DSGVO-konform. Am besten ist dafür das Plugin Shariff Wrapper, dessen Einrichtung auch im Buch erläutert wird.

Das Plugin zum Einbinden von Sharebuttons

Im Gegensatz zu den Social Icons, die gleich noch ausführlicher behandelt werden, ist es für die Auswahl der passenden Share-Buttons überhaupt nicht von Belang, ob es in den betreffenden Netzwerken auch Profile gibt, die zu Ihrer Website gehören.

Die richtigen Share-Buttons auswählen

Share-Buttons werden von den Besuchern genutzt, um etwas über ihre eigenen Profile weiterzusagen. Wenn ein Besucher also Ihren Blogbeitrag via Facebook weitersagen will, ist es irrelevant, ob Sie dort ein Profil haben. Es geht nur um Ihre Besucher und Besucherinnen.

Deshalb sollte man die Share-Buttons danach auswählen, wo andere wahrscheinlich gern Ihre Beiträge teilen würden, und dafür gibt es Nutzerstatistiken. Die besagen übrigens, dass am häufigsten Messengerdienste, v.a. Whatsapp, und erst dann der frühere Spitzenreiter Facebook genutzt werden, um Beiträge weiterzusagen. Demnach wäre es ratsam, mindestens folgende Share-Buttons zu verwenden:

Shariff Wrapper bietet außerdem noch die Messengerdienste Telegram und Threema an. Nicht wundern: Buttons für Dienste, von denen es keine Desktopversion gibt, werden auch nur mobil angezeigt.

Wenn das, was geteilt werden soll, auch im beruflichen Kontext von Belang sein könnte, sollten die beruflichen Netzwerke bei den Buttons nicht fehlen:

Als Erleichterung für diejenigen, die sich den Beitrag zum später Lesen merken oder zum zeitversetzten Teilen ablegen wollen, gibt es zum Beispiel auch noch

Das könnte dann zum Beispiel so aussehen:

Share-Buttons für Desktop
Dieselbe Share-Buttonleiste mobil
(mit dem schwarzen Threema-Icon)

Mit diesen Buttons kann der Besucher dann – sofern er im betreffenden Netzwerk angemeldet ist – mit nur einem Klick eine Seite oder einen Beitrag von seinem Profil weiterempfehlen.

Auf Facebook sieht das dann etwa so aus:

Ein auf Facebook geteilter Beitrag

Die Platzierung von Share-Buttons

Share-Buttons werden üblicherweise unter einem Blogbeitrag oder einer Seite platziert, manchmal auch darüber oder seitlich schwebend. In manchen Webdesigns haben sie die Farben der jeweils dazugehörigen Netzwerke, in anderen sind sie einfarbig und verändern sich erst beim Berühren mit der Maus oder gar nicht.

Wichtig ist, dass man als Website-Ersteller etwas wie »Diesen Beitrag weiterempfehlen«, oder »Weitersagen« dazu schreibt, und sie im Layout eindeutig von den ähnlich aussehenden Social Icons unterscheidbar macht.

»Follow Me« – Social Icons

Um dem Websitebesucher das Auffinden der Social-Media-Präsenzen zu erleichtern, die zu Ihrer Website/Ihrem Blog gehören, gibt es Social Icons. Sie sind als Wegweiser zu der jeweiligen Präsenz und nicht zum Weitersagen von Inhalten da.

Social Icons als Menü

In vielen WordPress-Themes ist die Option für das Unterbringen von Social Icons schon eingebaut. So kann man zum Beispiel in Twenty Twenty ein eigenes Menü mit den Links zu seinen Social-Media-Präsenzen erstellen, das automatisch in Icons umgewandelt wird, wenn man die passende Menüposition dafür auswählt:

Die Menü-Einstellungen von Twenty Twenty

Twenty Twenty platziert die Icons dann im Footer der Website.

Social Icons als Block oder Plugin

Mit dem Block Social Icon oder mit einem Plugin wie Lightweight Social Icons kann man die Symbole frei als Block platzieren.

Um die Social Icons von den Sharebuttons optisch unterscheidbar zu machen, werden sie üblicherweise im Footer oder im Header platziert und einfarbig passend zur Website layoutet.

Social Icons auf einstieg-in-wp.de

Wer ganz sicher gehen will, kann sie auch nur als Textlinks in einem Widget darstellen und »Folgen Sie mir auch auf« dazu schreiben. Wer nicht so viele Social-Media-Profile und Menüpunkte auf seiner Website hat, kann die Wegweiser zu Facebook und Co. auch direkt in der Websitenavigation unterbringen.

Icon für RSS-Feed nicht vergessen

Eine Besonderheit gilt es bei den Social Icons zu beachten: Neben den Links zu den Social-Media-Präsenzen ergänzt man hier üblicherweise auch einen Link zum RSS-Feed der Website, um anderen das Abonnieren der eigenen Blogbeiträge zu erleichtern.

In WordPress ist dieser Feed standardmäßig unter …/feed zu finden. Hier auf der Website also unter

https://einstieg-in-wp.de/feed

Diesen Link können Ihre Leser dann in einem Feedreader (feedly.com, oder in einer App wie flipboard) speichern, oder über Dienste wie follow.it oder ifttt.com selbständig per Mail abonnieren.

Braucht man das alles wirklich?

Eine Website allein nützt nicht viel, wenn es dazu keine Gespräche in Social Media gibt. Neben der Responsivität einer Website und ihrer Ladegeschwindigkeit sind nämlich die sogenannten Social Signals für das Ranking in den Suchmaschinen wichtig.

Das bedeutet: Je öfter ein Beitrag oder eine Seite in Social Media verlinkt wird und Interaktionen bekommt, umso besser ist das Suchmaschinen-Ranking.

Auf einen Blick

Sharebuttons und Social Icons haben verschiedene Einsatzgebiete:

  • Über die Share-Buttons erleichtern Sie Ihren Besuchern das Weitersagen und damit das Erstellen eines Social Signals. Share-Buttons werden üblicherweise unter einem Beitrag oder einer Seite platziert.
  • Social Icons sind Wegweiser zu den Social-Media-Profilen des Websitebetreibers und werden für gewöhnlich im Footer oder Header einer Website platziert. Sie erleichtern es, in die von Ihnen initiierten Gespräche einzusteigen, und zu erkennen, welches Profil getaggt/markiert werden sollte.

Share-Buttons und Social Icons helfen Ihnen bei Verbreitung und Auffindbarkeit und erzeugen Social Signals, die wichtig für Ihr Suchmaschinen-Ranking sind.

Avatar von Annette Schwindt

Kommentare

4 Antworten zu „Share-Buttons und Social Icons“

  1. […] erste Beitrag über »Sharebuttons und Social Icons« ist bereits online, und weitere werden in den nächsten Monaten folgen. Freuen Sie sich drauf, […]

  2. […] Share-Buttons: Eine Weitersagen-Funktion, mit der die Besucher den Inhalt auf ihren eigenen Social-Media-Kanäle weiterleiten können. […]

  3. Eine Frage zu den automatischen „Social Icons“ beim Social-Media-Menü von Twenty Twenty:

    Wenn man eine @…..@mastodon.social – Präsenz einträgt, wird der Elefant als korrektes Social-Icon für Mastodon automatisch vom Theme im Frontend angezeigt.

    Dies gelingt jedoch nicht, bei anderen Präsenzen wie z.B. @…..@bonn.social, @…..@mastodontech.de usw.

    Gibt es dafür eine einfache Lösung?
    Wenn nicht, wäre es eine tolle Idee für eine Zusatzfunktion für das Plugin Twentig.

    1. Eine einfache Lösung dafür kenne ich auf Anhieb auch nicht. Das ist eine Kombination aus den Grenzen einer simplen Automatik und dem dezentralen Charakter von Mastodon:

      • Das eingebaute Social-Media-Menü erkennt vorgegebene Dienste und es ist schon erstaunlich, dass Mastodon in Form von mastodon.social überhaupt schon dabei ist. XING z. B. wird immer noch ignoriert.
      • Mastodon ist ja ein dezentraler Dienst, und somit gibt es noch unzählige andere Mastodon-Server, Tendenz steigend.
      • Bei einer URL wie bonn.social weiß die simple Automatik im Hintergrund nicht, dass es ein Mastodon-Server ist, und anscheinend wird wirklich nur mastodon.social geprüft.

      Alternativ könnte man ein spezielles Plugin für Social-Media-Icons einsetzen. In Social Icons Widget & Block von WPZoom kann man einer Adresse mit bonn.social manuell ein Mastodon-Icon zuweisen, aber für die Ausgabe der Links gibt es – wie der Plugin-Name schon sagt – ein Widget und/oder einen Block. Damit bekommt man die Icons in Twenty Twenty z. B. nicht so einfach in ein Social-Media-Menu ganz unten im Footer.

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert