Nun, dies ist mit einem kleinen Eingriff in die functions.php möglich. Dort muss man „lediglich“ etwas Code einschleusen. Aber eins nach dem andern.
Vorbereitung
Zunächst sollte man sich ein passendes Smilie-Set suchen, in dem alle Smilies vorhanden sind, die WordPress unterstützt. Welche das sind, na werft doch einfach mal einen Blick in das Verzeichnis /wp-includes/images/smilies eures Blogs.
Sind nun alle Smilies beisammen, so erweitert man das eigene Theme um das Verzeichnis images/smilies/ und kopiert die Smilies genau dort hinein.
Das war es schon mit den Vorbereitungen, nun geht es an die Eingeweide des Themes.
Funktion hinzufügen
Hier wird nun die functions.php des Themes bearbeitet. In diese Datei werden einige Funktionen eingefügt, welche unter anderem die eigenen Smilies definieren und ausgeben. Wahlweise im Artikel und/oder in den Kommentaren. Natürlich sollte man auch dafür Sorge tragen, dass die wordpresseigene Funktion deaktiviert wird.
Als erstes wird eine Funktion benötigt, welcher die URI zu den Smilies zurückgibt. Dies ist wichtig, damit die Dinger auch angezeigt werden können.
1 2 3 4 5 | if(!function_exists('get_my_smilies_uri')) { function get_my_smilies_uri() { return get_template_directory_uri() . '/images/smilies/'; } } |
In dieser Funktion wird der Pfad zu den Smilies angegeben. Der Aufruf von get_template_directory_uri() ersetzt dabei den Pfad zum aktuell verwendeten Theme, so dass dieser nicht von Hand eingetragen werden muss. Dahinter setzt ihr dann einfach das Verzeichnis der Smilies in eurem Theme. Wichtig dabei, achtet am Anfang und Ende auf den Slash ( / ).
Im nächsten Schritt werden die Smilies definiert. Hier kann jeder festlegen, welches Smilie durch welches Icon ersetzt werden soll.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 | if(!function_exists('my_smilies')) { function my_smilies() { $array_Smilies = array( ':)' => 'icon_smile.gif', ':-)' => 'icon_smile.gif', ':smile:' => 'icon_smile.gif', ':D' => 'icon_biggrin.gif', ':-D' => 'icon_biggrin.gif', ':grin:' => 'icon_biggrin.gif', ':(' => 'icon_sad.gif', ':-(' => 'icon_sad.gif', ':sad:' => 'icon_sad.gif', '8)' => 'icon_cool.gif', '8-)' => 'icon_cool.gif', ':cool:' => 'icon_cool.gif', ':x' => 'icon_mad.gif', ':-x' => 'icon_mad.gif', ':mad:' => 'icon_mad.gif', ':P' => 'icon_razz.gif', ':-P' => 'icon_razz.gif', ':razz:' => 'icon_razz.gif', ':|' => 'icon_neutral.gif', ':-|' => 'icon_neutral.gif', ':neutral:' => 'icon_neutral.gif', ';)' => 'icon_wink.gif', ';-)' => 'icon_wink.gif', ':wink:' => 'icon_wink.gif', ':lol:' => 'icon_lol.gif', ':oops:' => 'icon_redface.gif', ':cry:' => 'icon_cry.gif', ':evil:' => 'icon_evil.gif', ':twisted:' => 'icon_twisted.gif', ':roll:' => 'icon_rolleyes.gif', ':!:' => 'icon_exclaim.gif', ':idea:' => 'icon_idea.gif', ':arrow:' => 'icon_arrow.gif', ':?:' => 'icon_question.gif', ':o' => 'icon_surprised.gif', ':-o' => 'icon_surprised.gif', ':eek:' => 'icon_surprised.gif', ':???:' => 'icon_confused.gif', ':-?' => 'icon_confused.gif', ':?' => 'icon_confused.gif', '8O' => 'icon_eek.gif', '8-O' => 'icon_eek.gif', ':shock:' => 'icon_eek.gif', ':mrgreen:' => 'icon_mrgreen.gif' ); return $array_Smilies; } } |
Damit wäre schon ein Großteil geschafft. Die Smilies sind definiert, und somit geht es nun an daran, diese aus dem Text auch heraus zu filtern und durch die Icons zu ersetzen. Dafür habe ich zwei Funktionen vorgesehen. Eine für den Artikel selbst und eine für die Kommentare. So ergibt sich die Möglichkeit zu steuern, wo die Smilies angezeigt werden sollen und so nicht.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 | if(!function_exists('my_smilies_content')) { function my_smilies_content($var_sContent) { $array_Smilies = my_smilies(); foreach($array_Smilies as $key => $value) { $var_sContent = str_replace($key, '<img src="' . get_my_smilies_uri() . $value . '" />', $var_sContent); } return $var_sContent; } } if(!function_exists('my_smilies_comments')) { function my_smilies_comments($var_sComment) { $array_Smilies = my_smilies(); foreach($array_Smilies as $key => $value) { $var_sComment = str_replace($key, '<img src="' . get_my_smilies_uri() . $value . '" />', $var_sComment); } return $var_sComment; } } |
Nun muss man natürlich auch WordPress selbst noch davon überzeugen, die neuen Smilies zu verwenden und nicht irgendwas anderes. Um dies zu erreichen werden Filter zu WordPress hinzugefügt. Hier erschließt sich dann auch der Grund, warum ich die Ausgabe von Artikel und Kommentar getrennt habe, denn es sind zwei Filter, siehe Zeile fünf und sechs. In dieser Funktion wird auch gleich dafür gesorgt, das die WordPress-Smilies nicht verwendet werden, siehe Zeile drei.
1 2 3 4 5 6 7 8 | if(!function_exists('my_smilies_filters')) { function my_smilies_filters() { update_option('use_smilies', 0); // WordPress-Smilies abschalten add_filter('the_content', 'my_smilies_content'); // Smilies im Artikel add_filter('comment_text', 'my_smilies_comments'); // Smilies in den Kommentaren } } |
Bisher passiert noch gar nichts, denn die Funktion mit den Filtern muss noch aufgerufen werden.
1 2 3 | if(function_exists('my_smilies_filters')) { my_smilies_filters(); } |
Mit diesem Funktionsaufruf werden die Filter scharf geschallten und zu WordPress hinzugefügt.
Abgesang
Ich muss dazu sagen, ich bin kein Freund von grafischen Smilies. Dies liegt wohl daran, dass ich bisher einfach noch kein wirklich schönes Smilie-Set gesehen habe. Die meisten waren mir einfach zu grell und zu bunt und viel zu blinkend. Also empfand ich die dann eher als störend beim Lesen.
Ich habe meine Meinung etwas revidiert, denn Ralf hat auf einen Blog ein eigenes Smilie-Set veröffentlicht und zum freien Download bereitgestellt. Diese sind sehr dezent, nicht bunt, nicht blinkend, einfach schön und ich verwende es auch hier in meinem Blog :-)
Also, viel Spaß damit !!
Das funktioniert so leider bei mir nicht, es kommt folgende Fehlermeldung auf meiner Startseite:
Fatal error: Call to undefined function ppfeufer_get_smilies_array() in /var/www/user/lehrling/html/wp-content/themes/mein-theme/functions.php on line 114
Bitte um Hilfe. – Danke im voraus!
ARGS, sorry, natürlich muss der Aufruf etwas anders heissen. Ich hab da vergessen den noch anzupassen, und so stand noch meine eigne Funktion da drin. Ist nun berichtigt.
Danke für den Hinweis.
Vielen Dank für Ihre Korrektur!
Die Smilies funktionieren soweit gut, jedoch habe ich noch ein Problem. Ich benutze Bookmarks und eins davon gibt die Möglichkeit eine Empfehlung per E-Mail zu versenden. Jetzt beist sich der Filter aber damit, da im Code „
mailto:?subject=“ angegeben ist. Dadurch wird das Bookmark zerstört, da ein Smilie mit :? darauf gelegt ist.Kann man das beheben ohne den Smilie ändern zu müssen? – Weil vorher ging der Bookmark auch so…
Würde mich sehr über ein letztes mal Hilfe von Ihnen sehr freuen! :)
Hallo,
ich habe mir auch gerade den Code installiert und stehe vor dem gleichen Problem wegen diesen einen Smilies… hoffe es gibt eine Lösung. – Nutze „Sociable 3.0“ für die Bookmarks.
Freue mich auch über Support.
Also ihr beiden, lest euch doch bitte noch mal den Artikel genau durch, besonders folgenden Absatz:
Hier sollten eure Fragen beantwortet werden :-)
Was jedoch den mailto-Befehl angeht, ich bin mir zwar nicht sicher, aber das sieht schon nach ner falschen Syntax im Befehl selbst aus.
2
<a href="mailto:?subject=Betreffszeile">mail me</a> <!-- Falsch -->
So weit ich weiß, muss die E-Mailadresse VOR dem Betreff stehen, was dann auch dieses Problem wieder lösen würde.
Ich habe den gesamten Text schon sehr ausführlich gelesen und mir ist auch klar das ich die Symbolzusammenstellung zum anzeigen eines Smilies selber ändern kann, jedoch würde ich gerne die Standard-Smilies so lassen. Ich brauche den Code haupsächlich dazu damit die Smilie-Images im Template-Ordner sind und ich ein par hinzufügen kann.
Mit dem Bookmark ist nicht ganz richtig, der Code ist schon korrekt, denn da es ein Bookmark ist befindet sich zu Beginn nur der Betreff und die Nachricht mit dem Link darin. Die E-Mail Adresse gibt der User erst danach ein, von daher sollte dieser Platz leer sein… außer es gibt eine Art „Platzhalterbefehl“ dafür?
Ok, weiter geht das Gedankenspiel :-)
functions.php erweitern und dafür sorgen, dass die Smilies vor den Plugins geladen werden. Also eine Funktion erstellen, welche die bereits bestehende the_content(); ersetzt und dort die Smilies schon laden lassen. Diese Funktion wird dann an Stelle von the_content(); im Template aufgerufen.
Eins solche Funktion habe ich hier bereits schon mal vorgestellt, diese kann leicht dementsprechend angepasst werden.
Danke!
Es hat zwar etwas gedauert, aber wie man so schön sagt: „Gedult ist die Tugend!“.
Alles läuft jetzt einwandfrei, ich bedanke mich hiermit noch einmal für das Code-Tutorial. Habe auch gleich noch die Erweiterung der Kontaktinformationen mitgenommen.
Ich muss wirklich sagen, ein klasse Blog hier! :)
Werde ich auf jeden Fall verlinken wenn ich meine Seite public mache… ;)
Freut mich, wenns Dir geholfen hat, so war es ja auch mal gedacht :-)
Hallo Peter,
super Beschreibung, musste ich natürlich (mal wieder) umsetzen. Vielleicht bin ich ja ein bisschen pingelig, aber nachdem ich alles befolgt hatte, wurden leider ein paar valide Fehler ausgeworfen. Ich habe einfach Deinen 3. Code für die Einbindung in den Beiträgen und Kommentaren noch um alt=““, also z. B. alt=“smilie“ nach dem img-Element und vor dem End-Slash ergänzt.
Anschließend war die Seite wieder valide.
Gruß Sylvi
Hi Silvy,
Richtig, ich hatte den alt=““ bewusst weggelassen. Einerseits aus dem Grunde, da ich es getestet hatte und dort wirklich die Smilies reingeschrieben habe, was zu massiven Fehlern führte, da diese auch „übersetzt“ werden. Andererseits, weil dieses Attribut für Screenreader eigentlich nur interessant ist. Dieser muss aber nicht unbedingt die Smilies vorlesen. Aus diesem Grunde ist das auch kein Fehler, sondern lediglich eine Warnung des Validators. Ich persönlich bin der Meinung, dass dieses Attribut nicht unbedingt immer bei allen Bildern gesetzt werden muss, gerade bei Smilies nicht. Aber das ist eine persönliche Meinung und es steht natürlich jedem frei.
Ich bastel immer noch an einer Methode, dort die Smilies als ausgeschriebenen Text hinein zu bekommen, so dass man, wenn man mit der Maus drauf stehen bleibt auch angezeigt bekommt, was es eigentlich sein soll. Dann macht der auch wieder mehr Sinn, als wenn nun überall „Smilie“ drin steht.
Hallo Peter,
ja da stimme ich Dir zu, dass für Screenreader das Vorlesen des Einheits-Smilies wenig Sinn macht.
Aber wenn Du das noch hinbekommst, dass jeder individuell ausgelesen wird, das wär ja klasse.
Ich wollte nur auf meinem Blog vermeiden, dass sich so nach und nach immer mehr valide Fehler „einschleichen“. Ist eben derzeit in kleiner Tick von mir ;)
Gruß Sylvi
Hallo,
Gibt es eigentlich eine Möglichkeit, dafür zu sorgen, dass innerhalb von
und
die Zeichenfolgen nicht als Smilies ersetzt werden? Das hat mich das ein oder andere Mal schon geärgert…
Danke schon mal für eventuelle Vorschläge.
Gruß,
Clemens
Hi Clemens,
Entschuldige, dass ich etwas verspätet antworte.
Ja, diese Möglichkeit wird es sicherlich geben. Zum einen kann man die betroffenen Smilies einfach aus dem Array heraus nehmen, sofern es nicht unbedingt die Bekanntesten betrifft. Zum andern bietet WordPress auch einige Filter an, mit denen sich das bestimmt irgendwie bewerkstelligen lässt.
Wenn ich mal wieder ganz viel Zeit habe, schau ich mir die mal etwas genauer an und dann denke ich mal, dass ich da etwas in den Funktionen erweitert bekomme, was solche Blöcke außen vor lässt.
In diesem Sinne :-)
Hallo Peter,
Das habe ich schon gemacht, zum Teil betrifft es aber genau die bekannten… :-(
Ich habe schon vermutet, dass über die Filter viell. irgendwas gehen könnte. Wenn ich mich mit WP ein bisschen besser auskennte, hätte ich schon selbst was versucht, aber da reicht mein Wissen bei Weitem noch nicht…
Vielen Dank für (zukünftige) Mühen :-) ,
Clemens
Holla Clemens,
Ich glaube ich hab die Lösung für Dein Problem. Wenn ich das richtig gesehen, nutzt Du den code-Tag zu Darstellung von LaTeX-Code. Und in diesem doch recht abtrakten Code kann dann durchaus das eine oder andere Smilie dabei sei, stimmt.
Mir ist aufgefallen, dass in dem PHP-Code im Beitrag oben die Smilies auch in Klartext stehen, also nicht umgewandelt werden, also habe ich mich mal etwas auf die Suche nach der Ursache begeben und diese gefunden. Das Plugin, welches ich hier zum Highlight der Syntax nutze filtert das hier. Dieses Plugin hängt sich an den code-Tag ran und verarbeitet den selbst, so dass WordPress damit nichts mehr zu tun bekommt. Dadurch werden natürlich auch die Smilies nicht „umgewandelt“ innerhalb des Codes.
Zur kleinen Demonstration habe ich mir erlaubt mal etwas von dem LaTeX-Code aus Deinem Blog herzunehmen in dem ich bei kurzen tests Smilies gefunden habe -> 0: bond(r) atom(„0“);.
2
3
4
5
6
7
8
9
10
11
12
formula(L,R){
ring("chair",,,L){
0: bond(r) atom("0");
1: bond(r) atom("1");
2: bond(r) atom("2");
3: bond(r) atom("3");
4: bond(r) atom("4");
5: bond(r) atom("5");
}
}
\end{chemistry}
Das Plugin nennt sich übrigens CodeColorer und die Syntax findest Du, wenn Du hier über dem Kommentarfeld mal auf einen der Button klickst, die für Code stehen. :-)
Unterstützt wird von dem Plugin das Highlighting von über 170 Sprachen, auch LaTeX, wie Du siehst.
Hallo Peter,
vielen Dank, das ist genau das Passende. :-) Auf die Idee hätte ich ja irgendwie selbst kommen können …
Danke nochmal,
Clemens
Hallo Clemens,
Du wirst lachen, den Gedanken hatte ich gestern kurz vorm Einschlafen. War da nur zu faul noch mal aufzustehen und das zu testen. Bei meinem heutigen Tests ist mir übrigens noch was aufgefallen. Es scheint so, als würde die nächste größere WordPress-Version diese Filter schon per default inne haben. Ich hab auf meinem Testsystem WordPress 3.2-bleeding installiert und da ging es auch ohne Plugin. Also scheint dies dort schon berücksichtig zu werden.
Hallo,
sehr schönes Tutorial da, hab es bei mir gleich in die functions.php eingebaut und funktioniert super :) Nur eine Frage, selbst wenn es ein wenig vom Thema abweicht, kann man diesen Smilie Pool auch unter dem Kommentar Feld anzeigen lassen, sodass man gleich die Smilies auswählen kann, oder zumindest den Shortcut davon sieht?
Eventuell, wenn man mit der Maus drüberfährt man den Code sieht oder mit dem draufklicken in das Feld eingefügt wird… :D
MfG
Natürlich ist dies prinzipiell möglich, wenn auch etwas aufwendiger als diese Funktion hier, aber nicht sehr viel aufwendiger. Vielleicht werde ich das mal in einem Artikel beschreiben, mal sehn wie mir ist :-)
Danke für deine Antwort. Ich kenne nur ein ähnliches Plugin von alexking.org (WP Grins) was dies möglich macht, nur weiss ich nicht, wie ich es umschreiben muss, damit es unter der Commentform angezeigt wird und auch diese Smilies benutzt werden, die hier im Tut beschrieben sind, da ich mich nicht wirklich mit php auskenne und auch nicht befasse :S
MfG
Ach, habe noch ne Frage (sry) Kennst du ein Plugin, oder weisst du wie man es irgendwie hinbekommt, dass diese Smilies wirklich nur in Artikeln oder wahlweise auf bestimmten Seiten durch die jeweiligen Shortcuts ersetzt werden? also, sonst wirkt es z.b im Impressum störend, da ich dort so einen Fall habe :S
MfG
Ja, solche Seiten kann man durch Conditional Tags erkennen.
CMS-Seiten: is_page()
Artikel: is_single()
Also, wenn man die Smilies zum Beispiel nicht auf CMS-Seiten haben will muss die Funktion my_smilies_filters() folgendermaßen aussehen:
2
3
4
5
6
7
8
9
10
function my_smilies_filters() {
if(is_single()) {
update_option('use_smilies', 0); // WordPress-Smilies abschalten
add_filter('the_content', 'my_smilies_content'); // Smilies im Artikel
add_filter('comment_text', 'my_smilies_comments'); // Smilies in den Kommentaren
}
}
}
Damit werden die Smilies nur eingebunden, wenn es ein Einzelartikel ist.
Funktioniert tadellos, Danke vielmals :)
[…] springen aber nicht so knallhart ins Auge. Die Anleitung ein eigenes Smilie-Set einzubauen bzw. die WordPress-Smilies zu ersetzen habe ich bei H.-Peter Pfeufer gefunden und damit die dezenten Smilies […]
Hallo,
leider funktioniert es bei mir nicht.
Jedes Mal wird mir angezeigt, dass es ein Problem in folgender Zeile gibt:
Was ich gemacht habe?
Deine Funktionen 1:1 kopiert, die Smilies im Theme in den Ordner images/smilies kopiert alles in die functions.php eingefügt.
Eigentlich so, wie es dasteht.
Ich nutze WordPress 3.5.1 in der deutschen Version.
Wenn es mit einem anderen Plugin in konflikt steht, wie kann das sein, da ich kein anderes Plugin nutze, welches auf die Funktion der Smilies greift.
Vor der ganzen Prozedur hatte ich die automatische Umwandlung deaktiviert. Auch wenn ich jetzt diese funktion aktivierte ändert sich nichts an der Fehlermeldung.
Liegt es an der WordPress-Version?
Ich habe jetzt die Original-Smilies überschrieben würde mich aber freuen, wenn ich die updatesichere funktion anwenden könnte.
Vielen Dank.
LG Timm
Was genau wird denn angezeigt? Also die genaue Fehlermeldung.
Inzwischen habe ich das Problem lösen können bzw. habe den Fehler finden können.
Irritierend ist, dass ich alles so kopierte, wie angegeben und als php speicherte aber die Worte wie „function“ waren nicht fett.
Danach habe ich die gleiche Prozedur über Dreamwaever gemacht und prompt funktionierte alles.
Irgendwetwas ist beim kopieren falsch gelaufen.
Damit es klarer wird, habe ich einen Dateivergleich gemacht und einen Screenshot angefügt.
Dateivergleich
vielen Dank auf jeden Fall für die angebotene Hilfe.
LG Timm
Ich weiß zwar nicht, in welchem Editor Du/Ihr das ganze kopiert habt, aber dafür reicht ein ganz normaler Plain Text Editor wie Notepad++ für Windows oder kWrite unter Linux. Editoren die eigene Textformatierungen beim reinkopieren übernehmen können da schon kontraproduktiv sein. Letztlich ist PHP reiner Text ohne Formatierungen. Es gibt natürlich auch Editoren, welche die Syntax einer Programmiersprache erkennen und entsprechend hervorheben. Diese werden dann alerdings beim Speichern auch als formatloser Text abgelegt.
Hallo Peter,
Interessant ist, dass ich genau diesen Editor, Notepad++, nutze. Und bisher hatte ich keine Pobleme beim übernehmen von Code-Snippets.
Und genau deshalb war ich so überrascht, das es nicht funktionierte.
Trotzdem danke dir für Deine Info. Muss ich nächstes Mal einfach damit rechnen und genauer hinschauen. :)
LG Timm
Sehr schön, habe es testweise nachgebaut in einem frisch installierten Blog, läuft bestens. Allerdings bin ich auch kein großer Freund von Smileys, daher wird es die Funktion nicht in den Alltagseinsatz schaffen :-)
Meine Gründe weichen von deinen ab. Es ist nicht wegen „blinkend und bunt“ sondern wegen der Ladezeit. Mag trivial klingen, Kleinvieh macht ja aber auch Mist.