Social Media-Tools, Widgets & Seitenleisten

Widgets »Social Icons-Widget

Viele, jedoch nicht alle WordPress.com-Themes bieten Social Media-Buttons im Header- oder Footer-Bereich Auch wenn dein Theme diese Funktion nicht aufweist, möchtest du deine Buttons woanders platzieren oder andere Icons verwenden, die zu deinem Header passen. Es gibt mehrere Möglichkeiten, Social Media-Icons zu deiner Website hinzuzufügen!

In diesem Leitfaden wird erklärt, wie du unter Verwendung beliebiger Icons Social Media-Buttons zur Seitenleiste oder zum Footer hinzufügen kannst.

Inhaltsverzeichnis

Social Icons-Widget
Hinzufügen des Social Icons-Widget
Neuanordnen der Icons
Verfügbare Icons
Hinzufügen individueller Social Icons
Beispiele und Beispielbilder
Häufig gestellte Fragen


Social Icons-Widget

Das Social Icons-Widget zeigt kleine Grafiken, die mit deinen Social Media-Konten verknüpft sind, in jedem Widget-Bereich deines Themes an. Nachdem du deinen Profilen in sozialen Netzwerken Links hinzugefügt hast, werden automatisch Icons auf deiner Website angezeigt, über die deine Besucher in deinen bevorzugten Netzwerken Kontakt zu dir aufnehmen können.

 

↑ Inhaltsverzeichnis ↑

Hinzufügen des Social Icons-Widgets

  1. Gehe zu Meine WebsitesAnpassen Widgets
  2. Wähle den Widget-Bereich aus, dem du Social Icons hinzufügen möchtest, und klicke auf Widget hinzufügen.
  3. Suche das Social Icons-Widget (Jetpack), und klicke auf den Titel, um es hinzuzufügen.
  4. Wähle einen Titel für dein Widget aus.
  5. Wähle eine Größe für deine Social Icons aus: Klein, mittel oder groß.
  6. Füge deinem ersten Social Media-Profil einen vollständigen Link (URL) hinzu, z. B. https://www.facebook.com/WordPresscom/
  7. Wenn du noch mehr Social Media-Icons hinzufügen möchtest, klicke auf Icon hinzufügen und füge die nächste URL zu einem Social Media-Profil hinzu.
  8. Wenn du mit dem Hinzufügen deiner Profile in sozialen Netzwerken fertig bist, klicke auf „Veröffentlichen“, um deine Änderungen zu speichern.

Deine brandneuen Social Icons befinden sich jetzt auf deiner Website!


↑ Inhaltsverzeichnis ↑

Neuanordnen der Icons

Du kannst die Reihenfolge deiner Icons jederzeit ändern, indem du sie per Drag-and-drop an die gewünschte Stelle ziehst. Die neue Reihenfolge wird live im Vorschaubereich von Customizer angezeigt.


↑ Inhaltsverzeichnis ↑

Verfügbare Icons

Wir unterstützen Icons für verschiedene Netzwerke.

Klicke hier, um eine Liste verfügbarer Icons anzuzeigen.

500px

Amazon

Apple

Bandcamp

Behance

CodePen

DeviantArt

Digg

Dribbble

Dropbox

E-Mail-Adressen (wenn deine E-Mail beispielweise me@mygroovydomain.com laute, gib mailto:me@mygroovydomain.com im Feld Konto-URL ein)

Etsy

Facebook

Flickr

Foursquare

Goodreads

Google+

Google

GitHub

Instagram

iTunes

LinkedIn

Mittelgroß

Meetup

Pinterest

Pocket

Reddit

RSS-Feeds

Skype

SlideShare

Snapchat

SoundCloud

Spotify

StumbleUpon

Tumblr

Twitch

Twitter

Vimeo

VK

WordPress

Yelp

YouTube


↑ Inhaltsverzeichnis ↑

Hinzufügen individueller Social Icons

