t3n News Entwicklung

WordPress: So kannst du die Standard-Smileys einfach ersetzen

WordPress: So kannst du die Standard-Smileys einfach ersetzen

bringt standardmäßig ein Set an Smileys mit – doch nicht alle Nutzer mögen das . Wie ihr diese Smileys austauschen könnt, ohne nach jedem WordPress-Update wieder aktiv werden zu müssen, erfahrt ihr hier.

WordPress: So kannst du die Standard-Smileys einfach ersetzen

WordPress-Smileys. (Grafik: avryl/new-smileys – GitHub)

Auf den meisten WordPress-Seiten ist vermutlich die Funktion aktiviert, dass die Smiley-Codes wie :D automatisch in Smiley-Grafiken umgewandelt werden. Mit den Standard-Smileys, die WordPress mitliefert, dürfte aber nicht jeder zufrieden sein – meiner Meinung nach sieht beispielsweise dieser Smiley :) ( :) ) auf den ersten Blick eher fies aus, nicht freundlich – und auf den zweiten Blick lacht er und lächelt immer noch nicht.

WordPress-Smileys: Manchmal nichts halbes und nichts ganzes. (Screenshot: eigene WordPress-Installation)
WordPress-Smileys: Manchmal nichts Halbes und nichts Ganzes. (Screenshot: WordPress)

WordPress-Smileys austauschen – aber richtig

Nun könntet ihr natürlich einfach die Smiley-Grafiken austauschen – sie liegen im Ordner wp-includes/images/smilies – oder die Pfade zu den Smileys anpassen – möglich in der wp-includes/formatting.php in Zeile 1.910. Oder ihr ladet neue Smiley-Grafiken mit veränderten Namen in den Smiley-Ordner und passt die Namen in der wp-includes/functions.php ab Zeile 2.655 an. Nach jedem Update von WordPress dürften diese Änderungen aber wiederholt werden müssen – und außerdem ist es nie empfehlenswert, direkt in den Core-Ordnern und -Dateien herumzuwerkeln.

Es geht aber auch einfacher: Ihr könnt den Pfad zu den Smileys bequem über ein Plugin oder in eurer functions.php ändern – damit bleibt die Änderung auch bei einem Update von WordPress bestehen. Wenn ihr die Änderung in der funtions.php vornehmt, müsst ihr sie nach einem Wechsel des Themes – oder schon nach einem Update, falls ihr das Theme nicht selbst erstellt oder die Änderung nicht in einem Child-Theme vorgenommen habt – wieder neu vornehmen. Die Änderung hier durchzuführen, kann also sinnvoll sein, wenn die Smileys auf das Theme abgestimmt sind. Wenn ihr aber Smileys einsetzt, die als generelle Alternative unabhängig vom Theme gedacht sind, dann ist ein Plugin die bessere Lösung. Hier zeigen wir euch beide Wege, angefangen mit der functions.php (wie angedeutet am besten in einem Child-Theme, wenn es nicht euer Theme ist).

add_filter('smilies_src','my_custom_smilies_src', 1, 10);
function my_custom_smilies_src($img_src, $img, $siteurl){
return $siteurl.'/wp-content/images/smilies/'.$img;
}

Wie ihr seht, ist die Änderung sehr schnell vorgenommen. Diesen Code könnt ihr einfach an das Ende eurer functions.php kopieren. Hierdurch werden die Smileys jetzt nicht mehr aus dem Pfad wp-includes/images/smilies bezogen, sondern aus dem Ordner wp-content/images/smilies. Den könnt ihr natürlich anpassen, wenn ihr wollt. Nun müsst ihr nur noch die neuen Smileys in den neuen Ordner kopieren und hochladen – hier müsst ihr darauf achten, dass die Dateinamen mit denen der alten Smileys übereinstimmen. Wenn ihr jetzt auch andere Dateinamen verwenden wollt, könnt ihr den folgenden Code nutzen:

