1 月/'08

改行プラグインビジュアルリッチエディタ対応

CamCam作のWordpressプラグイン「brBrbr」が
ビジュアルリッチエディタに対応！？

……と言っても、対応方法を見つけただけですが….ι(´Д｀υ)
……プラグインだけで何とか出来ればよかったのですが…. ι(´Д｀υ)

今まで、ビジュアルリッチエディタでうまくいかなかったのも
これで「だいたい」「たぶん」「きっと」「そこそこ」解決できるかと思います。

※Wordpress各バージョンで対応が違います。
ver2.8の方はこちらへ
 ver2.7の方はこちらへ

※※※※※※※※※ 対応方法※※※※※※※※※※※※

wp-includes の中の formatting.php の
(2.0x系は wp-includes / functions-formatting.php 1039行目付近)

$output = wpautop($output);
を
$output = brBrbr($output);

に修正。（この記述を見つけて下さい。）
※※※※※※※※※　2.5.x ~ の場合さらに　※※※※※※※※※※※※※※※
※ビジュアルエディタのみ使う場合は特に以下の修正の必要はありません。

wp-admin/js/editor.js の該当箇所を以下ように修正して下さい。

// pee = pee.replace(new RegExp(“\\n\\s*\\n+”, ‘g’), “\n\n”);
//pee = pee.replace(new RegExp(‘([\\s\\S]+?)\\n\\n’, ‘mg’), “$1\n”);
//pee = pee.replace(new RegExp(‘\\s*?’, ‘gi’), ”);
この3行の先頭に // を付けてコメントアウト

pee = pee.replace(new RegExp(‘\\n’, ‘gi’), " ");

※↑すべて半角に直してください。

を追加。
これはビジュアルとHTMLを行き来するときの不具合を解消します。
ブラウザによる動作の違いもある程度解消されます。

