CMS「すぐ使えるCGI」の開発者がご質問にお答えします

 

添付ファイル付 ウェブページ更新ツール 大容量版への CLEditor 組み込み (No. 1641)

回答日: 2015-03-19

質問

○製品名
添付ファイル付 ウェブページ更新ツール 大容量版 (日本語 UTF-8 版 )

○バージョン
Ver 4.8

設置をいたしましてデフォルトでの動作は問題ないのですが、
CLEditorを組み込みたいと思い、下記URLを元に変更を行いましたが
ツールバーが表示されず動作いたしませんでした。

http://sugutsukaeru.jp/support/214/

動作の確認のために、CLEditorが同梱されていた4.2の管理画面を
アップロードした所、ツールバーは表示されましたので
ディレクトリのパスは問題ございません。
上記URLの手順の他に改変が必要な箇所がございますでしょうか。
ご教示いただきけますと幸いです。
どうぞよろしくお願いいたします。
投稿日時: 2015-03-19 12:16

回答

「すぐ使えるCGI」のご利用ありがとうございます。

■問題の詳細のご確認

さて早速ご質問の件ですが、A. ツールバーの画像のみが表示されていない状況でしょうか?それとも、 B. 枠自体が元のテキストエリアのままで一切表示が変わっていない状況でしょうか?


■A. ツールバーの画像のみが表示されていない場合

ツールバーの画像は、cleditor/jquery-cleditor.css 内でパスを指定しています。

指定された場所にボタン画像があるかどうかご確認の上、画像が無ければアップロード、画像の位置を変更したのであれば変更した場所に合わせて CSS ファイルを修正して下さい。

修正後はキャッシュをクリアして動作確認して下さい。


■B. 枠自体が元のテキストエリアのままの場合

i)
枠が表示されていない場合、JavaScript ファイルや CSS ファイルのリンクが切れているという可能性があります。

以下の4つのタグがページ内にあり、リンクがつながっているかご確認下さい。

----
<link rel="stylesheet" type="text/css" href="../cleditor/jquery-cleditor.css">
<script type="text/javascript" src="../cleditor/jquery-1_7_2-min.js"></script>
<script type="text/javascript" src="../cleditor/jquery-cleditor.js"></script>
<script type="text/javascript" src="../cleditor/jquery-cleditor-advancedtable.js"></script>
----

ii)
また、対象テキストエリアに id 属性を付ける事も忘れがちですので、ご確認下さい。また、ダウンロードした製品によっては、同じ「添付ファイル付 ウェブページ更新ツール 大容量版」であっても body ではない id 属性が付いている可能性もあります。

そのような場合に id="body" を付け足してもうまく機能しませんので、その場合は、JavaScript 内に指定のある「'body'」と「"#body"」部分を指定した id 属性に変更して下さい。設定した内容によって、3〜5か所が変更対象です。


iii)
その他、ページ内に既に何らかの JavaScript が含まれている場合、どこか別の部分でエラーが出ると CLEditor も影響を受け動作しません。

ブラウザの「Webコンソール」などから問題が出ていないかご確認下さい。


◆いただいた内容からの修正点
タイトルに詳細情報を加えました。
回答日: 2015-03-19