「入力で、テキストの色を変えたり太字にしたい！」という要望が今回、お引き受けしているシステムでありました。
それに対応するために、リッチテキストエディターを導入することになりました。
調べてみるといろいろあるので迷うところですが、FCKeditorを使ってみることにしました。
もっとスマートな実装方法も多々ネット上にありますので、よければそれらをググってみられた方がいいかも知れません。
以下、導入時の覚書です。
FCKeditorから最新版をダウンロード。
今回のダウンロードはFCKeditor_2.6.4.1
仕様環境はPHP5なので、PHPで必要な部分のみ使用、設定を行うことにする。
1.デモでも見られるツールバーセットのデフォルトを確認しながら、ボタンの数を減らしていく。
今回採用したボタン数は、こんな感じ
このツールバーセットを、/fckconfig.jsに追加する。
FCKConfig.ToolbarSets["my_toolset"] = [
['Source'],
['Undo','Redo','-','SelectAll','RemoveFormat'],
'/',
['Bold','Italic','Underline','StrikeThrough','-','TextColor','BGColor','-','Subscript','Superscript'],
['OrderedList','UnorderedList','-','Outdent','Indent','Blockquote'],
['JustifyLeft','JustifyCenter','JustifyRight','JustifyFull'],
['Link','Unlink','Anchor'],
['Image','Flash','Table','Rule'],
'/',
['Style','FontFormat','FontName','FontSize'],
['About'] // No comma for the last row.
] ;
2.改行した時に、<p>タグでくくるか、<br / >タグを入れるかを設定する項目は、<br / >タグを入れたいので、変更。
FCKConfig.EnterMode = 'br' ; // p | div | br
FCKConfig.ShiftEnterMode = 'p' ; // p | div | br
3.スキンは、3種類用意されている。Silverが個人てきに好みだったので、使ってみました。
以下を、formタグの中に入れる。
<?php
include("/home/mysite/fckeditor/fckeditor.php") ;
$sBasePath = "http://www.gworks.jp/~mystile/fckeditor/";
$oFCKeditor = new FCKeditor('post_data') ;
$oFCKeditor->BasePath = $sBasePath ;
$oFCKeditor->Config['SkinPath'] = $sBasePath . 'editor/skins/silver/' ;
$oFCKeditor->ToolbarSet = 'my_toolset';
$oFCKeditor->Value = FCK_POSTDATA ;
$oFCKeditor->Create() ;
?>
送信ボタンを押したとき"post_data"に値が格納されます。$_POST関数で値が取れます。
あと、テキストエリアの中にデフォルトで文字を入れておく場合は、"FCK_POSTDATA"に値を用意しておく。
4.ファイルアップロードの設定。
/filemanager/php/config.phpを修正すると、ファイルがアップロード出来るようになります。
ファイルアップロードを許可へ
$Config['Enabled'] = true ;
アップロード先のフォルダ指定
$Config['UserFilesPath'] = '/userfiles/' ;
$Config['UserFilesAbsolutePath'] = '/home/mysite/userfiles/' ;
アップロードフォルダは、書き込み許可775もしくは777を与えておく。
アップロードされるファイルは、拡張子に応じて、フォルダを分けて保存される設定が下のほうに書かれています。
以上