WYSIWYGエディター(CKEditor)を使用する

a-blog cmsでは、任意の入力フィールドをCKEditorにする設定が標準で実装されています。(v1.2.1より)

通常は、ユニットのプルダウンメニューで「ウィジウィグ」を選択すると、入力フィールドがCKEditorに切り替わりますが、この機能を使用すると任意の入力フィールドをCKEditorの入力画面にすることができます。

カスタムフィールドであらかじめウィジウィグ入力することが決まっている場合などに設定すると便利です。


任意の入力フィールドをCKEditorにした場合の表示

任意の入力フィールドをCKEditorにした場合の表示


任意の入力フィールドをCKEditorにする

1. 設定の編集

この機能の設定は、/js/config.jsの以下の箇所にあります。設定を変更する場合は、適用しているテーマ内にJavaScriptファイルを別途作成してください。


   ckeMark     : 'textarea.js-ckeditor',

ckeMark CKEditorにする入力フィールドのセレクタを指定します。

2. HTMLの編集

例)ckeMarkで「textarea.js-ckeditor」と指定した場合

<textarea name="textarea" class="js-ckeditor"></textarea>

自動保存機能を利用しない設定

a-blog cms では、記事を書いている途中にブラウザを閉じてしまっても自動保存機能で戻す事ができます。デフォルトの状態では利用する設定になっていますが、js/config.js の設定で利用しないように変更できます。



config.js の変更箇所


    //--------------
    // web storage
    webStorage          : 'on',
    webStorageType      : 'local', // local or session
    webStorageCapacity  : 'one', // one or limitless
    webStorageInterval  : 2000,

webStorage の設定を off にして下さい。


ver2.1.1.4でのエントリー編集の不具合

ver2.1.1.4をご利用の場合

2015/03/17以前にダウンロードしたver2.1.1.4パッケージで 管理画面側でエントリーを編集すると公開日時と掲載期限が入力できない問題が確認されています。 これによりエントリーを保存した日が掲載期限に設定されエントリーがその日に掲載期限になってしまう問題があります。

対応

以下のパッチを適応して下さい。


ファイルを開く

admin.js

この度はご迷惑をおかけしてしまい申し訳ございません。
今後ともa-blog cmsをお願い致します。

追記 2015/03/23

今回のバグにより掲載期限が切れてしまったエントリーを検索する為のEntry_ExpirationListというモジュールを用意しました。以下のファイルをダウンロードして頂き解凍後、指定の場所に設置してください。


ファイルを開く

Entry_ExpirationList

設置後、適当なテンプレートに以下のモジュールを貼ります。これによって期限が来てたエントリーのみ出力されるようになります。

<!-- BEGIN_MODULE Entry_ExpirationList -->
<div>
<!-- BEGIN notFound -->
<p>エントリーが見つかりませんでした。</p>
<!-- END notFound -->

<!-- BEGIN unit:loop -->
<ul><!-- BEGIN entry:loop -->
	<li>
		<p><a href="{url}">{title}</a></p>
	</li><!-- END entry:loop -->
</ul><!-- END unit:loop -->

<!-- BEGIN pager:veil -->
<p>
	全 {itemsAmount} 件中 {itemsFrom} 〜 {itemsTo} 件目を表示
	<!-- BEGIN firstPage:veil --><a href="{firstPageUrl}">{firstPage}</a><!-- END firstPage:veil -->
	<!-- BEGIN page:loop --><!-- BEGIN link#front --><a href="{url}"><!-- END link#front -->{page}<!-- BEGIN link#rear --></a><!-- END link#rear --><!-- BEGIN glue -->, <!-- END glue --><!-- END page:loop -->
	<!-- BEGIN lastPage:veil --> ...<a href="{lastPageUrl}">{lastPage}</a><!-- END lastPage:veil -->
</p>
<p>
	<!-- BEGIN backLink --><a href="{url}">« 前の{backNum}件</a><!-- END backLink -->
	<!-- BEGIN forwardLink --><a href="{url}">次の{forwardNum}件 »</a><!-- END forwardLink -->
</p>
<!-- END pager:veil -->
</div>
<!-- END_MODULE Entry_ExpirationList -->