現在の当ブログの状況と差異が生じている場合があります。
参考になさる場合はその点をご理解の上、ご利用くださいますようお願いいたします。
入力内容をわかりやすくして、コメントをしてもらいやすくしようと思い、ビジュアルエディタを導入することにしたのですが、それによって起こったトラブル他をメモがてら書いておこうと思います。
そもそもビジュアルエディタって？
ビジュアルエディタとは書き込んだ文字に対してされている装飾などを実際にどう表示されるかを確認しながら入力でき、HTMLに詳しくなくても凝った記事を入力することができるものです（結構いい加減な説明）。
いままでコメント欄にプレビューをつけてみたり、タグを挿入できるボタンを追加したりして来ましたが、プレビューも思った通りに表示されなかったり、タグだけでは投稿した時にどんな風になるのか予測しづらかったりすると思い、投稿後のスタイルがわかりやすいビジュアルエディタを取り入れることにしました。
実際に起こったトラブルとカスタマイズ
今回使用したのは【CKEditor For WordPress】。
コメント欄にも適用できる事からこちらを選びました。
導入方法はWordPressメニューの【プラグイン】＞【新規追加】から【CKEditor For WordPress】を検索してインストール＆有効化。
有効化するとメニューに【CKEditor】という項目が追加されるので『Basic Settings』から『Use CKEditor as comment editor』にチェックを入れます。
すると本来ならこの時点でコメント入力欄上部に各種ボタンが色々表示されるわけですが…表示されない。
で、調べてみるとWordPress4.0になった時点でCKEditorが使えなくなっているという問題が発生していたようで、英語版WordPressのサポートと後のCKEditorのVerUPでその症状は改善された模様。
しかし、VerUPをしてみたものの、依然私のサイトでは表示されませんでした。
随分悩んだのですが、ビジュアルエディタの導入は諦めたくなかったので、試したのは先に入れてあったプラグインを1つ1つ停止しては確認という（かなり）面倒臭い作業。
これがアタリでした。
このブログで試す前にほぼ同じ環境をローカルに作ってそこで検証しているのですが、そこで引っかかったプラグインが【Content with show/hide javascript for "more"】折りたたみ記事を同じページで読めるようにするプラグインです。
なので、まずこれを停止することにしたのですが、記事がうにょ～んと伸びて読めるようになるこの機能も絶対に取り外したくなかったので、javascriptがだめならjQueryではどうだ、と代わりのプラグインを探しました。
最初は小粋空間さんの【WordPressの「続き」をjQueryで折りたたむ「wp_more_content_folder」プラグイン】。
CKEditorとの相性は大丈夫だったのですが、単独ページでも続きを隠したままにしておきたい場合、これは単独ページでは続きが開けなくなってしまってダメでした。
で、もう一つ見つけたのが【Read More Right Here】。
これを導入することで、問題の1つは解決しましたが、新たな問題が。
文末につけていたWeb拍手のボタンが2つ表示されるようになってしまったのです。
それ、困る。
とっても困る！！
で、新しい拍手プラグインも探すことになり、見つけたのはまろやかCGIさんの【まろやかWEB拍手 for WordPress】。
これは本当に素晴らしいプラグインです！
なんでもっと早く探さなかったのか、悔やむくらいです。
お陰で望み通りの表示にすることができましたし、拍手数も表示されて万々歳。
さて、記事の折りたたみプラグインと拍手を変えた時点で、テストサイトの方では問題がなかったので本番環境に移行してみたところ…なぜか表示されない(´・ω・｀)
あっれぇ～～～？
仕方ないので、本ブログをメンテナンスモードにしてプラグイン検証再開…(´；ω；｀)
長丁場になると覚悟したものの、思ったより早い段階で原因を特定できました。
原因は月別アーカイブを折りたたむプラグイン【Collapsible Archive Widget】。
これも代わりになるプラグインを探したんですが、なかなか見つからず元々使っていたプラグイン名にjQueryをくっつけて検索したら【jQuery Archive List Widget】というプラグインが見つかり、試してみたら大丈夫そうだったのでこれをを導入しました。
これで全ての問題解決！
と思ったら…
まだあった…orz
色々確認してみたら、記事中のソースコードを表示する【SyntaxHighlighter Evolved】が、折りたたみ記事の内部で効果が出ていない…。
えぇい、ついでだからこれも変えてやる！ と評判のよさげな【Crayon Syntax Highlighter】に変更。
これで問題オールクリアです。
総まとめ
今回、CKEditorと相性が悪かったと思われるプラグインは、【Content with show/hide javascript for "more"】と【Collapsible Archive Widget】の2つ。
CKEditorのボタンの増減方法はいろんな所に出ているので今回は省きました。
もしCKEditorをコメント欄で使いたいのに使えなくなった方がいらっしゃったらプラグインとの相性を疑ってみるといいと思われます。
この記事がどなたかの一助になれば幸いです。
