Möchten Sie Social-Media-Symbole zu Ihrer WordPress-Website hinzufügen? Mit den richtigen Tools können Sie Follow-Buttons in Ihrem Header, Footer, Ihrer Sidebar oder auf Landingpages platzieren, auch für neuere Plattformen wie Threads, Mastodon oder Bluesky.
Diese Anleitung zeigt Ihnen drei einfache Methoden, einschließlich meiner bevorzugten Methode mit SeedProd, damit Besucher Sie überall dort finden und abonnieren können, wo Sie online aktiv sind.
Warum Social-Media-Symbole zu Ihrer WordPress-Website hinzufügen?
Social-Media-Symbole erleichtern es Besuchern, Ihnen auf anderen Plattformen zu folgen. Da Menschen durchschnittlich 2 Stunden und 21 Minuten pro Tag in sozialen Medien verbringen, helfen Ihnen Symbole dabei, sie dort zu erreichen, wo sie bereits aktiv sind.
Darüber hinaus sind Social-Media-Symbole klein, sodass Sie sie in vielen Bereichen Ihrer Website anzeigen können, darunter:
- WordPress-Menüs
- WordPress-Header
- WordPress-Footer
- WordPress-Widget-Bereiche
- WordPress-Seiten/Beiträge
- WooCommerce-Produkte
Hier ist ein Screenshot, wie WPBeginner Social-Media-Links in seiner WordPress-Sidebar anzeigt.
Wenn Sie Social-Media-Symbole zu Ihrer Website hinzufügen, ist es hilfreich zu wissen, dass Social-Media-Follow-Buttons sich von Social-Sharing-Buttons oder Social-Sharing-Symbolen unterscheiden. Anstatt Benutzer zum Teilen von Inhalten aufzufordern, ermutigen sie Besucher, Ihren Social-Media-Profilen zu folgen.
So fügen Sie Social-Media-Symbole zu WordPress hinzu: 3 Methoden
Ich verwende SeedProd auf dieser Website, daher ist das meine bevorzugte Methode. Aber die richtige Methode hängt von Ihrem Setup ab:
| Ihr Setup | Beste Methode |
|---|---|
| Block-Theme (Twenty Twenty-Four, Kadence, Blocksy) | Methode 2: WordPress Social Icons Block |
| Klassisches Theme (Astra, GeneratePress, Divi, OceanWP) | Methode 3: Widgets |
| Benötigen Sie benutzerdefinierte Icon-Marken oder Platzierung auf Landingpages | Methode 1: SeedProd |
1. Hinzufügen von WordPress Social-Media-Symbolen mit SeedProd
Der einfachste Weg, benutzerdefinierte Symbole überall auf Ihrer Website hinzuzufügen, ist mit SeedProd.
SeedProd ist ein Drag-and-Drop-WordPress-Builder, mit dem Sie Header, Footer, Sidebars und Landingpages gestalten können, ohne Code anfassen zu müssen. Sein 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. SeedProd installieren und aktivieren
Besuchen Sie zunächst die SeedProd-Preisseite, wählen Sie Ihren Plan und erstellen Sie Ihr Konto. Für diese Anleitung verwenden wir SeedProd Pro wegen seiner erweiterten Funktionen.
Melden Sie sich als Nächstes in Ihrem Konto-Dashboard an und besuchen Sie den Tab Downloads. Von dort können Sie die Plugin-Zip-Datei herunterladen und Ihren Lizenzschlüssel kopieren.
Wechseln Sie nun in Ihren WordPress-Adminbereich und laden Sie das SeedProd-Plugin hoch. Wenn Sie Hilfe bei diesem Schritt benötigen, folgen Sie dieser Anleitung zum Installieren und Aktivieren eines WordPress-Plugins.
Nachdem Sie das Plugin aktiviert haben, gehen Sie zu SeedProd » Einstellungen und fügen Sie 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. WordPress-Theme oder Landing Page erstellen
Der nächste Schritt ist die Erstellung einer Landingpage 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 Landingpages mit SeedProd erstellen, während Plus- und Elite-Benutzer mit diesem Plugin Landingpages und WordPress-Themes erstellen können.
Befolgen Sie die Schritte in diesen Tutorials, um Ihr SeedProd-Design zu erstellen:
- So erstellen Sie ein benutzerdefiniertes WordPress-Theme
- So erstellen Sie eine Landingpage in WordPress
Nachdem Sie eine Landingpage oder ein WordPress-Theme erstellt haben, fahren Sie mit Schritt 3 fort, um Ihre benutzerdefinierten WordPress-Social-Media-Icons hinzuzufügen.
Schritt 3. Fügen Sie Ihre benutzerdefinierten Social-Media-Symbole zu WordPress hinzu
SeedProd ermöglicht es Ihnen, benutzerdefinierte Social-Media-Icons mit seinem einfachen und leistungsstarken Theme Builder überall in WordPress hinzuzufügen. Nachdem Sie Ihr Website-Kit ausgewählt haben, müssen Sie lediglich jeden Theme-Teil öffnen und den Social Profiles-Block hinzufügen.
Hinzufügen von Social-Media-Icons zum WordPress-Header
Beginnen wir damit, Social-Profile-Icons zu Ihrem WordPress-Menü hinzuzufügen. Gehen Sie dazu zu SeedProd » Theme Builder, fahren Sie mit Ihrer Header-Vorlage fort und klicken Sie auf die Schaltfläche Design bearbeiten .
Auf dem folgenden Bildschirm sehen Sie ein Layout mit 2 Spalten, wie dieses:
Standardmäßig verfügt die von uns verwendete Vorlage über einen Header mit 2 Spalten mit einem Logo und einem Navigationsmenü. Um Ihre Social-Profile-Icons hinzuzufügen, müssen Sie ihn in einen Bereich mit 3 Spalten ändern.
Fahren Sie zunächst mit dem Header-Bereich fort, bis er einen lila Umriss hat, und klicken Sie dann auf das Symbol zum Duplizieren des Bereichs.
Fahren Sie nun im neuen Bereich mit den Inhalten fort, bis sie einen blauen Rand haben, und klicken Sie dann auf das Symbol Papierkorb, um sie zu entfernen.
Danach klicken Sie auf die Option 3-Spalten-Layout , um sie zu Ihrem neuen Bereich hinzuzufügen.
Verschieben Sie nun die Elemente aus dem alten Bereich in Ihren neuen Bereich, indem Sie sie ziehen und ablegen.
Wenn Sie fertig sind, sollte noch 1 leere Spalte übrig sein, in die Sie Ihre Social-Profile-Icons einfügen können. Bevor Sie dies tun, fahren Sie noch einmal mit Ihrem alten Bereich fort und klicken Sie auf das Symbol Papierkorb, um ihn zu löschen.
Um Ihre benutzerdefinierten sozialen Profile zu Ihrem Header hinzuzufügen, suchen Sie den Block Social Profiles in der linken Seitenleiste und ziehen Sie ihn in Ihre leere Spalte. Nun können Sie auf den Block klicken, um seine Anpassungsoptionen anzuzeigen.
Standardmäßig zeigt der Social Profiles-Block Symbole für Facebook, Twitter, Instagram und YouTube an. Sie können die Symbole ändern, indem Sie auf jedes Symbol klicken und ein soziales Netzwerk aus dem Dropdown-Menü auswählen.
Die Plattformen, aus denen Sie wählen können, umfassen:
- Discord
- Facebook Messenger
- GitHub
- IMDB
- Mittel
- Telefon
- RSS
- Slack
- Snapchat
- SoundCloud
- Telegram
- 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 Ihren Anforderungen für soziale Medien entspricht. Sie können zum Beispiel benutzerdefinierte soziale Symbole für Spotify, Skype, Tumblr, Behance, Airbnb, Audible, Playstation und viele mehr hinzufügen.
Nachdem Sie Ihr benutzerdefiniertes Symbol für soziale Profile ausgewählt haben, können Sie die Symbolfarbe ändern und Ihren benutzerdefinierten Link hinzufügen.
Weiter unten im Einstellungsbereich finden Sie Optionen zum Ändern von Symbolstil, -größe und -ausrichtung.
Im Tab Vorlagen können Sie Ihren Symbolen mit 1 Klick einen benutzerdefinierten Stil hinzufügen.
Der Tab Erweitert bietet Einstellungen zur detaillierten Anpassung von Symbolstilen. Sie können zum Beispiel die Hintergrundfarbe, Größe, den Abstand, Schatten, Ränder und Abstände der Symbole ändern.
Sie können Ihre Social-Profile-Symbole auch auf Mobil- oder Desktop-Geräten anzeigen oder ausblenden, was eine hervorragende Möglichkeit ist, die mobile Optimierung für Besucher zu verbessern, die ein Smartphone oder Tablet verwenden.
Bevor Sie Ihre Änderungen speichern, fahren Sie mit der Maus über Ihren Social Profiles-Block und klicken Sie auf das Speichern-Symbol. 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 also im Popup-Fenster Ihrem Block einen Namen wie „Benutzerdefinierte soziale Symbole“ und speichern Sie ihn.
Wenn Sie mit Ihren WordPress-Social-Media-Symbolen zufrieden sind, klicken Sie auf die Schaltfläche Speichern oben rechts auf Ihrem Bildschirm.
Fügen wir nun Ihre Social-Media-Symbole zum Footer Ihrer Website hinzu.
Hinzufügen von Social-Media-Symbolen zum WordPress-Footer
Um Social-Media-Symbole zu Ihrem Footer hinzuzufügen, gehen Sie zum SeedProd Theme Builder Dashboard, fahren Sie mit der Maus über die Footer-Vorlage und klicken Sie auf den Link Design bearbeiten.
Öffnen Sie als Nächstes die Überschrift Gespeicherte Blöcke in der linken Seitenleiste und ziehen Sie den benutzerdefinierten Social-Media-Icons-Block, den Sie im letzten Schritt gespeichert haben, in eine Spalte in Ihrem Footer-Bereich.
Wenn Ihr WordPress-Footer eine ähnliche Hintergrundfarbe wie Ihre Symbole hat, können Sie auf die Registerkarte Erweitert klicken und mit der Farbauswahl eine neue Symbolfarbe 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 benutzerdefinierte Social-Media-Symbole zu Ihrer WordPress-Seitenleiste hinzuzufügen, gehen Sie zurück zum Theme Builder Dashboard, fahren Sie mit der Maus über die Seitenleisten-Vorlage und klicken Sie auf den Link Design bearbeiten.
Wiederholen Sie nun die Anweisungen aus dem vorherigen Schritt und klicken Sie auf die Schaltfläche Speichern, wenn Sie fertig sind.
Sie können diesen Vorgang auch für jede Seite Ihrer Website wiederholen, einschließlich Ihrer Landingpages und Inhaltsseiten wie Über uns, Dienstleistungen und Kontakt.
Schritt 4. Veröffentlichen Sie Ihre Änderungen
Der letzte Schritt ist die Veröffentlichung Ihres neuen WordPress-Themes, damit Ihre Website-Besucher Ihre neuen Social-Media-Profilsymbole 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 einige Beispiele aus diesem Tutorial:
Kopfzeile
Fußzeile
Seitenleiste
2. Verwendung des integrierten WordPress Social Icons Blocks
Wenn Sie WordPress 5.4 oder neuer verwenden, haben Sie bereits Zugriff auf den Social Icons Block. Dies ist der schnellste kostenlose Weg, um Symbole hinzuzufügen, und er funktioniert am besten mit Block-Themes.
Gehen Sie zuerst zu Darstellung » Editor, um den Website-Editor zu öffnen, oder öffnen Sie eine beliebige Seite oder einen Beitrag, auf dem Sie Symbole wünschen.
Klicken Sie auf die Schaltfläche +, suchen Sie nach „Social Icons“ und fügen Sie den Block ein.
Klicken Sie im Block auf + Symbol hinzufügen. Sie sehen eine Liste integrierter Netzwerke wie Facebook, Instagram, LinkedIn und X (Twitter). Wählen Sie die benötigten aus.
Jedes Symbol hat ein Feld für Ihre Profil-URL. Fügen Sie Ihren Link ein, und er wird sofort verbunden.
Um Symbole zu Ihrem Header oder Footer hinzuzufügen, gehen Sie zu Darstellung » Editor und wählen Sie den Header- oder Footer-Bereich einer Vorlage aus.
Klicken Sie auf +, suchen Sie nach „Social Icons“ und fügen Sie den Block dort hinzu, wo Sie ihn haben möchten.
Wenn Sie Darstellung » Editor nicht sehen, verwenden Sie ein klassisches Theme. Verwenden Sie Methode 3 unten.
Der native Block deckt die meisten großen Netzwerke ab. Für die Platzierung auf Landingpages oder für erweitertes benutzerdefiniertes Branding bietet SeedProd mehr Kontrolle.
3. Hinzufügen von Social-Media-Symbolen zu einem klassischen WordPress-Theme
Klassische Themes haben keinen Website-Editor, aber Widget-Bereiche eignen sich gut für Seitenleisten und Footer.
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 + Symbol hinzufügen, wählen Sie jedes Netzwerk aus und fügen Sie Ihre Profil-URL ein. Klicken Sie auf Aktualisieren, um zu speichern.
Eine Anmerkung: Widgets platzieren Symbole in Seitenleisten und Fußzeilenbereichen. Für die Platzierung im Header bei einem klassischen Theme wird dies über den Drag-and-Drop-Editor von SeedProd’s Theme Builder gehandhabt.
FAQs zum Hinzufügen von Social-Media-Symbolen zu WordPress
Ich hoffe, dieser Artikel hat Ihnen geholfen zu lernen, wie Sie Social-Media-Symbole zu Ihrer WordPress-Seite hinzufügen.
Sie könnten auch diese anderen hilfreichen Anleitungen aus unserem Blog mögen:
- So erstellen Sie eine moderne „Im Aufbau“-Seite für WordPress
- Wie Sie Ihren Blog bewerben (Anfängerleitfaden)
- So betten Sie Facebook-Veranstaltungen auf WordPress ein
Danke fürs Lesen! Wir würden uns freuen, Ihre Gedanken zu hören. Treten Sie also gerne der Unterhaltung auf YouTube, X und Facebook bei, um weitere hilfreiche Ratschläge und Inhalte für das Wachstum Ihres Unternehmens zu erhalten.
