Доброго времени суток! Сегодня вкратце опишу, как быстро установить смайлики на WordPress с плагином и без.Если у Вас WordPress новой версии, выше 4.2, тогда начинайте читать статью с третьего пункта.
Блог с серьезной тематикой – это не социальная сеть, где можно подставлять к комментариям разные мордочки с языками и улыбками, но и без них скучно.
Вот только вчера я установил на своем блоге смайлики, как тут же люди стали их добавлять в комментарии. Да и устанавливать смайлы достаточно просто. Можно установить их на WordPress, как с плагином, так и без него. Сегодня я опишу два способа.
1. Установка смайликов на WordPress (плагин Qip smiles)
Плагинов для установки смайликов на блог великое множество, но я решил описать плагин Qip smiles, который нравится большинству людей, да и мне в принципе тоже. Эти смайлики от известного мессенджера Qip. Кто общался в «Аське» — тот знает мессенджер Qip.
По-моему, разницы нет, устанавливать на блог смайлики с помощью плагина или без него. В первом и во втором способе, нужно устанавливать код в файл шаблона. Итак, устанавливаем смайлики с помощью плагина Qip smiles. Для начала нужно скачать сам плагин и установить его. Как устанавливать плагины, я объяснял в уроке 10.
После установки плагина, нужно добавить код ниже в файл comments.php Вашего шаблона, перед строкой <p><textarea name=«comment»…
А вот и сам код.
1 |
<?php if (function_exists('qipsmiles')) qipsmiles('ru'); ?> |
Код Вы можете установить и в другое место, но лучше устанавливать смайлики перед формой комментариев.
Вот и все, смайлики теперь должны быть установлены перед формой комментариев.
В моем шаблоне смайлики почему-то расплылись, т. е. находятся далеко друг от друга, но возможно у Вас они будут более сжато. Переходим ко второму способу установки смайликов.
2. Установка смайликов на старую версию WordPress без плагина
Здесь все тоже самое, только без плагина, да и сам код имеет другой вид. Для начала нам нужно заменить стандартные смайлики WordPress на смайлы Qip. Скачайте архив смайликов, распакуйте его и закачайте в папку Вашего блога …/wp-includes/images/smilies/. Закачивать нужно содержимое папки, а не саму папку, т. е. смайлики.
Самую тяжелую работу Вы сделали. Теперь нужно добавить код в файл comments.php Вашей темы. Скопируйте код ниже и вставьте его в файл comments.php, перед строкой <p><textarea name=«comment» id=«comment»…
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 |
<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 src="'.get_bloginfo('wpurl').'/wp-includes/images/smilies/'.$dm_smile.'" alt="'.$tag.'" onclick="addsmile(\''.$tag.'\');"/> '; } } echo '<div style="width:95%; margin-left:0px; margin-right:0px;">'.$dm_showsmiles.'</div>'; ?> |
Но эти смайлики не работают с новой версией WordPress, начиная от 4.2. Пришлось дописывать эту статью. Далее, я расскажу, как установить смайлики на новую версию WordPress, начиная с 4.2
3. Смайлики для новых версий WordPress, начиная с 4.2
В новых версиях WordPress, начиная с 4.2, была внедрена новая библиотека Twemoji, которая содержит набор символов, в формате Unicode… Не буду объяснять, что да как, но смайлы в новых версиях WordPress перестали работать.
Для того чтобы установить смайлики без плагина на новую версию WP, нужно внедрить в файл comments.php модифицированный код ниже. Код можно установить перед строкой <p><textarea name="comment" id="comment" cols="100%" rows="10" tabindex="4"></textarea></p>
или после. У Вас эта строка может выглядеть немного иначе.
1 |
<!-- Smiles --><script>// < ![CDATA[ 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 .= ' '; } } echo ' |
‘; ?>
Теперь в папке Вашей темы создайте папку smilies, и загрузите туда все новые смайлики. Ссылку для скачивания сайлов, Вы найдете выше. Но это еще не все. Теперь в файл functions.php, который также находится в папке с темой, вставьте код ниже.
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 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 |
// Задаем новое расположение изображений по-умолчанию function classic_smilies_src( $old, $img ) { $mythemes = get_template(); return site_url( "/wp-content/themes/$mythemes/smilies/{$img}", __FILE__ ); } // Возвращаем сопоставление символов файлам add_action( 'init', 'classic_smilies_init', 1 ); function classic_smilies_init() { 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', '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', ); add_filter( 'smilies_src', 'classic_smilies_src', 10, 2 ); // Отключаем загрузку скриптов и стилей Emoji remove_action( 'wp_head', 'print_emoji_detection_script', 7 ); remove_action( 'admin_print_scripts', 'print_emoji_detection_script' ); remove_action( 'wp_print_styles', 'print_emoji_styles' ); remove_action( 'admin_print_styles', 'print_emoji_styles' ); remove_filter( 'the_content_feed', 'wp_staticize_emoji' ); remove_filter( 'comment_text_rss', 'wp_staticize_emoji' ); remove_filter( 'wp_mail', 'wp_staticize_emoji_for_email' ); add_filter( 'tiny_mce_plugins', 'classic_smilies_rm_tinymce_emoji' ); add_filter( 'the_content', 'classic_smilies_rm_additional_styles', 11 ); add_filter( 'the_excerpt', 'classic_smilies_rm_additional_styles', 11 ); add_filter( 'comment_text', 'classic_smilies_rm_additional_styles', 21 ); } // Отключаем Emoji в визуальном редакторе TinyMCE function classic_smilies_rm_tinymce_emoji( $plugins ) { return array_diff( $plugins, array( 'wpemoji' ) ); } // Убираем размеры смайликов равные 1em (новые задаются для класса .wp-smiley) function classic_smilies_rm_additional_styles( $content ) { return str_replace( 'class="wp-smiley" style="height: 1em; max-height: 1em;"', 'class="wp-smiley"', $content ); } |
Теперь все смайлики должны отображаться хорошо, как и в старой версии WP.
Людмила, спасибо! Последняя строка действительно лишняя.
Спасибо за полезную статью. Поставила смайлы без плагина, но удалила последнюю строчку из вашего кода, а иначе получается дубль.
❗ пошёл ставить себе. Спасибки!!!