タグ: カスタムフィールドテンプレート

カスタムフィールドテンプレート　管理画面　デザイン

設定の
オプション
テンプレートフォーマットを選択

[cft] and [cftsearch] Shortcode Format
に
そのフォーマーットのコードを入れる

保育園テストコード

<div class="cft_admin_title">預かり年齢</div>
<div class="cft_admin_con">[child_old]</div>

<div class="cft_admin_title">エリア選択（絞込検索用）</div>
<div class="cft_admin_con">[eria_city]</div>

<div class="cft_admin_title">住所（※愛知県から番地まで＝マップ表示のため）</div>
<div class="cft_admin_con">[adress]</div>
<div class="cft_admin_title" style="margin-top:0px;">建物名（あれば）</div>
<div class="cft_admin_con">[adress2]</div>



<div style="float:left;">
<div class="cft_admin_title">平日保育開始時間</div>
<div class="cft_admin_con">[open_time][open_min]</div>
</div>
<div style="float:left;">
<div class="cft_admin_title">平日保育終了時間</div>
<div class="cft_admin_con">[close_time][close_min]</div>

</div style="float:left;">

<div style="clear:both"></div>

<div style="float:left;">

<div class="cft_admin_title">土曜保育開始時間</div>
<div class="cft_admin_con">[open_time_sat][open_min_sat]</div>
</div>
<div style="float:left;">
<div class="cft_admin_title">平日保育終了時間</div>
<div class="cft_admin_con">[close_time_sat][close_min_sat]</div>

</div style="float:left;">

<div style="clear:both"></div>

カスタムアドミン

.cft_admin_title{
	margin-top: 20px;
}
.cft_admin_con{ padding:10px;}
.cft_admin_con input[type="text"]{ width:100%; max-width:500px;}
.cft_admin_disp{}

textarea カスタムフィールドテンプレート

type が file はメディア（写真・動画等）をアップロードするときに使用します。

mediaLibrary（メディアの調整）

概要

アップロードしたファイルの属性等を調整するライブラリーを使う場合に使用します。初期設定では使用しないようになっています。設定するとアップロードした画像のタイトルにライブラリーを開くリンクが設定されます。

用途

アップロードした際のタイトルなどは普通調整すると思うので、使用できるようにした方がいいと思います。これを使用しない場合はメニュー、または投稿画面の画像挿入から調整する事になります。

設定方法

使用しない時… 設定不要
使用する時…　mediaLibrary = true

mediaPicker（ライブラリーから追加）

概要

ライブラリを開いて既にアップロードされているメディアから選択できるようにします。初期設定では使用しないようになっています。

用途

アップロードされているメディアを使用する事は多々あると思うので、使用できるようにした方がいいと思います。ライブラリから設定する場合は「投稿に挿入する」ではなく、見出し「メディアピッカー」の「これを使用する」をクリックします。

設定方法

使用しない時… 設定不要
使用する時…　mediaPicker = true

mediaRemove（メディアの直接削除防止）

概要

カスタムフィールドの「削除」時にライブラリーは残したい場合に使用します。初期設定ではメディア自体を削除します。

用途

他の記事でそのメディアを使用している事もあると思いますので、メディアの直接削除はしないようにした方がいい（＝設定を使用したほうがいい）と思います。

設定方法

直接削除する… 設定不要
直接削除しない…　mediaRemove = true

file　カスタムフィールドテンプレート

セット
mediaLibrary = true
mediaPicker = true
mediaRemove = true

type が file はメディア（写真・動画等）をアップロードするときに使用します。

mediaLibrary（メディアの調整）

概要

アップロードしたファイルの属性等を調整するライブラリーを使う場合に使用します。初期設定では使用しないようになっています。設定するとアップロードした画像のタイトルにライブラリーを開くリンクが設定されます。

用途

アップロードした際のタイトルなどは普通調整すると思うので、使用できるようにした方がいいと思います。これを使用しない場合はメニュー、または投稿画面の画像挿入から調整する事になります。

設定方法

使用しない時… 設定不要
使用する時…　mediaLibrary = true

mediaPicker（ライブラリーから追加）

概要

ライブラリを開いて既にアップロードされているメディアから選択できるようにします。初期設定では使用しないようになっています。

用途

アップロードされているメディアを使用する事は多々あると思うので、使用できるようにした方がいいと思います。ライブラリから設定する場合は「投稿に挿入する」ではなく、見出し「メディアピッカー」の「これを使用する」をクリックします。

設定方法

使用しない時… 設定不要
使用する時…　mediaPicker = true

mediaRemove（メディアの直接削除防止）

概要

カスタムフィールドの「削除」時にライブラリーは残したい場合に使用します。初期設定ではメディア自体を削除します。

用途

他の記事でそのメディアを使用している事もあると思いますので、メディアの直接削除はしないようにした方がいい（＝設定を使用したほうがいい）と思います。

設定方法

直接削除する… 設定不要
直接削除しない…　mediaRemove = true

fieldset_open と fieldset_close　カスタムフィールドテンプレート

type に fieldset_open fieldset_close を設定するとグループ化が出来ます。
グループの最初のフィールドの前にfieldset_open、グループの最後のフィールドの後にfieldset_openを記述するとグループ化します。
ただし、途中のデータに multipleが設定されていると multiple が起動しなくなります。

select　カスタムフィールドテンプレート