global $wpsmiliestrans;
$wpsmiliestrans = array (
':mrgreen:' => 'icon_mrgreen.gif',
':neutral:' => 'icon_neutral.gif',
':twisted:' => 'icon_twisted.gif',
':arrow:' => 'icon_arrow.gif',
':shock:' => 'icon_eek.gif',
':smile:' => 'icon_smile.gif',
':???:' => 'icon_confused.gif',
':cool:' => 'icon_cool.gif',
':evil:' => 'icon_evil.gif',
':grin:' => 'icon_biggrin.gif',
':idea:' => 'icon_idea.gif',
':oops:' => 'icon_redface.gif',
':razz:' => 'icon_razz.gif',
':roll:' => 'icon_rolleyes.gif',
':wink:' => 'icon_wink.gif',
':cry:' => 'icon_cry.gif',
':eek:' => 'icon_surprised.gif',
':lol:' => 'icon_lol.gif',
':mad:' => 'icon_mad.gif',
':sad:' => 'icon_sad.gif',
'8-)' => 'icon_cool.gif',
'8-O' => 'icon_eek.gif',
':-(' => 'icon_sad.gif',
':-)' => 'icon_smile.gif',
':-?' => 'icon_confused.gif',
':-D' => 'icon_biggrin.gif',
':-P' => 'icon_razz.gif',
':-o' => 'icon_surprised.gif',
':-x' => 'icon_mad.gif',
':-|' => 'icon_neutral.gif',
';-)' => 'icon_wink.gif',
// This one transformation breaks regular text with frequency.
// '8)' => 'icon_cool.gif',
'8O' => 'icon_eek.gif',
':(' => 'icon_sad.gif',
':)' => 'icon_smile.gif',
':?' => 'icon_confused.gif',
':D' => 'icon_biggrin.gif',
':P' => 'icon_razz.gif',
':o' => 'icon_surprised.gif',
':x' => 'icon_mad.gif',
':|' => 'icon_neutral.gif',
';)' => 'icon_wink.gif',
':!:' => 'icon_exclaim.gif',
':?:' => 'icon_question.gif',
);

Diesen fügt ihr einfach unter den Codeblock mit der Pfadänderung in eure functions.php ein und passt die Dateinamen an. Wichtig ist, dass ihr hier alle Smileys aufführt, auch wenn ihr einige Dateinamen nicht ändern wollt. Führt ihr hier nur die geänderten auf, sind für die anderen keine Bilder mehr hinterlegt.

Wie ihr seht, ist der neue Dateipfad aktiv – Jetzt fehlen nur noch neue Smileys! (Screenshot: eigene WordPress-Installation)
Wie ihr seht, ist der neue Dateipfad aktiv – jetzt fehlen nur noch neue Smileys! (Screenshot: WordPress)

Kommen wir jetzt zu der Erstellung eines kleinen Plugins, das genau die gleiche Funktion hat. Erstellt dafür einen Ordner namens change-smilies im Verzeichnis wp-content/plugins und darin eine index.php. Der Inhalt sieht so aus (gleich mit beiden Fällen, also auch Dateinamen anpassen):

<?php
/*
Plugin Name: Ändern der Smileys
Version: 1.0
Plugin URI:
Description: Smileys ändern!
*/
add_filter('smilies_src','my_custom_smilies_src', 1, 10);
function my_custom_smilies_src($img_src, $img, $siteurl){
return $siteurl.'/wp-content/images/smilies/'.$img;
}
global $wpsmiliestrans;
$wpsmiliestrans = array (
':mrgreen:' => 'icon_mrgreen.gif',
':neutral:' => 'icon_neutral.gif',
':twisted:' => 'icon_twisted.gif',
':arrow:' => 'icon_arrow.gif',
':shock:' => 'icon_eek.gif',
':smile:' => 'icon_smile.gif',
':???:' => 'icon_confused.gif',
':cool:' => 'icon_cool.gif',
':evil:' => 'icon_evil.gif',
':grin:' => 'icon_biggrin.gif',
':idea:' => 'icon_idea.gif',
':oops:' => 'icon_redface.gif',
':razz:' => 'icon_razz.gif',
':roll:' => 'icon_rolleyes.gif',
':wink:' => 'icon_wink.gif',
':cry:' => 'icon_cry.gif',
':eek:' => 'icon_surprised.gif',
':lol:' => 'icon_lol.gif',
':mad:' => 'icon_mad.gif',
':sad:' => 'icon_sad.gif',
'8-)' => 'icon_cool.gif',
'8-O' => 'icon_eek.gif',
':-(' => 'icon_sad.gif',
':-)' => 'icon_smile.gif',
':-?' => 'icon_confused.gif',
':-D' => 'icon_biggrin.gif',
':-P' => 'icon_razz.gif',
':-o' => 'icon_surprised.gif',
':-x' => 'icon_mad.gif',
':-|' => 'icon_neutral.gif',
';-)' => 'icon_wink.gif',
// This one transformation breaks regular text with frequency.
// '8)' => 'icon_cool.gif',
'8O' => 'icon_eek.gif',
':(' => 'icon_sad.gif',
':)' => 'icon_smile_2.gif',
':?' => 'icon_confused.gif',
':D' => 'icon_biggrin.gif',
':P' => 'icon_razz.gif',
':o' => 'icon_surprised.gif',
':x' => 'icon_mad.gif',
':|' => 'icon_neutral.gif',
';)' => 'icon_wink.gif',
':!:' => 'icon_exclaim.gif',
':?:' => 'icon_question.gif',
);
?>