Die Farbe der Social Icons auf deiner Website hängt vom Theme ab, das du verwendest. Wenn du Icons mit einer bestimmten Farbe hinzufügen willst oder mehr Kontrolle über die Anzeige der Icons haben willst, kannst du mit dem Text-Widget oder einem individuellen HTML-Widget und ein wenig HTML individuelle Icons hinzufügen. Dies ist auch hilfreich, wenn du Icons für weniger bekannte soziale Netzwerke hinzufügen willst.

Schritt 1. Suche ein paar Social Media-Icons, die dir gefallen, und lade sie in deine Mediathek hoch.

Du hast möglicherweise schon ein paar Icons, die du verwenden möchtest, aber wenn nicht, kannst du eine Google-Suche nach „kostenlosen Social Media-Icons“ durchführen. Achte bei der Auswahl von Bildern darauf, keine Urheberrechte zu verletzen. Wenn du Bilder gefunden hast, die dir gefallen, lade sie auf deinen Computer herunter.

Gehe dann zu Meine Website Medien → Hinzufügen und lade dann all die Icons auf deine Website hoch.

Schritt 2. Füge ein Text-Widget oder ein individuelles HTML-Widget hinzu und formatiere deine Buttons mithilfe von HTML.

Gehe zu AnpassenWidgets Wähle den Widget-Bereich aus, dem du Social Icons hinzufügen möchtest, und klicke auf Widget hinzufügen. Suche das Text-Widget und klicke auf Hinzufügen.

Füge ggf. einen Titel zu deinem Widget hinzu und füge HTML gemäß folgender Struktur hinzu:

Ersetze die Teile in Klammern durch deine konkreten Angaben. Entferne die Klammern, aber behalte die Anführungszeichen und alles andere bei. Füge für die vollständigen Links den Link ein, auf den der Button zeigen soll. Achte darauf, dass jeder Link mit http:// oder https:// beginnt. Für deine Twitter-Seite würde der Link z. B. folgendermaßen aussehen:

https://twitter.com/mytwitterhandle

Suche für die Bild-URLs in deiner Mediathek nach dem Social Icon. Rufe dazu Meine WebsiteMedien auf, klicke dann auf das Bild deines Social Icon und wähle Bearbeiten aus. Klicke dann auf Kopieren, um die URL zu speichern, und wähle Zurück oder Fertig aus, um die Bildanzeige zu beenden.

Wiederhole den Code für Links und Bild-URLs für jedes Social Icon, das du hinzufügen willst. Wenn du Dienste hinzufügen oder entfernen oder in einer anderen Reihenfolge anzeigen möchtest, kannst du den Code bei Bedarf bearbeiten. Möglicherweise musst du an den Werten für Breite und Höhe herumbasteln, damit alle deine Symbole ordentlich in der Seitenleiste angezeigt werden. Wir haben oben als Beispiel 35 x 35 angegeben, aber du kannst diese Werte durch beliebige Werte ersetzen.

Schritt 3 Wenn du fertig bist, klicke auf Veröffentlichen und sieh dir deine neuen Social Media-Buttons an!

wordpress-follow-social-buttons

↑ Inhaltsverzeichnis ↑

Beispiele und Beispielbilder

Wenn du Probleme hast, Social Media-Icons im Internet zu finden, und ein paar Beispiele benötigst, findest du auf dieser Website weitere Informationen.

Um diese Icons zuerst in deinem Widget zu verwenden, erstelle über Anpassen → Widgets ein leeres Text-Widget.

Kopiere als Nächstes für den von dir bevorzugten Icon-Stil den Codeblock von der Seite Social Media-Widgets:

https:i.cloudup.com/F8A06JGNs4.png

↑ Inhaltsverzeichnis ↑

Häufig gestellte Fragen

Warum wird das Social Media-Icon nicht angezeigt?

Wenn du eine lokalisierte Version der Adresse deiner Social Media-Seite verwendest, werden die Social Media-Icons möglicherweise nicht angezeigt. Versuche stattdessen, den lokalen Abschnitt deines Social Media-Links durch die globale Version zu ersetzen.

Beispiel: https://www.pinterest.fr/yourpinterest/ should be replaced with https://www.pinterest.com/yourpinterest/