※2.3.x系はこの不具合を解消できません。(´ﾍ`;)
2.5以降にアップすることをおすすめします。
※※※※※※※※※※※※※※※※※※※※※※※※※※※※※※※※※※※※

不具合がありましたらコメントでお知らせ下さい。

2009/6/15　一部修正
2009/1/29　一部修正
6/22 2.5.1 関連他追記

46 comments

しゅう · 2008/01/10 19:03

さっそくやってみました。
ですが、出来ません…。

ME2.2.3です。

無理なんでしょうかね…
Admin comment by かむ · 2008/01/11 22:52

しゅうさん
あらら？だめですか？(´ﾍ｀；)
他のプラグインを一旦オフにしてみていかがでしょう？
しゅう · 2008/01/13 13:07

他のプラグインをオフにしてもできませんでした。

だめなのかな?。残念。
Admin comment by かむ · 2008/01/16 23:55

しゅうさん
うーん。。。なんでしょう？あとは
formatting.phpファイルの書き換えがうまく言ってないとか
それくらいしか思い浮かびません。

まっさらなシステムに入れて試していかがでしょう。
すみません、もうそれくらいしかやることが…..
とんみ · 2008/01/25 10:57

こんにちは。とても便利なプラグインの開発お疲れさまです。

バージョン2.2.1で使ってみました。

ビジュアルリッチエディタで使用すると、改行が2つ（）連続して挿入されるのです。また、連続しての挿入が出来ない状態です。上記以外にも何か設定はあるのでしょうか？

これからも便利なプラグインの開発をがんばってください。
zen · 2008/01/27 13:18

こんにちは。秀逸なプラグイン有難うございます。

報告ですが本家のWP(ver2.3.2)でも同様に上記を変更する事で対応が可能でした。

動作としてはshift+enterでの改行だと可。enterのみだと不可と言った感じです。

ただ、ビジュアルエディタタブからコードタブに移動してまたコードタブからビジュアルエディタタブに移動するとshift+enterで入った改行が省かれちゃうみたいです。

両方兼用に成るような対応方法でありますでしょうか・・・。

＞プラグインだけで何とか出来ればよかった

同感かもですｗ
かむ · 2008/01/27 20:08

とんみさん
返事遅くなりました。
報告ありがとうございます。

ビジュアルエディタだとshift+enterで通常の改行になります。
enterだけで改行すると複数入りますがそれではないですか？
違ったらすみません。

zenさん
報告感謝いたします。
>動作としてはshift+enterでの改行だと可

enterのみでも改行入るかと思いますが
だめですかね？汗

>両方兼用に成るような対応方法でありますでしょうか・・・。

そのあたりの動作がバージョンごとに違ったりして
なんとも不可解なエディタでして….
（言い訳ですみません…当方力量不足ですみません。泣

少々お時間いただきまして、もうちょっと研究してみます。
またよかったら覗いてください。
zen · 2008/01/29 12:48

お返事ありがとうございます。

本家のWP(ver2.3.2)でbrBRbrを導入する前後の動作を確認させて頂きました。

結果として導入前だと

enterのみでの入力はで囲われ空欄は省かれてしまう。shift+enterで入力してもがに置き換わり且、空欄は省かれてしまう。
※ソース、ビジュアルとも同様の動作です。

例）
test ← enterで改行　　 ← enterで改行　　 ← enterで改行 test ← shift+enterで改行　　 ← shift+enterで改行　　 ← shift+enterで改行 test ↓ 　test　←　enterのみで改行　test　　←　shift+enterで改行　test

導入後の変化としては

エントリー全体をが囲む形になっておりenterのみでの改行は無効、shift+enterでの改行のみがとして残ると言った具合になっておりました。
※ソース、ビジュアルとも同様の動作です。

例）
test ← enterで改行　　 ← enterで改行　　 ← enterで改行 test ← shift+enterで改行　　 ← shift+enterで改行　　 ← shift+enterで改行 test ↓ test test test

となる様です。例にコードダグを使ってみましたが上手く表示されるかな。

>当方力量不足ですみません。泣

いえいえ私こそ、つかわさせて頂いている分際でモノ申してすいませんです。

動作検証でご協力させて頂くので今後ともよろしくお願いします。
zen · 2008/01/29 15:30

かむさん

長文失礼しました、コメント欄だとタグが表示されないみたいなので自分のブログにエントリーとして検証結果を記載してみました。

微力ではありますが協力させて頂ければ幸いです（＾＾
かむ · 2008/01/30 23:58

zenさん
なんと！ありがとうございます。
週末しっかり見てみますね。　何とかなればいいですが…
あ、その、がんばります！(^_^;)
かむ · 2008/02/04 22:08

zenさん
お待たせしております。こ、これはかなり難解です。(泣
ソースとの行ったり来たりはエディタが
javascriptでやってしまうようで
エディタそのものをいじらないといけないみたいです。
なので、プラグインだけでは絶望的な感じがします。

enterで改行が反映されないのは
何とかなりそうですが、まだ検証中です。
もうしばらくお待ち下さい〜(^_^;)
りゅう · 2008/03/07 22:27

素晴らしいプラグインです。導入させて頂きました！！
Admin comment by かむ · 2008/03/09 15:14

りゅうさん
報告ありがとうございます。
何かありましたらコメント下さい。
ふかぞう · 2008/03/16 18:22

はじめまして！
こんなプラグインがあったなんて、感激です。
いつも仕事で納入する際、
Shift+Enter と　Enter　の違いをレクチャーしないとならず、でもどうしても普段やりなれてない方だと忘れちゃうんですよね。

なので、とても助かります。

で、私は現在 ME2.1.3　を使用しているのですが、
（諸説あってアップデートできず）
このバージョンでも上のzenさんと同様の症状になるようです。

ただ、改行はShift+enterでと覚えてしまえばそれでもとても助かります。

できれば、Enterのみで解決するようにしていただけるととてもうれしく思います。
でも、たぶん難しいんですよね。

では、これからも使わせてもらうと思いますので、
どうぞよろしくお願いします。
Admin comment by かむ · 2008/03/16 22:55

ふかぞうさん
報告ありがとうございます。
今そのあたりでなかなか苦戦していますが、
今月中には何かしらの結論を出しますね。

リッチエディタでのenterのみの改行を
改行として認識しないようで、
これがエディタそのものをいじる以外無いようなのです。

後ろ向きな対応になってしまったら申し訳ありません。･･･(；´Д｀)
wwwww · 2008/03/29 23:44

WordPress ver.2.3.3では
$output = woautop($output);
が消えてしまったようです（´・ω・`）
wp-includesフォルダに移動して
grep “woautop” ./*.php
してフォルダ中検索しましたがどこにもない…
Admin comment by かむ · 2008/04/04 12:02

wwwwwさん
返事遅くなりました。
報告ありがとうございます。
ひえ〜そんなことが…(´ﾍ`;)

宿題がどんどん増えていく…
ふりーだむ · 2008/07/06 13:11

すばらしいプラグインの開発ご苦労様です(_ _)

2.5.×系に対応とあったので試させていただきました。
XREA+の方に2.5.1をインストールし、そのままの状態でビジュアルエディターが使えることを確認した後、formatting.php、editor.jsを編集し、アップロードしてbrBrbrを有効にしてみました。

するとビジュアルエディターを使用することができなくなってしまいました＞＜
HTMLエディタの方は正常で、こちらはちゃんと改行を認識してくれています。

何がいけないのかさっぱりわからず、エディタがだめなのかと思いeditor.jsを編集前のファイル(コメントアウトし、例の一行を追加する前)に戻し、アップロードしてみるとビジュアルエディターは使用できるのですが、改行が削除されてしまうようです。

ファイルの編集にはDreamweaver CS3を使用しています。

当方、プラグイン等全くの初心者なので自分でどうこうできる力量ではないので、かむさんのお力を貸していただければと思います。

よろしくお願いします。
Admin comment by かむ · 2008/07/07 13:03

ふりーだむさん
報告ありがとうございます。

ひょっとしたら、DWが?など
記号を置き換えてしまっているかも知れません。

UTF8が扱える別のエディタを使っていただくか
DWの編集の文字コードをUTF8にしていただいていかがでしょうか。
ふりーだむ · 2008/07/07 21:54

かむさん。
お返事ありがとうございます。

早速、エディタを変えてやってみたところ、あっさり動作しました(；´∀｀)
これで一安心です。

これからもプラグイン開発などなどがんばってください。
Admin comment by かむ · 2008/07/09 12:10

ふりーだむさん

うまくいってよかったです。
ゆる〜くがんばります。(笑)
Admin comment by かむ · 2008/07/09 12:15

wwwwwさん
すみません、レス飛んでしまいました。ι(´Д｀υ)
2.3系についても追記しましたが

色々やってみましたが、2.3系は一部不具合が解消できません。
改行自体は問題ないかと思いますが
2.5xにアップをおすすめします。
heth · 2008/08/24 02:52

すばらしいプラグインをありがとうございます。
そっそく使わせていただきます。

$output = woautop($output);
を

$output = brBrbr($output);

に修正。

というところなのですが、woautopではなく、wpautopではないでしょうか？検索しても見つからなかったので。
一応報告しておきます。

手前味噌で申し訳ありませんが、もしお時間がありましたら、
プラグインだけでビジュアルエディタにも対応できるような
プラグインの開発をよろしくお願いします。

この改行問題で困っている人は多いと思いますので、
きっと多くの人(私にもｗ)の役に立つと思います。
かむ · 2008/08/27 12:40

hethさん
報告ありがとうございます。

す、すみません、wpautopです。
修正しました。(^_^;)

プラグインだけでエディタをコントロールしたいのですが
不可能っぽいんです。
WP側での対応を希望したいところですが…
トロ · 2008/10/01 04:10

wp2.6.2で使用しています。
ビジュアルエディタ使用時の修正箇所は
wp-includes / functions-formatting.php
ではなく、
wp-includes / formatting.php

ですね。

問題なく動作していますよ?

非常に助かってます＾＾
Admin comment by かむ · 2008/10/01 09:27

トロさん
そうです、2.6x~は2.5xと同じです。

wp-includes / functions-formatting.phpは
2.0x系ですね。分かりにくかったですかね。

報告ありがとう後合います。
BrownFactory ? Blog Archive » wordpressで改行できるようになった · 2008/10/15 10:34

[...] 参考 Pタグ出しまくりから開放された！タグ見えてたから、自分がビジュアルリッチエディタ使ってると思ってなかったお。ところでHTMLのタブを押してもHTMLエディタに切り替わらな [...]
Akihi · 2008/10/29 17:59

プラグイン、使わせていただきありがとうございます。
Wordpressバージョン 2.6.3で使わせていただきましたが、
brBrbrプラグインを有効化し、
formatting.phpの1144行目を　$output = brBrbr($output);
にして、
editor.jsも修正しましたが、

TinyMCE Advancedを使用時、ビジュアルエディタでEnterで改行をすると、やはりPタグで囲まれてしまいます。
またTinyMCE Advancedオフ状態では、
ビジュアルエディタでEnterを押すと、
HTMLエディタで確認するとpタグは挿入されていませんが、出来たページを確認すると、今度は１改行ごとにbrタグが４つずつ入ってしまいます。

お忙しいところを恐縮ですが、もし対策方法がありましたら教えていただけませんでしょうか。
よろしくお願いします。。
Akihi · 2008/10/30 15:46

すみませんっ　
http://blog.tarotaro.org/archives/category/wordpress
こちらのページを参考に　手を加えていたのを忘れていました。

元に戻しましたら、Htmlエディタでは問題なく１Enterにつきbrひとつが入るようになりました。
が、ビジュアルエディタでは１Enterにつき二個ずつbrタグが入ります。
「a」と打った場合
a 
 
a 
 
こんな感じです。

また、TinyMCE Advancedのビジュアルエディタで入力すると
a
 
a
 
a
こんな風にbrとpタグが入り乱れます。

投稿者が私本人ではないため(代理設置のため）、ビジュアルエディタを出来るだけ初心者が使いやすいようにしてあげたいのですが・・・。
（絵文字を使いたがる都合上、TinyMCE Advancedを入れてます。）

何かお知恵がありましたら拝借させてください。
よろしくお願いします。
かむ · 2008/10/30 16:57

Akihiさん
報告ありがとうございます。

>ビジュアルエディタでは１Enterにつき二個ずつbrタグが入ります。

えと、これは正常な状態です。
ヴィジュアルエディタの仕様でshift+enterで改行一つになります。

>TinyMCE Advanced
なんとそんなプラグインが…(勉強不足ですみません(^_^;)
たぶん、TinyMCE Advancedのスクリプトが
brBrbrの処理を上書きしてるのかも知れません。
（brBrbrが効いてない？

TinyMCE Advancedを解析しないといけませんが
ふ、複雑そうですね。(((( ;ﾟдﾟ)))
見てみますがちょっとお時間ください….
Akihi · 2008/10/30 17:20

何度もすみません。。

TinyMCE Advancedについては、
plugins/tinymce-advanced/js/tadv_replace.js
の中の
pre_format : function(c) {
をコメントアウトしたら、普通のエディタと同じ状況になりました。
つまり、
ビジュアルエディタではaを三回打つと

a 
 
a 
 
a

Htmlエディタでは

a 
a 
a

になります。

ビジュアルエディタのみ、brが余分に入るのを制御できればいいのですが。
お忙しいところを恐縮ですが、よろしくご指導お願いいたします。。
Akihi · 2008/10/30 17:24

すみませんっ　
＞えと、これは正常な状態です。
そうだったんですね！

すごく初歩的なところで躓いて大変申し訳ないです。
友人にはshift+enterを使うように勧めます。
（あるいは余力があればエディタにその機能のボタンをつけてあげるかも・・・）

何度も長々と申し訳ありませんでした。
ありがたくプラグインを使わせていただきます！
かむ · 2008/10/31 18:23

Akihiさん
エディタがenterだと改行コードをふたつ吐く微妙な仕様で、
これをbrに置き換えるんでそんな風になります。
brBrbrからはshift-enter2回と同じ改行ふたつに見えるので
判別できないんですよ。(×_×;）

ここはひとつ、お友達にがんばっていただくと言うことで….(^_^;)
seto · 2008/11/13 18:03

はじめまして?
改行できるようになって嬉しいです。
現在私のwpバージョンは、2.6.3です。
記事を投稿すると、見たままのとおり改行されているので感激していますが、

「もう一度記事を書き直したい」と思い、一度保存した記事を開いて保存すると　さらに見たままの改行がプラスされてしまいます。

例えば、

■今日のお勧め＜br /＞

↑これを昨日のお勧めとして訂正保存すると

■今日のお勧め＜br /＞＜br /＞

と、こんな感じになってしまいます。一発で投稿できれば良いですが。。
これは仕様なんでしょうか？
当方リッチテキストエディタで使用中です。
かむ · 2008/11/13 18:36

setoさん
報告ありがとうございます！

確認ですが、ブラウザはIEですか？
seto · 2008/11/15 19:02

はいIEですよ?
かむ · 2008/11/22 20:23

setoさん
返事遅くなりました。

こちらでは特に問題ないようですが
このエントリの処理は間違いないと言うことでしたら

他に使ってるプラグインを一回切ってもなりますでしょうか？
Test | 『空と大地と犬達と』 · 2009/01/27 18:20

[...] みもう一文書いてみる今度はEnterのみ ? どぉ?なんでしょうかね？ ? ? プラグインに brBrbr と、 Light Fomatter　を追加してみました改行がうまくいくのでしょうか？うまくいったみ [...]
我が家の道具 | 『空と大地と犬達と』 · 2009/02/01 15:42

[...] brBrbr や　Light Formatter を使用しても、うまくいきません、もちろん同時使用ではなくて、個別利用でしたが。 [...]
[WordPress]改行 - guram journal · 2009/04/17 17:25

[...] WordPressでは，改行を編集画面で挿入しても，自動的に詰めてしまう．記事を編集する画面には，「ビジュアル」と「HTML」があり，「HTML」の編集画面で タグを挿入することで改行はできる．でも何回も自分で入力するのは大変なのでpluginを探してみるとやっぱりあった． WordPress　改行プラグイン　brBrbr.php ダウンロードして，pluginフォルダにFTPソフトでアップロード．すると，WordPressのメニューから「プラグイン」を押して「プラグイン管理画面」に移動．画面の下部に「停止中のプラグイン」のリストがあり，brBrbr.phpが表示されているはずなので，右側に「使用する」という文字があるので，クリックして有効化する．「ビジュアル」と「HTML」を行き来して編集すると，キャンセルされてしまうみたい．ただ，以下の記事に対処方法が掲載されているけど，まだ試していない．とりあえず，「HTML」で編集のみで編集することにする．改行プラグインビジュアルリッチエディタ対応 [...]
ワードプレスの改行 | grazie · 2009/06/17 09:54

[...] をよみつつ、プラグインのインストール。意味不明の「改行プラグインビジュアルリッチエディタ対応」の部分は、ひとまずスルー。うへぇ [...]
acchis · 2010/01/12 14:18

こんにちは。
「brBrbr」使わせて頂きました。
どうもありがとうございました。

これからも期待してますね♪
A24-CS · 2010/04/20 20:45

WordPressの改行プラグインを探していて、
こちらのサイトを知りました。

シンプルで素晴らしいプラグインですね！

開発ありがとうございます。
Author comment by かむ · 2010/04/27 22:43

acchisさん A24-CSさん
報告ありがとうございます！

じゃんじゃん改行して下さいね(^_^;)
daistar · 2010/04/28 00:05

プラグイン、早速インストールさせていただきました。
これって　Shift+Enter でしか改行されないんですよね？

バージョンは、2.9.2 ja
ブラウザは、Chrome 5

を使ってます。
ご指導お願いします
Author comment by かむ · 2010/04/28 13:00

daistarさん
確認しました。Chrome5（Winですよね？）はEnterのみではできませんね。
editor.jsの改良がいりそうですが、
Wordpressがエディタの改行を読んでいないようです。
やってみますが現状対応が難しいかも知れません。

shift+enterなら大丈夫みたいですね。

また報告します。