SOY CMSの記事投稿画面で絵文字を使いたい

SOY CMSのブログ記事の投稿画面で絵文字を使いたいという要望が時々ある。

公式サイトでも配布されているけど、古くてうまく使えない。

そこで、記事投稿画面で使用しているTinyMCEというエディタに標準で搭載している絵文字を利用してみる。

TinyMCE | The Most Advanced WYSIWYG HTML Editor

まず、TinyMCEの設定画面を開く。

パスは

/CMSのインストールディレクトリ/soycms/js/editor/RichTextEditor.js

です。

開いたら、最初のtinymce.initの処理を下記の様に修正する。

tinymce.init({
	mode : "specific_textareas",
	editor_selector : "mceEditor",
	theme : "modern",
	skin : "lightgray",
	plugins : "save,pagebreak,table,hr,insertdatetime,searchreplace,contextmenu,code,textcolor,paste,directionality,fullscreen,noneditable,charmap,visualchars,nonbreaking,innerlink,insertimage,insertwidget,emoticons",
	tools : "inserttable",
	language : soycms.language,
	height : "300px",
	resize: "both",

	menubar : false,
	toolbar1 : "save | cut copy paste pastetext | searchreplace | bold italic underline strikethrough | subscript superscript | forecolor backcolor | alignleft aligncenter alignright | formatselect fontselect fontsizeselect",
	toolbar2 : "bullist numlist | outdent indent blockquote | undo redo | cleanup removeformat code styleprops attribs | fullscreen preview | insertdate inserttime | innerlink insertimage insertwidget | emoticons charmap | table",

	init_instance_callback : function(editor) {
		onInitTinymceEditor(editor.id);
	},
	oninit : function(){
		onInitTinymce();
	},

	cleanup : true,
	verify_html : false,
	convert_urls : false,
	relative_urls : false,
	entity_encoding : "named",
	urlconverter_callback : common_convert_urls
});

6行目と14行目にemoticonsを追加する。

6行目にはemoticonsの前に,(コンマ)を忘れずに

6行目はTinyMCEの絵文字のプラグインを利用するという意味があり、14行目は絵文字プラグインのアイコンをどこに表示するか？という意味がある。

ファイルを修正して記事投稿画面を開いてみると、

soycms_tinymce_emoticons