HowTo: Ausklappbare Smilie Box einbauen
Im letzten Beitrag wurde die Frage gestellt, wie ich denn diese Smilie-Box eingebaut hätte. Gleich vorweg – diese Funktion ist nicht ganz auf meinem Mist gewachsen. Christoph war so nett und hat mich damals, bei einem vorherigen Theme, tatkräftig unterstützt. So ist auch eines der Scripte von ihm (glaube ich zumindest). Aber nun zum Thema…
Ihr benötigt zunächst das Plugin Smiley Javascript Buttons von Skippy. Das Plugin ist schon etwas älter, und damals war es noch üblich, dass man im Code rumwuseln musste, damit ein Plugin Wirkung zeigt. Editiert demnach die comments.php
eures Themes und injiziert folgenden Codeschnipsel zwischen Kommentarfeld und Submit-Button:
<?php if (function_exists('SJB_outputSmilies')) {SJB_outputSmilies();} ?>
Wenn ihr jetzt damit zufrieden seid, dass euch diese Grinsekompanie ständig entgegenzappelt, dann ist hier die Arbeit getan. Ich finde es jedoch irritierend, daher lasse ich die Meute nur bei Bedarf aufklappen. Dazu muss sie zunächst hinter einem Link versteckt werden, was dann inklusive der obligatorischen DIV-Wüste so aussieht:
<div id="smilie_box">
<div id="wp_grins" style="display: none;">
<?php if (function_exists('SJB_outputSmilies')) {SJB_outputSmilies();} ?>
</div>
<a id="smileylink" href="javascript:smilean();">Smilies gefällig?</a>
</div>
Nutzer des Thesis-Themes packen das in den Hook thesis_hook_after_comment_box
, den es erst seit der Version 1.7 gibt. Alle anderen können folgenden Teil ignorieren:
function smilie_box() { ?>
<div id="smilie_box">
<div id="wp_grins" style="display: none;">
<?php if (function_exists('SJB_outputSmilies')) {SJB_outputSmilies();} ?>
</div>
<a id="smileylink" href="javascript:smilean();">Smilies gefällig?</a>
</div>
<?php }
add_action('thesis_hook_after_comment_box','smilie_box');
Nun fehlt noch das kleine Javascript combo.js (das vom Nasendackel). Wie ihr das Script einbaut, muss ich nicht erklären, oder doch? Na, gut..
Packt das Script in euren Custom-Ordner und binde es in den Thesis Site Options unter Additional Scripts ein:
<script type="text/javascript" src="http://www.admartinator.de/wp-content/themes/thesis_18/custom/combo.js"></script>
Benutzer anderer Themes packen das Script hin wo sie möchten und zimmern den Aufruf des Scripts an eine geeignte Stelle im Header oder Footer.
Hübsch machen
Zu guter Letzt fehlt nur noch eine Prise CSS, welche bei mir so aussieht:
#smilie_box {
text-transform: uppercase;
letter-spacing: 1px;
padding-right: 15px;
float: right;
text-align: right;
}
Das war’s. Meine ich zumindest. Wer es ausprobiert und eingebaut hat, gibt bitte mal kurz Feedback, ob die Anleitung so ok ist. Danke.
Nettes Ding, aber wer braucht schon Smilys? Grinse-Grinse-Winke-Winke-Zunge_raus hehe… Ist so ein bisschen wie die alten nervigen bewegten Gifs, die ne Zeitlang das Netz unsicher gemacht haben…
die sorgen immer noch regelmäßig für augenkrebs beim durchsehen von flickr-kommentaren
Stimmt, das hatte ich grad erfolgreich verdrängt, weil sie bei mir nicht so häufig vorkommen…
Kann sein, dass die keiner braucht. Dafür sind sie aber äußerst beliebt und irgendwie mag ich sie – zumindest die, die ich hier verwende. Für die Standard-Smilies von WP hätte ich den Zirkus hier jedenfalls nicht veranstaltet.
sehe ich absolut genauso (:
Oh…combo.js … was für zeiten. Hab ich beit mir aber auch noch aktiv
Pingback: Kullerchen.de » Das Kullerchen grinst!
Guter Versuch einer Anleitung.
Sorry, nur mir nicht konkret genug.
Bspw.: Bei mir heißt das Teil: “thesis_hook_after_comment” ohne “_box” und darin gibt es zig Felder den Code einzufügen. Welches genau?
Und das combo.js einbauen – hm, google sagt dazu nix – dein Quelltext ist extrem lang – eine konkrete Angabe hierzu – wie – bitte
Und letzte Frage – woher kommen dann die eigentlichen Smilies – also die .gif-Dateien.
Wenn alle diese Antworten vorhanden sind – dann ist es konkret.
Hook
Damit war nicht gemeint, dass du die mit dem Open Hook Plugin einbindest, sondern wie ein echter Mann (Mensch, du bist doch Rocker!) händisch in die custom_functions.php klöppelst. Kriegste hin, oder bekommst du dann Schwitzefinger?
combo.js
Siehe oben (ergänzt).
Smilies
Die gibt’s hier. Das stand allerdings auch in dem oben verlinkten Vorgängerartikel, aber da haste wohl nicht richtig gelesen…
Vor der Verwendung der Smilies bei Ina melden (und schönen Gruß von mir bestellen)!
Jetzt willst du bestimmt auch noch wissen, wie man die einbindet, hä?
Wie ich die Smilies einbinde?
Traue mich kaum noch zu fragen – Ja bitte.
Aktuell bin ich dank deiner Hilfe schon einen riesen Schritt weiter – Menü klappt auf und zu – nur steht da eine Fehlermeldung drin.
Falls du mal kucken möchtest.
Ansonsten stehe ich kurz vorm Ziel.
Nochmals Danke.
Du hast die Smilies nicht aktiviert.
Einstellungen › Schreiben
Wandle Emoticons … in Grafiken um.
Danke.
)
Es soll Leute geben, die verlangen für solches KnowHow richtig Kohle.
Man man man – mein Schulden-Konto bei dir steigt und steigt und steigt.
So jetzt hast du es öffentlich – schriftlich.
Nun bleibt mir nur noch die Grafiken unter /wp-includes/smilies auszutauschen – Richtig? – und das wars dann.
Jetzt kann ich mir langsam den Schweiß abwischen.
Ja, richtig. Einfach austauschen. Es sei denn, du willst noch welche ergänzen oder entfernen.
In der /wp-includes/vars.php stehen die drin. Den Abschnitt kopiert man sich besser aber in die wp_config.php, damit sie bei einem Update nicht überschrieben werden.
Bei mir stehen die Einträge zu den Smilies aber in der
/wp-includes/functions.php und nicht in der /wp-includes/vars.php.
Darin ist nichts von Smilies zu finden.
Danke für den Tipp mit der wp_config.php
Ok. Kann sein. Früher waren sie in der vars.php. Ich hab die schon ewig in der wp_config.php.
Hast du eventuell eine Idee, wie die Smilies sortiert werden?
Bei dir haben sie eine andere Reihenfolge als bei mir.
Nur die Reihenfolge wie sie in der .php angegeben sind – ist eine andere als im Kommentarfeld angezeigt wird.
Nach irgendwas müssen sich die sortieren?
Gute Frage – keine Ahnung!
Pingback: Plugin Parade 2011 | admartinator.de