Добавляем к форме комментария панель форматирования комментариев (Quicktags) без плагина. Расширяем стандартную форму комментария.
Кнопки добавления тегов (Текст)
Данная техника добавляет панель с кнопками для добавления тегов.
Вставляем код в functions.php
// Панель форматирования в форме комментирования add_filter( 'comment_form_defaults', 'rich_text_comment_form' ); function rich_text_comment_form( $args ) { ob_start(); wp_editor( '', 'comment', array( 'media_buttons' => true, // show insert/upload button(s) to users with permission 'textarea_rows' => '10', // re-size text area 'dfw' => false, // replace the default full screen with DFW (WordPress 3.4+) 'tinymce' => array( 'theme_advanced_buttons1' => 'bold,italic,underline,strikethrough,bullist,numlist,code,blockquote,link,unlink,outdent,indent,|,undo,redo,fullscreen', 'theme_advanced_buttons2' => '', // 2nd row, if needed 'theme_advanced_buttons3' => '', // 3rd row, if needed 'theme_advanced_buttons4' => '' // 4th row, if needed ), 'quicktags' => array( 'buttons' => 'strong,em,link,block,del,ins,img,ul,ol,li,code,close' ) ) ); $args['comment_field'] = ob_get_clean(); return $args; }
Стили кнопок форматирования
.quicktags-toolbar input {margin-bottom: 5px;} .quicktags-toolbar input {padding: 4px 8px; margin-right: 5px;} #wp-link-wrap { position: fixed; left: 30%; top: 15%; background-color: whitesmoke; padding: 25px 50px; border: 2px solid #50aaff; z-index: 99; }
Форма комментария в виде редактора TinyMCE (Визуально)
Вставляем в functions.php
add_filter( 'comment_form_field_comment', 'comment_editor' ); function comment_editor() { global $post; ob_start(); wp_editor( '', 'comment', array( 'textarea_rows' => 15, 'teeny' => true, 'quicktags' => false, 'media_buttons' => false ) ); $editor = ob_get_contents(); ob_end_clean(); //make sure comment media is attached to parent post $editor = str_replace( 'post_id=0', 'post_id='.get_the_ID(), $editor ); return $editor; } // wp_editor doesn't work when clicking reply. Here is the fix. add_action( 'wp_enqueue_scripts', '__THEME_PREFIX__scripts' ); function __THEME_PREFIX__scripts() { wp_enqueue_script('jquery'); } add_filter( 'comment_reply_link', '__THEME_PREFIX__comment_reply_link' ); function __THEME_PREFIX__comment_reply_link($link) { return str_replace( 'onclick=', 'data-onclick=', $link ); } add_action( 'wp_head', '__THEME_PREFIX__wp_head' ); function __THEME_PREFIX__wp_head() { ?> <script type="text/javascript"> jQuery(function($){ $('.comment-reply-link').click(function(e){ e.preventDefault(); var args = $(this).data('onclick'); args = args.replace(/.*\(|\)/gi, '').replace(/\"|\s+/g, ''); args = args.split(','); tinymce.EditorManager.execCommand('mceRemoveEditor', true, 'comment'); addComment.moveForm.apply( addComment, args ); tinymce.EditorManager.execCommand('mceAddEditor', true, 'comment'); }); }); </script> <?php }
В данном решении стили не нужны. Недостатком является отсутствие кнопки добавить изображение.
Промониторил несколько плагинов:
TinyMCE Comment Field — WYSIWYG (1000) — после установки запросил установить еще один плагин — я его сразу удалил. TinyMCE Visual Editor Comment (1000) — при активации, выдал фатальную ошибку и отключился.
Панель комментирования в 2-х режимах
Настроил панель, таким образом чтобы была возможность переключения между визуальным и текстовым режимом
add_filter( 'comment_form_field_comment', 'wpse_64243_comment_editor' ); function wpse_64243_comment_editor( $field ) { if (!is_single()) return $field; //only on single post pages. global $post; $mce_buttons = array( 'bold', 'italic', 'underline', 'strikethrough', 'hr', 'bullist', 'numlist', 'underline', 'undo', 'redo', 'fullscreen' ); ob_start(); wp_editor( '', 'comment', array( 'wpautop' => 0, 'textarea_rows' => 10, 'teeny' => 1, 'quicktags' => array( 'buttons' => 'strong,em,del,img,ul,ol,li,code' ), 'media_buttons' => 0, 'tinymce' => array ( 'toolbar1' => implode($mce_buttons, ',') ) ) ); $editor = ob_get_contents(); ob_end_clean(); //убедитесь, что средства комментариев прикреплены к родительскому сообщению $editor = str_replace( 'post_id=0', 'post_id='.get_the_ID(), $editor ); return $editor; }
‘buttons’ => ‘strong,em,del,img,ul,ol,li,code’ — этой строкой настраиваем кнопки форматирования html
$mce_buttons = array( ‘bold’, ‘italic’, ‘underline’, ‘strikethrough’, ‘hr’, ‘bullist’, ‘numlist’, ‘underline’, ‘undo’, ‘redo’, ‘fullscreen’ ); — этой переменной настраиваем кнопки форматирования визуального редактора.
[site-socialshare]
Жирный курсив
DelinsКод
Второй комментарий
Пример в виде редактора TinyMCE
Текст ссылка
кенкнкнTest!
Тестовый ко
д