MT カスタムフィールドの使い方「ラジオボタン編」

カスタムフィールドラジオボタンの使用方法

カスタムフィールド作成

まずはカスタムフィールの作成から行いましょう。

ラジオボタンの使用方法 1

設定 → カスタムフィールドから作成出来ます。

ラジオボタンの使用方法 2

どこのフィールドに作成するか選びます。（今回はブログ記事に作成）

ラジオボタンの使用方法 3

カスタムフィールドの種類を選びます。

ラジオボタンの使用方法 4

オプションにラジオボタンの名前を入力。オプション事をカンマ（,）で区切って下さいね。
（今回はサンプルとして SS,S,M,L,LL と記入しました。）

ラジオボタンの使用方法 5

これで「保存」を押すとブログ記事にラジオボタンのフィールドが作成されています。

ブログ記事

作成したてだと表示されていないと思いますので、ブログ記事の右にある「表示オプション」をクリックし、先ほど作成したフィールドを表示させて下さい。
すると下記画像のような画面になります。

ラジオボタンの使用方法 6

ちなみにラジオボタンを横並びにするには、mt-static/css/main.css の最後に下記CSSを追記して下さい。

.custom-field-radio-list li	{
  float:left;
  margin-right:5px;
}

すると管理画面上では下記画像の用になります。

ラジオボタンの使用方法 7

それで本題はここからなんですが、このラジオボタンを選択した際に振り分ける為のソースについて書いておきたいと思います。

ちなみにフィールドを作成した時に出来たソースをそのまま使うとすると

<MTIfNonEmpty tag="radio">
ラジオボタン: <MTradio>
</MTIfNonEmpty>

MTradio の部分がラジオボタンを作成した際にオプションに記入したテキストが表示されるようになります。

今回のサンプルでは SS S M L LL と設定したので、仮に SS にチェックして保存した場合
上記デフォルトのソースを使った場合「ラジオボタン: SS」と表示されます。

まぁ～場合によってはこのままでも使えるとは思うですが、もっと使いがってが良いように振り分けのソースを書いておきます。

<MTSetVarBlock name="size"><MTradio></MTSetVarBlock>

<MTIf name="size" eq="SS">
  SSの場合に実行
</MTIf>

<MTIf name="size" eq="S">
  Sの場合に実行
</MTIf>

<MTIf name="size" eq="M">
  Mの場合に実行
</MTIf>

<MTIf name="size" eq="L">
  Lの場合に実行
</MTIf>

<MTIf name="size" eq="LL">
  LLの場合に実行
</MTIf>

name に入っている名前は何でも大丈夫です。全部統一して記述して下さいね。

後 eq にラジオボタンを作成した際にオプションに記入したテキストをそれぞれに入れて下さい。