Das wär's auch schon. Jetzt könnt ihr den Plugin-Ordner hochladen und das Plugin aktivieren. Bei der Größe der neuen Smileys müsst ihr ein bisschen experimentieren, damit sie euch nicht die Zeilen eurer Website zerschießen. Die Standard-Smileys haben eine Größe von 15 x 15 Pixeln. Mehr zum Thema WordPress-Smileys findet ihr auf der Seite im WordPress-Codex.

Und was ist mit Smileys?

Das frage ich euch! Kennt ihr gute Smiley-Sammlungen (keine Übersichtsseiten, sondern wirklich einzelne Sammlungen), die man sich unbedingt anschauen sollte? Dann schreibt sie doch in die Kommentare! Eine Sammlung, die auf WordPress.com genutzt werden kann, gibt es auf GitHub.

Vorheriger Artikel Zurück zur Startseite Nächster Artikel
3 Antworten
  1. von Dirk E am 27.04.2014 (14:48 Uhr)

    Danke für den Tip :-)

    Antworten Teilen
  2. von KevinKunkel am 06.05.2014 (14:53 Uhr)

    Kann man machen :) ich hab einfach die Gifs in den WP Includes ersetzt

    Antworten Teilen
  3. von fantasylife am 24.06.2014 (13:57 Uhr)

    Ich verwende auf meinem Blog u.a. die Smilies von http://www.greensmilies.com/ - die bieten ein komplettes pak-Paket zum kostenlosen Download an. Lediglich um einen Backlink bei Verwendung wird gebeten.

    Antworten Teilen
Deine Meinung

Bitte melde dich an!

Du musst angemeldet sein, um einen Kommentar schreiben zu können.

Jetzt anmelden

Mehr zum Thema WordPress
WordPress 4.5 bringt unter anderem besser Bildkomprimierung und Responsive-Design-Vorschau im Customizer
WordPress 4.5 bringt unter anderem besser Bildkomprimierung und Responsive-Design-Vorschau im Customizer

WordPress 4.5 ist veröffentlicht worden, das nach dem Jazz-Musiker Coleman Hawkins benannt ist. Die neue Version bringt unter anderem die Möglichkeit einer Responsive-Design-Vorschau in den … » weiterlesen

30 kostenlose WordPress-Themes für Responsive Design
30 kostenlose WordPress-Themes für Responsive Design

Das Angebot an kostenlosen Templates für die eigene Website wächst stetig. Auch die Auswahl an Wordpress-Themes, die Responsive Webdesign unterstützen, ist inzwischen beachtlich. » weiterlesen

Diese 30 kostenlosen WordPress-Themes für Responsive Design musst du kennen
Diese 30 kostenlosen WordPress-Themes für Responsive Design musst du kennen

Responsive Webdesign wird quasi zum Standard im Web. Wenn du WordPress nutzt, solltest du dir daher die folgenden 30 Themes nicht entgehen lassen. Alle haben ein Responsive Design und sind kostenlos. » weiterlesen

Alle Hefte Jetzt abonnieren – für nur 35 €

Kennst Du schon unser t3n Magazin?