WordPressテキスト/ HTMLエディタでNicEdit使用する

Last Updated: 2023 年 07 月 17 日 6のコメント

NicEditはtextareaを交換するWYSIWYGエディタです。

NicEdit in KBoard

適用する方法も簡単です。 http://nicedit.com/に記載されているコードをページの一番下に貼り付けるだけのすべてのtextareaがNicEditに変わります。

<script src="http://js.nicedit.com/nicEdit-latest.js" type="text/javascript"></script>
<script type="text/javascript">bkLib.onDomLoaded(nicEditors.allTextAreas);</script>

上記のコードを挿入するとそのページにのみ適用されると理解しましたが、実際にはサイトのすべてのtextareaをNicEditに変更してしまいますね。 したがって、次のコードを使用すると、IDが「myNicEditor」のすべてのテキスト領域がNicEditに変わります。

<script type="text/javascript">
//<![CDATA[
bkLib.onDomLoaded(function() {
nicEditors.editors.push(
new nicEditor().panelInstance(
document.getElementById('myNicEditor')
)
);
});
//]]>
</script>

私myNicEditorをcommentに変えコメント(コメント)フィールドをNicEditとして使用しています。 (今のところ使ってよりは、より良いものがあれば変更する予定です。)

そして WordPress 掲示板プラグインKboardの場合はまだインライン画像を上げる機能がありません(今後のアップデートでは、おそらく追加される可能性もあるようです)。 この機能を実装するには、外部エディタを連動させなければが、そのうちの一つが Naver スマートエディタです。 しかし、スマートエディタは連動させることが非常に難しい方です。 NicEditは簡単の連動が可能です。
NicEdit in WordPress Kboard
NicEditを使用すると、文の途中で画像を簡単にアップロードすることができます。 図がどこに保存されるか気にしてアップロードされた画像のパスを見るとhttp://i.imgur.com/ghxjWma.jpg式になっていますね。 つまり、無料画像アップロードサイトimgur.comにアップロードなりますね。 http://imgur.com/サイトは非会員のイメージを制限なく上げることができますが、非会員の場合は、管理が不可能だとね。 したがって、NicEidtを使用して画像を上げれば、今後の管理にならない点は、留意する必要がそうです。 下のスクリーンショットのようにKBoardなどの画像を簡単に文章の途中で(つまり、インラインで)挿入が可能です。
NicEdit  -  image uploads
Ckeditorに比べて機能はあまりありませんが、図の挿入機能は、心にね。

基本Textareaを取り替えること、特別なEditorを探しているならNicEditを考慮してください。 他にも ここで、さまざまなWYSIWYGテキスト/ HTMLエディタを調べることができます。

추가

NicEdit、Ckeditorなどを使用すると、 WordPressで、基本的にspanなどのHTMLコードを遮断することがあります。 この場合、画像のアップロードや蛍光ペンなどの機能を正しくご利用できない場合があります。 このような問題が発生した場合、次の関数を使用してspanなどのコードを許可するように設定してみてください。

add_filter( 'wp_kses_allowed_html', 'my_allowed_html', 10, 2 );
function my_allowed_html( $tags, $context ){
$tags['span'] = array(
'style' => array(),
'dir' => true,
'align' => true,
'lang' => true,
'xml:lang' => true,
'class' => array(),
);
return $tags;
}

上記の関数は正常に動作していない場合には、kses.php(/ wp-includes /フォルダの下にあります)で、そのタグのコードを$ allowedtags = array下に追加します。 (事前に入力されているコードの種類と同様に追加します。)


6のコメント

コメント

  1. IEでうまく動作しますが、Google Chromeで動作しない場合は、次のスクリプトの形式を使用してみてください。

    var commentNicEditor = new nicEditor()panelInstance( 'comment');
    commentNicEditor.addEvent(「blur "、function(){
        commentNicEditor.instanceById(「comment」)。saveContent();
    });
    応答
  2. ksesファイルで次の行をコメントアウトします。

    if(current_user_can(「unfiltered_html ')== false)
    kses_init_filters();
    応答