type が select はプルダウンボックスとして使用します。

value（プルダウンキーデータ）

概要

プルダウンの中のカスタムフィールドのデータを設定します。

用途

設定方法

value = 任意 # 任意 # 任意
データとデータの間を # で区切ります。

valueLavel（プルダウン表示）

概要

プルダウンの中のカスタムフィールドのデータに対応する見出しを設定します。設定がない場合 value の値が表示されます。

用途

設定方法

value = 任意 # 任意 # 任意
データとデータの間を # で区切ります。

default（初期値）

概要

最初にプルダウンから選択しておく値。

用途

通常はこの値を設定させたい！っという値がある場合に使用します。

設定方法

default = valueにあるデータ
valueLavel を併用している場合でも value の値を使用してください。valueLavelの値だと選択されません。

selectLavel（選択を促すメッセージ）

概要

プルダウンが未選択の場合に表示される内容。設定がない場合は日本語では、「選択してください」と表示されます。

用途

特別何か訴えたい場合に使用します。

設定方法

selectLabel = 任意

text または textfield　カスタムフィールドテンプレート

type が text または textfield は入力エリアとして使用します。

hideKey（見出し表示）

概要

カスタムフィールドのキーを見出しとして表示するかしないかを設定します。設定がない場合は表示します。

用途

同じキーで複数のデータを設定する場合、全てに表示していると、パッと見同じデータなのか違うデータなのかが判断しにくいので、２個目以降にこのオプションを使用するとすっきりします。

設定方法

表示する時　　　…設定不要

表示させない時　…hideKey=true

label（見出し・補足説明）

概要

カスタムフィールドの見出しまたは補足説明です。

用途

グローバル設定によって用途が若干変わります。

「カスタムフィールドのキーの代わりにラベルを使用する」がチェックオンの場合、見出しとして表示されます。チェックオフの場合は入力エリアの上に説明として表示されます。

設定方法

特にない場合　…設定不要

特にない場合　…label=任意の値　※クウォーテーションは要りません。

size（大きさ）

概要

入力エリアの大きさです。

用途

入力するデータが長い場合は見えなくなるので設定した方がいいです。未設定の場合は20になるようです。ブラウザにもよると思いますが、20は大文字で１０文字前後です。

設定方法

size=任意の値

default（初期値）

概要

入力エリアに最初から設定される値。

用途

通常はこの値を設定させたい！っという値がある場合に使用します。

設定方法

default=任意の値　※クウォーテーションは要りません。

date（日付入力）

概要

入力エリアの右側に日付カレンダーを表示するボタンを追加します。ボタンをクリックするとカレンダーが表示され、日付をクリックすると入力エリアに日付が設定されます。

用途

日付の設定をしたい時に便利です。ただし、あくまでも入力補助なので、日付の整合性などはチェックしていません。

設定方法

date=true

ただし、このままだとカレンダーの並びが「月火水木金土日」となって日本のカレンダー「日月火水木金土」と合わなかったり、設定した時に日付の書式が外国式なので、別途オプションの設定が必要です。

dateFirstDayOfWeek（カレンダー先頭曜日）

概要

日付カレンダーの先頭の曜日を設定します。

用途

日付カレンダーを表示させる date ｵﾌﾟｼｮﾝだけだとカレンダーの並びが「月火水木金土日」になっていて、日本とカレンダーと合わないので、このオプションで調整します。

設定方法

dateFirstDayOfWeek = 0

ｾﾞﾛは「日曜」を意味します。

dateFormat（日付書式）

概要

日付カレンダーから選択した日付の書式を設定します。

用途

日付カレンダーを表示させる date ｵﾌﾟｼｮﾝだけだとカレンダーから選択した際に日付の書式が外国式になるので、このオプションで日本式にします。

設定方法

dateFormat = yyyy/mm/dd　※クウォーテーションは要りません。

startDate（開始日付）

概要

日付カレンダーから設定できる最初の日付を設定します。

用途

範囲を決めたい場合に設定します。endDate で最後の日付を設定できます。設定がない場合、本日からになります。

設定方法

固定日付　startDate = ‘2011/01/01’

※日付は例です。クウォーテーション必須。ないとカレンダーが表示されません

本日　startDate = (new Date()).asString()

※初期値が本日なのでこの場合、明示する必要はないです。

endDate（終了日付）

概要

日付カレンダーから設定できる最後の日付を設定します。

用途

範囲を決めたい場合に設定します。startDate で最初の日付を設定できます。設定がない場合は2999/12/31まで設定できます。

設定方法

固定日付　startDate = ‘2011/01/01’

※日付は例です。クウォーテーション必須。ないとカレンダーが表示されません

本日　startDate = (new Date()).asString()

readOnly（読取専用）

概要

入力不可にしたい場合設定します。

用途

独自データを設定したいからカスタムフィールドがあるのに、それを設定させないというある意味おかしなオプションです。

おそらく、複数のカスタムフィールドテンプレートとdefaultと併用して使うのかと思います。「このテンプレートを使用する場合」といった条件分岐をさせたい場合、複数のテンプレートで同じキーを作ってそれぞれのテンプレートで違う値を初期値として設定しておけば出来るとおもいます。

その為には同じテンプレートで違うデータを設定されると困るのでこのようなオプションがあるのではないかと思います。

設定方法

readOnly = true