IE8で画像ユニットに問題が発見されました。

IE8の画像ユニットである設定になると、画像幅がおかしくなり問題が発見されています。

不具合を起こす条件

• コンフィグ > 編集設定のイメージサイズ選択肢のパーセント指定をしていない
• 画像ユニットが左か右にフロートされている
• キャプションが設定されている

上記３つの条件が全て当てはまる場合、以下の画像のように画像の幅がおかしくなります。

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

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

フォームモジュール

フォームについても、モジュールとして提供しております。フォームの基本ステップとしては、新規・修正・確認・完了の4つのステップに分かれており、このステップを増やす事で複数ステップのフォームを用意できる事になります。

<!-- BEGIN_MODULE Form -->

<!-- BEGIN step-->
<!-- 新規 -->
<!--#include file="/include/form/input.html"-->
<!-- END step -->

<!-- BEGIN step#reapply -->
<!-- 修正 -->
<!--#include file="/include/form/update.html"-->
<!-- END step#reapply -->

<!-- BEGIN step#confirm -->
<!-- 確認 -->
<!--#include file="/include/form/confirm.html"-->
<!-- END step#confirm -->

<!-- BEGIN step#result -->
<!-- 完了 -->
<!--#include file="/include/form/result.html"-->
<!-- END step#result -->

<!-- END_MODULE Form -->

フォームの基本

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

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

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

フォームの管理ページ

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

CMS を活用して多言語サイトを作る際には、いくつかの方法があります。 ここでは、Google Translate APIを使って、多言語を同一コンテンツで管理する方法について紹介します。

カスタマイズ

今回のハンズオンではエイリアス機能と Google Translate APIを使って言語によってコンテンツ部分の表示を出し分けてみましょう。

下準備

まずは Google Translate API を使用するために以下の2つのステップが必要になります。

1. API key の取得
2. API key を CMS のプロパティ設定で登録する。

1. API key の取得

まずは、Google API Console にアクセスしてログインしてください。ログイン後、任意の名前でプロジェクトを作成します。 上の画像のように 1, 2 の手順でプロジェクトを新規作成できます。

左上のセレクトメニューをクリックし、先ほど作成したプロジェクトを選択します。

次は、サブカラムより「ライブラリ」という項目をクリックし、API ライブラリのページに移動します。そのページにて、Google Cloud Translation APIという項目を検索して有効化してください。

最後に「認証情報」をクリックして認証情報の設定画面に移動します。そこで新たに API key を作成します。今回はキーの制限は「なし」でも大丈夫です。ただしセキュリティ上、「IP アドレス」を指定し、アクセスできるIPアドレスを制限しておくことをオススメします。

この時発行される API key を覚えておきましょう。

2. API key を CMS のプロパティ設定で登録する。

管理画面 > コンフィグ > プロパティ設定 にて先ほど覚えておいたAPI Keyを入力します。これで下準備は完了です。

課題

フォームを設置するときフォームIDをテンプレートとフォーム管理画面に設定しています。フォームIDがあることでフォームの管理画面に送信データをデータベースに蓄積したり、メールのテンプレートやメールアドレスを指定することができます。

FormモジュールにフォームIDを指定する

フォームの各ステップにフォームIDを記述します。IDの英数字で指定してください。記述方法は以下のような記述になります。

<input type="hidden" name="id" value="(フォームID)" />

例えば、フォームIDが contactForm のときは以下のように記述します。

<!-- BEGIN_MODULE Form -->
 
<!-- BEGIN step-->
<!-- 新規 -->
<!--#include file="/include/form/insert.html"-->
<input type="hidden" name="id" value="contactForm" />
<!-- END step -->
 
<!-- BEGIN step#reapply -->
<!-- 修正 -->
<!--#include file="/include/form/update.html"-->
<input type="hidden" name="id" value="contactForm" />
<!-- END step#reapply -->
 
<!-- BEGIN step#confirm -->
<!-- 確認 -->
<!--#include file="/include/form/confirm.html"-->
<input type="hidden" name="id" value="contactForm" />
<!-- END step#confirm -->
 
<!-- BEGIN step#result -->
<!-- 完了 -->
<!--#include file="/include/form/result.html"-->
<input type="hidden" name="id" value="contactForm" />
<!-- END step#result -->
 
<!-- END_MODULE Form -->

フォーム管理にフォームIDを指定する

管理画面 > フォームの [フォームIDを作成]ボタンを押してフォームIDを作成します。フォーム管理ではフォームの送信データのログを閲覧したり、メールアドレスやテンプレートを指定ができます。

メールのテンプレートを指定する

フォームID画面ではメールのテンプレートや管理者のメールアドレスを指定することができます。

• SubjectTpl ：一般に届くメールの件名
• BodyTpl ：一般に届くメールの本文
• BodyHTMLTpl : 一般に届くHTMLメールの本文（※Ver.2.5以降より追加）
• AdminSubjectTpl：管理者に届くメールの件名
• AdminBodyTpl：管理者に届くメールの本文
• AdminBodyHTMLTpl：管理者に届くHTMLメールの本文（※Ver.2.5以降より追加）

メールのテンプレートはフォームのテンプレートが置いてあるテーマフォルダに置いてください。 例えば メールテンプレートが /themes/site2015/contact/form/subject.txt に置いてあった場合のパスは /contact/form/subject.txt になります。

テキストメール or HTMLメール

HTMLメールの本文のテンプレートがない場合は、テキストメールとして送信されます。HTMLメールとして送りたい場合は、テキストとHTML両方のテンプレートを指定ください。

メールアドレスを指定する

以下のようなメールアドレスを指定する箇所があります。

• To
• From
• Cc
• Bcc
• Reply-To
• AdminTo
• AdminFrom
• AdminCc
• AdminBcc
• AdminReply-To

最初にAdminがつく設定が管理者宛の設定で、つかないものが、自動返信の一般宛の設定になります。 これらの値は、ここでの設定以外にフォームのテンプレートで指定ができます。

通常は、Toにはお問い合わせした人に送信するので、毎回変わりますので、テンプレートで動的に設定します。 Fromは管理者のメールアドレスを設定すればよいでしょう。

逆に管理者宛のAdminToは、管理者のメールアドレスを固定で設定し、Fromを動的にテンプレートで指定します。