EC-CUBEにCKEditorを組み込む

参考にしたサイト(1)

参考サイト(2)

/html/user_data/packages/default/js/ckeditor/ に配置する。

[ページ詳細設定]

 <div>
-    <textarea name="tpl_data" rows=<!--{$text_row}--> style="width: 100%;"><!--{$arrPageData.tpl_data|escape|smarty:nodefaults}--></textarea>
+    <script type="text/javascript" src="<!--{$TPL_DIR}-->js/ckeditor/ckeditor.js"></script>
+    <textarea name="tpl_data" rows=<!--{$text_row}--> style="width: 100%;" class="ckeditor"><!--{$arrPageData.tpl_data|escape|smarty:nodefaults}--></textarea>
<input type="hidden" name="html_area_row" value="<!--{$text_row}-->" />
</div>

[商品登録]

 <tr>
<td bgcolor="#f2f1ec" width="160" class="fs12n">詳細-メインコメント<span class="red">(タグ許可)*</span></td>
<td bgcolor="#ffffff" width="557" class="fs10n">
<span class="red12"><!--{$arrErr.main_comment}--></span>
-     <textarea name="main_comment" value="<!--{$arrForm.main_comment|escape}-->" maxlength="<!--{$smarty.const.LLTEXT_LEN}-->" style="<!--{if $arrErr.main_comment != ""}-->background-color: <!--{$smarty.const.ERR_COLOR}--><!--{/if}-->"  cols="60" rows="8" class="area60"><!--{$arrForm.main_comment|escape}--></textarea><br /><span class="red"> (上限<!--{$smarty.const.LLTEXT_LEN}-->文字)</span></td>
+     <script type="text/javascript" src="<!--{$TPL_DIR}-->js/ckeditor/ckeditor.js"></script>
+     <textarea name="main_comment" value="<!--{$arrForm.main_comment|escape}-->" maxlength="<!--{$smarty.const.LLTEXT_LEN}-->" style="<!--{if $arrErr.main_comment != ""}-->background-color: <!--{$smarty.const.ERR_COLOR}--><!--{/if}-->"  cols="60" rows="8" class="area60 ckeditor"><!--{$arrForm.main_comment|escape}--></textarea><br /><span class="red"> (上限<!--{$smarty.const.LLTEXT_LEN}-->文字)</span></td>
</tr>

ツールバーをカスタマイズ

config.jsに追加・削除

Follow me!