フォームの基本

a-blog cms では標準でフォーム機能も搭載しております。お問い合わせにフォームなどで利用されています。機能としては、以下のようなものが上げられます。

  • サイトのどこにでも設置が可能
  • フォームの入力内容は管理者と一般にメールが送られてきます
  • 入力項目のチェック機能(必須入力やメールアドレスが一致しているか、数字判定など)
  • 入力項目のコンバート機能(大文字を小文字に変換など)
  • 複数ステップのフォームを作る事ができる
  • フォームの送信内容を蓄積してCSVのダウンロードする

フォームモジュール

フォームについてもモジュールとして提供しております。フォームは基本的に「新規」「修正」「確認」「完了」の4つのステップ(Twig版の場合は3ステップ)で構成されています。必要に応じてステップを追加できるため、複数ステップに対応したフォームを柔軟に構築することが可能です。


<!-- BEGIN_MODULE Form -->

<!-- BEGIN step-->
  <!-- 初期画面 -->
  @include("/contact/form/input.html")
<!-- END step -->

<!-- BEGIN step#reapply -->
  <!-- 修正画面 -->
  @include("/contact/form/input.html")
<!-- END step#reapply -->

<!-- BEGIN step#confirm -->
  <!-- 確認画面 -->
  @include("/contact/form/confirm.html")
<!-- END step#confirm -->

<!-- BEGIN step#result -->
  <!-- 完了画面 -->
  @include("/contact/form/confirm.html")
<!-- END step#result -->

<!-- END_MODULE Form -->
{% set form = module('V2_Form') %}

{% if form.step == 'step' %}
  <!-- 初期・修正画面 -->
  {{ include('/contact/form/input.twig', form.fields) }}
{% endif %}

{% if form.step == 'confirm' %}
  <!-- 確認画面 -->
  {{ include('/contact/form/confirm.twig', form.fields) }}
{% endif %}

{% if form.step == 'result' %}
  <!-- 完了画面 -->
  {{ include('/contact/form/confirm.twig', form.fields) }}
{% endif %}

フォームの基本

入力フォームは、基本的にカスタムフィールドと同じ書き方で増やしていく事ができます。(HTMLのみで追加可能)


<input type="text" name="address" value="{address}" />
<input type="hidden" name="field[]" value="address" />

<input type="hidden" name="address:validator#required" /> <!-- 必須項目 -->
<input type="text" name="address" value="{{ address.value }}" aria-invalid="{{ address.invalid ? 'true' : 'false' }}" />
<input type="hidden" name="field[]" value="address" />

<input type="hidden" name="address:validator#required" /> <!-- 必須項目 -->

フォームの管理ページ

フォーム > フォーム管理 の[変更]ボタンを押すとフォームを管理するページに移動します。こちらに、フォームIDを設定し、そのフォームIDをテンプレート上に設定する事で、データベース上にフォームの入力情報を保存し、CSVダウンロードを可能にしています。また、メールのテンプレートの設定や、From, To等の設定も管理ページ上で設定します。


フォーム管理画面

フォーム管理画面