Divi Theme: weitere Social Media Icons hinzufügen

Divi Social Media Icons

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.

Divi Social Media Icons

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 🙂

Divi Social Media Icons

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.

Divi Social Media Icons

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:

  • Pinterest
  • Linkedin
  • Tumblr
  • Instagram
  • Skype
  • Flikr
  • MySpace
  • Dribble
  • Youtube

So Du hast es bereits fast geschaft. 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! 😀 

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)

 

Wünsche Dir viel Freude mit Deiner Website und denk daran…

bleib natürlich – auch online.

Karin

 

Share on Facebook1Tweet about this on TwitterShare on Google+0Email this to someone
Veröffentlicht am: 05. Sep 2017
Veröffentlicht in: Webdesign

Schreibe einen Kommentar

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