Je nach Design Einstellungen hast Du bei Divi* die Möglichkeit im Header und im Footer Social Media Icons wie Facebook, Google + und Twitter anzeigen zu lassen. Aber vielleicht möchtest Du Deinen YouTube Kanal oder Instagram einbinden? Gerne zeige ich Dir wie dies geht.
Beginnen wir aber mit der integrierten Lösung.
1. Social Media Icons anzeigen
Gehe im WordPress Backend zu Divi – Theme Optionen. Hier hast Du im Reiter „General“ die Möglichkeit die URL’s zu Deinen Social Media Kanälen einzugeben und mit dem Schalter das Icon auf Deiner Website zu aktivieren.
Achte hierbei darauf, dass auch beim Designmodifikator – Header & Navigation – Headerelemente die Option „Social Icons anzeigen“ aktiviert ist.
Das Gleiche gilt für Designmodifikator – Footer – Footerelemente.
Dies natürlich nur, wenn Du die Social Media Icons im Header und im Footer anzeigen lassen möchtest 🙂
Aber jetzt gehen wir zum eigentlichen Thema.
2. Weitere Social Media Icon hinzufügen
Damit Du bei Divi* weitere Social Media Icons hinzufügen kannst, musst Du auf die Theme Dateien zugreifen können. z.B. via FTP Server. Ich empfehle Dir auf jeden Fall mit einem „Child Theme“ zu arbeiten. So bleiben diese Änderungen auch nach einem Divi Update aktiv. Am Ende des Artikel findest Du einen Download mit diesen Dateien.
OK legen wir los.
Kopiere als Erstes die Datei social_icons.php im Ordner Divi – includes auf Deinem Computer. Dies ist die Originaldatei und beinhaltet bereits Code, damit die Social Media Icons angezeigt werden. Öffne nun diese Datei in einem Editor.
Nun fügst Du den untenstehenden Code zwischen dem letzten <?php endif; ?> und </ul> ein.
Code zum kopieren und einfügen:
<li class="et-social-icon et-social-youtube">
<a href="https://www.youtube.com/" class="icon">
<span><?php esc_html_e( 'Youtube', 'Divi' ); ?></span>
</a>
</li>Im Beispiel wäre dies nun der Code für YouTube. Füge nun bei https://www.youtube.com/ den Link zu Deinem YouTube Kanal ein. Achte darauf, dass die Anführungs- und Endzeichen stehen bleiben!
Möchtest Du nicht Deinen YouTube Kanal, sondern z.B. Instagram verlinken? Dann ändere den gelb markierten Text auf instagram. Zudem füge beim rot markierten Bereich Deine Instagram URL ein.
Möchtest Du mehr als einen zusätzlichen Social Media Kanal verlinken? Dann kopiere den Code so oft wie Du möchtest und ändere jeweils die URL und den gelb markierten Bereich.
Diese Methode funktioniert für folgende Social Media Kanäle:
- Tumblr
- Skype
- Flikr
- MySpace
- Dribble
- Youtube
So Du hast es bereits fast geschafft. Nun musst Du nur noch die Datei social_icons.php speichern und in Dein Divi Child Theme hochladen.
Dazu musst Du in Deinem Divi Child Theme einen neuen Ordner „includes“ erstellen und die social_icons.php Datei hier hochladen.
Fertig! :-D
Download Divi Child Theme inkl. social_icons.php
Gerne kannst Du hier ein vorbereitetes Divi Child Theme downloaden. Vergiss aber nicht in der Datei social_icons.php Deine Social Media Kanäle hinzuzufügen.
Download Divi Child Theme (zip-Datei)
Hast Du Dich schon mal gefragt, wie Du es einstellen kannst, dass sich die Social Icons in einem neuem Fenster öffenen?
Hier findest Du die Anleitung:
Divi – Social Icons in neuem Fenster öffnen
Wünsche Dir viel Freude mit Deiner Website und denk daran…
bleib natürlich – auch online.
Karin
Spürst du, dass in deinem Business noch viel mehr möglich ist?
Doch du bist langsam am Verzweifeln, weil es bei anderen scheinbar mühelos funktioniert – nur bei dir nicht?
Danke vielmals, hat prima geklappt!
Meine erste Suche im Netz ergab dein Treffer.
.zip herunter geladen. Social Datei angepasst und fertig.
Mega Danke dafür.
Gerngeschehen 😉 Freut mich sehr, wenn es verwendet wird.