Möchten Sie Social-Media-Symbole zu Ihrer WordPress-Website hinzufügen? Mit den richtigen Tools können Sie Follow-Buttons in Ihrer Kopfzeile, Fußzeile, Seitenleiste oder auf Ihren Landingpages platzieren – sogar für neuere Plattformen wie Threads, Mastodon oder Bluesky.
Dieser Leitfaden zeigt Ihnen drei einfache Methoden, darunter meine Lieblingsmethode mit SeedProd, damit Besucher Sie überall finden und verfolgen können, wo Sie online aktiv sind.
Warum sollten Sie Ihrer WordPress-Website Social-Media-Symbole hinzufügen?
Symbole für soziale Medien machen es Besuchern leicht, Ihnen auf anderen Plattformen zu folgen. Da die Menschen durchschnittlich 2 Stunden und 21 Minuten pro Tag in den sozialen Medien verbringen, können Sie sie mit Icons dort erreichen, wo sie bereits aktiv sind.
Außerdem sind die Symbole für soziale Medien klein, so dass Sie sie an vielen Stellen auf Ihrer Website anzeigen können:
- WordPress-Menüs
- WordPress Kopfzeilen
- WordPress-Fußzeilen
- WordPress-Widgetbereiche
- WordPress-Seiten/Beiträge
- WooCommerce Produkte
Hier ist ein Screenshot, der zeigt, wie WPBeginner Social-Media-Links in seiner WordPress-Seitenleiste anzeigt.
Wenn Sie Ihrer Website Symbole für soziale Medien hinzufügen, sollten Sie daran denken, dass sich die Schaltflächen zum Folgen von sozialen Medien von den Schaltflächen zum Teilen von Inhalten oder den Symbolen zum Teilen von sozialen Medien unterscheiden. Anstatt die Nutzer aufzufordern, Inhalte zu teilen, ermutigen sie die Besucher, Ihren Social-Media-Profilen zu folgen.
So fügen Sie Social-Media-Symbole in WordPress ein: 3 Methoden
Ich nutze SeedProd auf dieser Website, daher ist das meine erste Wahl. Die richtige Methode hängt jedoch von deiner Konfiguration ab:
| Ihre Konfiguration | Die beste Methode |
|---|---|
| Block-Theme (Twenty Twenty-Four, Kadence, Blocksy) | Methode 2: WordPress-Block „Social Icons“ |
| Klassisches Theme (Astra, GeneratePress, Divi, OceanWP) | Methode 3: Widgets |
| Möchten Sie individuelle Icon-Marken oder eine Platzierung auf der Landingpage? | Methode 1: SeedProd |
1. Hinzufügen von WordPress Social Media Icons mit SeedProd
Mit SeedProd ist es am einfachsten, benutzerdefinierte Symbole überall auf Ihrer Website hinzuzufügen.
SeedProd ist ein Drag-and-Drop-WordPress-Builder, mit dem Sie Kopf- und Fußzeilen, Seitenleisten und Landing Pages gestalten können, ohne den Code zu berühren. Der Social Profiles-Block macht es einfach, Symbole für jedes Netzwerk hinzuzufügen und anzupassen, einschließlich neuerer Plattformen wie Threads, Mastodon oder Bluesky.
Schritt 1. Installieren und Aktivieren von SeedProd
Besuchen Sie zunächst die Preisseite von SeedProd, wählen Sie Ihren Plan und erstellen Sie Ihr Konto. Für diesen Leitfaden verwenden wir SeedProd Pro wegen seiner erweiterten Funktionen.
Als Nächstes melden Sie sich in Ihrem Konto-Dashboard an und besuchen die Registerkarte Downloads. Von dort können Sie die Zip-Datei des Plugins herunterladen und Ihren Lizenzschlüssel kopieren.
Gehen Sie nun in Ihren WordPress-Administrationsbereich und laden Sie das SeedProd-Plugin hoch. Wenn Sie Hilfe bei diesem Schritt benötigen, folgen Sie dieser Anleitung zur Installation und Aktivierung eines WordPress-Plugins.
Sobald Sie das Plugin aktiviert haben, gehen Sie zu SeedProd " Einstellungen und fügen den zuvor kopierten Lizenzschlüssel ein. Klicken Sie auf die Schaltfläche " Schlüssel überprüfen", um die Einstellungen zu speichern, und fahren Sie dann mit dem nächsten Schritt fort.
Schritt 2. Erstellen Sie ein WordPress-Theme oder eine Landing Page
Der nächste Schritt ist die Erstellung einer Landing Page oder eines WordPress-Theme-Designs; dies hängt jedoch davon ab, welche SeedProd-Lizenz Sie in Schritt 1 gewählt haben.
Basic- und Plus-Benutzer können Landing Pages mit SeedProd erstellen, während Plus- und Elite-Benutzer Landing Pages und WordPress-Themes mit diesem Plugin erstellen können.
Folgen Sie den Schritten in diesen Anleitungen, um Ihr SeedProd-Design zu erstellen:
- Wie man ein benutzerdefiniertes WordPress-Theme erstellt
- Wie man eine Landing Page in WordPress erstellt
Nachdem Sie eine Landing Page oder ein WordPress-Theme erstellt haben, gehen Sie zu Schritt 3, um Ihre benutzerdefinierten WordPress-Symbole für soziale Medien hinzuzufügen.
Schritt 3. Fügen Sie Ihre benutzerdefinierten Social-Media-Symbole zu WordPress hinzu
Mit dem einfachen und leistungsstarken Theme Builder von SeedProd können Sie überall in WordPress benutzerdefinierte Social Media Icons hinzufügen. Nachdem Sie Ihr Website-Kit ausgewählt haben, müssen Sie nur jeden Theme-Teil öffnen und den Block "Soziale Profile" hinzufügen.
Hinzufügen von Social-Media-Symbolen zur WordPress-Kopfzeile
Beginnen wir mit dem Hinzufügen von Symbolen für soziale Profile zu Ihrem WordPress-Menü. Gehen Sie dazu zu SeedProd " Theme Builder, bewegen Sie den Mauszeiger über Ihre Header-Vorlage und klicken Sie auf die Schaltfläche Design bearbeiten.
Auf dem folgenden Bildschirm sehen Sie ein zweispaltiges Layout wie dieses:
Die von uns verwendete Vorlage hat standardmäßig eine zweispaltige Kopfzeile mit einem Logo und einem Navigationsmenü. Um Ihre sozialen Profilsymbole hinzuzufügen, müssen Sie sie in einen 3-spaltigen Abschnitt ändern.
Bewegen Sie zunächst den Mauszeiger über den Kopfzeilenabschnitt, bis er einen violetten Umriss hat, und klicken Sie dann auf die Schaltfläche Abschnitt duplizieren Symbol.
Bewegen Sie nun den Mauszeiger über den Inhalt des neuen Abschnitts, bis dieser einen blauen Rahmen hat, und klicken Sie dann auf das Mülleimer-Symbol, um ihn zu entfernen.
Klicken Sie anschließend auf die Option 3-Spalten-Layout, um sie zu Ihrem neuen Abschnitt hinzuzufügen.
Verschieben Sie dann die Elemente aus dem alten Bereich in den neuen Bereich, indem Sie sie per Drag & Drop verschieben.
Wenn Sie fertig sind, sollte noch eine leere Spalte übrig sein, in die Sie Ihre sozialen Profilsymbole einfügen können. Bevor Sie das tun, bewegen Sie den Mauszeiger noch einmal über Ihren alten Abschnitt und klicken Sie auf das Mülleimer-Symbol, um ihn zu löschen.
Um Ihre benutzerdefinierten sozialen Profile zu Ihrer Kopfzeile hinzuzufügen, suchen Sie den Block " Soziale Profile" in der linken Seitenleiste und ziehen Sie ihn auf Ihre leere Spalte. Jetzt können Sie auf den Block klicken, um seine Anpassungsoptionen zu sehen.
Standardmäßig werden im Block "Soziale Profile" Symbole für Facebook, Twitter, Instagram und YouTube angezeigt. Sie können die Symbole ändern, indem Sie auf jedes einzelne klicken und ein soziales Netzwerk aus dem Dropdown-Menü auswählen.
Sie können zwischen verschiedenen Plattformen wählen:
- Diskord
- Facebook Messenger
- GitHub
- IMDB
- Mittel
- Telefon
- RSS
- Slack
- Snapchat
- SoundCloud
- Telegramm
- TikTok
- Vimeo
- WordPress
- YouTube
- Benutzerdefiniert
Um eine benutzerdefinierte Schaltfläche für soziale Medien hinzuzufügen, klicken Sie auf die Option Benutzerdefiniert und das Zahnradsymbol, um die Einstellungen zu öffnen.
Klicken Sie als Nächstes auf die Option Symbol auswählen und suchen Sie mit Font Awesome nach einem anderen Symbol, das zu Ihren Anforderungen für soziale Medien passt. Sie können zum Beispiel benutzerdefinierte Social Icons für Spotify, Skype, Tumblr, Behance, Airbnb, Audible, Playstation und viele andere hinzufügen.
Nachdem Sie Ihr individuelles soziales Profilsymbol ausgewählt haben, können Sie die Farbe des Symbols ändern und Ihren individuellen Link hinzufügen.
Weiter unten im Einstellungsfeld finden Sie Optionen zum Ändern von Stil, Größe und Ausrichtung Ihres Symbols.
Auf der Registerkarte " Vorlagen" können Sie Ihren Symbolen mit einem Klick einen eigenen Stil hinzufügen.
Auf der Registerkarte " Erweitert" finden Sie Einstellungen, mit denen Sie den Stil der Symbole auf einer detaillierten Ebene anpassen können. Sie können zum Beispiel die Hintergrundfarbe, die Größe, den Abstand, den Schatten, den Rand und die Auffüllung des Symbols ändern.
Sie können auch Ihre sozialen Profilsymbole auf Mobil- oder Desktop-Geräten ein- oder ausblenden, was eine hervorragende Möglichkeit ist, die mobile Optimierung für Besucher mit einem Smartphone oder Tablet zu verbessern.
Bevor Sie Ihre Änderungen speichern, bewegen Sie den Mauszeiger über den Block Soziale Profile und klicken Sie auf das Symbol Speichern. So können Sie ihn in anderen Bereichen Ihrer Website wiederverwenden, ohne jeden sozialen Link und jedes benutzerdefinierte Symbol erneut manuell hinzufügen zu müssen.
Geben Sie Ihrem Block in dem Popup-Fenster einen Namen wie "Custom Social Icons" und speichern Sie.
Wenn Sie mit Ihren WordPress-Symbolen für soziale Medien zufrieden sind, klicken Sie auf die Schaltfläche Speichern oben rechts auf Ihrem Bildschirm.
Fügen wir nun Ihre Symbole für soziale Medien in die Fußzeile Ihrer Website ein.
Hinzufügen von Social-Media-Symbolen zur WordPress-Fußzeile
Um soziale Symbole zu Ihrer Fußzeile hinzuzufügen, gehen Sie zum Dashboard des SeedProd-Theme-Builders, bewegen Sie den Mauszeiger über die Fußzeilenvorlage und klicken Sie auf den Link Design bearbeiten.
Öffnen Sie als Nächstes die Rubrik Gespeicherte Blöcke in der linken Seitenleiste, und ziehen Sie den benutzerdefinierten Block mit den sozialen Symbolen, den Sie im letzten Schritt gespeichert haben, in eine Spalte in Ihrem Fußzeilenbereich.
Wenn Ihr WordPress-Footer eine ähnliche Hintergrundfarbe wie Ihre Icons hat, können Sie auf die Registerkarte Erweitert klicken und mit dem Farbwähler eine neue Icon-Farbe auswählen.
Wenn alles passt, klicken Sie auf die Schaltfläche Speichern, um Ihre Änderungen zu speichern.
Hinzufügen von Social-Media-Symbolen zur WordPress-Seitenleiste
Um Ihrer WordPress-Seitenleiste benutzerdefinierte soziale Symbole hinzuzufügen, gehen Sie zurück zum Dashboard des Theme-Builders, bewegen Sie den Mauszeiger über die Seitenleistenvorlage und klicken Sie auf den Link Design bearbeiten.
Wiederholen Sie nun die Anweisungen des vorherigen Schritts und klicken Sie auf die Schaltfläche Speichern, wenn Sie fertig sind.
Sie können diesen Vorgang auch für jede andere Seite Ihrer Website wiederholen, einschließlich Ihrer Landing Pages und Inhaltsseiten, wie z. B. Ihre Info-, Service- und Kontaktseiten.
Schritt 4. Veröffentlichen Sie Ihre Änderungen
Der letzte Schritt besteht darin, Ihr neues WordPress-Theme zu veröffentlichen, damit Ihre Website-Besucher Ihre neuen Symbole für die sozialen Medien sehen können. Gehen Sie dazu zum Theme Builder Dashboard und schalten Sie den Schalter "SeedProd-Theme aktivieren" auf "Ja".
Jetzt können Sie sich Ihre Änderungen ansehen. Hier sind ein paar Beispiele aus diesem Tutorial:
Kopfzeile
Fußzeile
Seitenleiste
2. Verwendung des integrierten WordPress-Blocks mit sozialen Symbolen
Wenn Sie WordPress 5.4 oder eine neuere Version verwenden, steht Ihnen der Block „Social Icons“ bereits zur Verfügung. Dies ist die schnellste kostenlose Möglichkeit, Symbole hinzuzufügen, und funktioniert am besten mit Block-Themes.
Gehen Sie zunächst zu „Darstellung“ » „Editor“, um den Website-Editor zu öffnen, oder öffnen Sie eine beliebige Seite oder einen Beitrag, auf der bzw. in dem Sie Symbole einfügen möchten.
Klicken Sie auf die Schaltfläche +, suchen Sie nach "Social Icons" und fügen Sie den Block ein.
Klicken Sie innerhalb des Blocks auf das Symbol + Hinzufügen. Es wird eine Liste mit integrierten Netzwerken wie Facebook, Instagram, LinkedIn und X (Twitter) angezeigt. Wählen Sie die gewünschten Netzwerke aus.
Jedes Symbol hat ein Feld für die URL Ihres Profils. Fügen Sie Ihren Link ein, und es wird sofort eine Verbindung hergestellt.
Um Symbole zu Ihrer Kopf- oder Fußzeile hinzuzufügen, gehen Sie zu „Darstellung“ » „Editor“ und wählen Sie den Abschnitt „Kopfzeile“ oder „Fußzeile“ einer Vorlage aus.
Klicken Sie auf „+“, suchen Sie nach „Social Icons“ und fügen Sie den Block an der gewünschten Stelle ein.
Wenn Sie den Menüpunkt „Darstellung“ » „Editor“ nicht sehen, verwenden Sie ein klassisches Theme. Verwenden Sie in diesem Fall Methode 3 unten.
Der Standard-Block deckt die meisten großen Netzwerke ab. Für die Platzierung auf Landingpages oder ein individuelles Branding bietet SeedProd Ihnen mehr Kontrolle.
3. Hinzufügen von Social-Media-Symbolen zu einem klassischen WordPress-Theme
Klassische Themes verfügen nicht über einen Site-Editor, aber Widget-Bereiche eignen sich gut für Seitenleisten und Fußzeilen.
Gehen Sie zu „Darstellung“ » „Widgets“. Klicken Sie in einem beliebigen Widget-Bereich auf „+“, suchen Sie nach „Social Icons“ und fügen Sie den Block hinzu.
Klicken Sie auf das Symbol „+ Hinzufügen“, wählen Sie die einzelnen Netzwerke aus und fügen Sie die URL Ihres Profils ein. Klicken Sie auf „Aktualisieren“, um die Änderungen zu speichern.
Ein Hinweis: Widgets platzieren Symbole in Seitenleisten und Fußzeilenbereichen. Die Platzierung in der Kopfzeile eines klassischen Themes übernimmt der Theme Builder von SeedProd über seinen Drag-and-Drop-Editor.
FAQs zum Hinzufügen von Social-Media-Symbolen zu WordPress
Ich hoffe, dieser Artikel hat dir dabei geholfen, zu lernen, wie du Social-Media-Symbole zu deiner WordPress-Seite hinzufügen kannst.
Vielleicht gefallen Ihnen auch diese anderen hilfreichen Leitfäden aus unserem Blog:
- Wie man eine moderne WordPress-Seite "Under Construction" erstellt
- Wie Sie Ihr Blog promoten (Anleitung für Anfänger)
- Wie man Facebook-Events in WordPress einbettet
Vielen Dank fürs Lesen! Wir würden uns freuen, Ihre Meinung zu hören. Bitte beteiligen Sie sich an der Konversation auf YouTube, X und Facebook, um weitere hilfreiche Ratschläge und Inhalte für das Wachstum Ihres Unternehmens zu erhalten.
