Додаємо смайлики у форму коментарів WordPress

За замовчуванням форма коментарів WordPress – зовсім ніяка: немає редактора коду, немає можливості вставити свій смайлик і т. д. Відсутність смайликів у формі коментарів, я вважаю великим непорозумінням. Адже при правильному їх використанні можна передати свої емоції, що зробити за допомогою тексту – неможливо.

Починаємо…

Завантажуємо набір смайликів  на свій комп’ютер. Розархівуйте папку smiles й закидуєте її на ваш сайт сюди:  wp-includes/images/.  Для додавання смайликів у форму коментарів, нам потрібно відредагувати файл  wp-includes/comments-template.php.  У цьому файлі, знайдіть такі рядки:

<?php echo $args['comment_notes_after']; ?>

Перед цим рядком вставляєте наступний код:

<script type="text/javascript">
function addsmile($smile){
document.getElementById('comment').value=document.getElementById('comment').value+' '+$smile+' ';
}
</script>
<?php
global $wpsmiliestrans;
$dm_showsmiles = '';
$dm_smiled = array();
foreach ($wpsmiliestrans as $tag => $dm_smile) {
    if (!in_array($dm_smile,$dm_smiled)) {
        $dm_smiled[] = $dm_smile;
        $tag = str_replace(' ', '', $tag);
        $dm_showsmiles .= '<img style="margin-right: -2px;cursor:pointer;" src="'.get_bloginfo('wpurl').'/wp-includes/images/smilies/'.$dm_smile.'" alt="'.$tag.'" onclick="addsmile(\''.$tag.'\');"/> ';
    }
}
echo '<div id="smile-panel">'.$dm_showsmiles.'</div>';
?>

Єдине, що вам потрібно перевірити, так це те, що id області повинні збігатися. У моєму випадку це id = comment,  але у вас може бути інше. Тому в хром, виберете потрібний елемент і клікнувши по формі коментарів правою кнопкою миші виберете опцію перевірити елемент.   Не забудьте в коді поміняти id на свій (якщо у вас не comment ).

Ну і наостанок, при необхідності вставляєте css-код у файл стилів і правите під свої потреби:

#smile-panel {
width: 670px;
margin-left: 0px;
margin-right: 0px;
height: 23px;
padding-bottom: 14px;
margin-top: -10px;
background: #EEE url(image/toolbar.gif) repeat-x;
border: solid #D6D3D3;
border-width: 1px 1px 0;
-webkit-border-bottom-right-radius: 6px;
-webkit-border-bottom-left-radius: 6px;
-moz-border-radius: 0 0 6px 6px;
border-bottom-right-radius: 6px;
border-bottom-left-radius: 6px;
}

Ось уже й смайлики у форму коментарів додані. Спасибі!