画像ユニットでは、画像ファイルの埋め込み表示とレイアウト、かんたんな編集ができます。

画像ユニットでできること

• 画像のアップロード
• 画像のレイアウト（右寄せ・左寄せ・中央寄せ）
• 画像サイズの指定
• 拡大と回転の指定
• （詳細設定として）キャプション、リンク、代替テキストの指定

画像のアップロード

操作中のPC内に保存されている画像ファイルをアップロードします。この際、複数のファイルを選択し、一括でアップロードもできます。また、画像ファイルを画像ユニットの編集画面にドラッグ＆ドロップすることでもアップロードできます。（一括アップロード、ドラッグ＆ドロップでのアップロードは、旧バージョンのIEでは動作しません） 一括アップロードを行った場合、レイアウト、サイズなどの指定は複数のファイルで同じ内容が指定されますのでご注意ください。

a-blog cmsでは、大きな画像ファイルをアップロードする際、ブラウザ側で縮小処理を行った後にアップロードをします。この際の縮小サイズは、管理ページ > コンフィグ > 編集設定　にあるイメージサイズの「拡大表示時の最大サイズ」の数値となります。

画像のレイアウト（右寄せ・左寄せ・中央寄せ）

画像を表示する際、右・左・中央のいずれかに配置したい場合、レイアウトを指定できます。右または左を選んだ場合は、次に続くユニットが回り込んで表示されます。

画像サイズの指定

エントリー内で表示する際の表示サイズを指定できます。 管理ページ > コンフィグ > 編集設定　にある「サイズセレクトのイメージサイズ選択肢」で指定した内容が選択肢として表示されます。

拡大と回転の指定

画像の簡単な編集として、画像の拡大禁止と回転を指定できます。 人物が写っている画像など、拡大して詳細を見せたくないという場合には「拡大表示させない」を選択すると、画像を表示する際に拡大リンクが無い状態となります。また、管理ページ > コンフィグ > 編集設定　にあるイメージサイズの「拡大表示時の最大サイズ」で指定したサイズの画像も作成されません。

回転には「時計回りで90度回転」「反時計回りで90度回転」「180度回転」があり、それぞれ画像を回転した状態で保存・表示します。

そのほか、項目として「削除」があり、選択して保存すると該当する画像ユニットが削除されます。ユニット右上の「×」ボタンと同じ動作となります。

（詳細設定として）キャプション、リンク、代替テキストの指定

画像ユニット内の「- 詳細」リンクから、キャプション、リンク、代替テキストの指定ができます。

キャプションはsite2016、blog2016といった同梱テーマであれば画像の下に表示されます。

リンクは、リンク先を入力することで、エントリ内で表示される画像にリンクが指定されます。

代替テキストはブラウザ上での表示には影響しませんが、画像の代替テキストとなるalt属性として使用されます。

画像ユニットに関する注意点

アップロードできるファイル形式

画像ユニットでは、jpg、gif、png、bmp、xbmの各画像形式に対応しています。 なお、gifアニメーションには対応していません。

一定数以上、画像のアップロードができない

1つのエントリーで、画像ユニットや画像のカスタムフィールドを使って、写真・画像ファイルを添付すると20枚以上はアップロードできないことがあります。 サーバー側（PHP）の設定で、関連する項目に制限が設けられている場合にこのような問題が発生します。 詳しくは開発ブログ「画像が一定数枚までしかアップロードできない場合の対処法」をご確認ください。

標準のページャーの設定では、上記の画像のように 1 2 3 4 のように表示され、今いるページのスタイルが違うような表示になるようになっています。先日サポートで、これを 1 / 4 と表示させたいという相談があり、その対応が簡単に思いつかなかったのでブログに書き残しておきます。

Entry_Summary のコンフィグ 初期設定

利用できる変数を考える

表示させる 1 / 4 は「現在表示しているページ / 全ページ数」ということになります。

「現在表示しているページ」については、Entry_Summary の変数にはありませんが、グローバル変数に %{PAGE} というものが用意されていますので、これを利用ください。

問題は「全ページ数」です。Entry_Summary の変数表に以下のような {lastPage} という設定があります。これがページ数が少ない時に初期の設定では表示ができない仕様になっております。これを強制的に表示するための設定するための「前後に表示するページ数」に -1 を設定することで目的の動きになります。

カスタマイズ設定

Entry_Summary のコンフィグ設定

テンプレートへの記述

<p class="acms-text-center">%{PAGE} / {lastPage}</p>

これで当初の目的である 1 / 4 が表示可能になります。

独自に開発したGETモジュールも、標準のビルドインモジュールと同様にモジュールID化する事ができます。ここでは、モジュールID化の仕方と、モジュールID化によってどのような動作になるかみていきます。

モジュールID化できるようにする

まずモジュールID化に対応するため、モジュールID作成時に独自モジュールを選択できるようにします。

ご利用のテーマに以下のファイルを作成し、セレクト要素を記述します。

• /themes/ご利用テーマ/admin/module/select.user.html

<optgroup label="独自モジュール">
	<option value="Sample"{name:selected#Sample}>独自モジュール（Sample）</option>
</optgroup>

以下の仕様でセレクト要素を記述してください。

• 値: GETモジュールの呼び出しと同じ値
• 変数: {name:selected#セレクトの値}

この実装を行う事でモジュールIDの作成ができるようになります。

モジュールIDの作成

モジュールIDの作成ができるようになったので、モジュールIDを作成してみます。以下画像のように作成できると思います。

独自モジュールのID作成画面

モジュールID化でのコンテキスト情報の取得

モジュールID化した時のコンテキスト情報の取得について解説します。モジュールID化する前は、以下のコードを書く事により、そのページの情報を取得できていました。

var $_scope = array(
  'bid' => 'global',
  'cid' => 'global',
  'eid' => 'global',
);

function get()
{
  $string[] = 'Global Vars';
  $string[] .= "BID = $this->bid";
  $string[] .= "CID = $this->cid";
  $string[] .= "EID = $this->eid";

  return nl2br(implode("\r\n", $string));
}

しかし、モジュールID化したモジュールを利用すると $this->cid や $this->eid で、そのページのコンテキスト情報を取得できなくなります。（bidだけはモジュールID化しても取得できます。）

モジュールID化したモジュールを利用すると、そのままではコンテキスト情報は取得できない。

<!-- BEGIN_MODULE Sample id="sample" --><!--END_MODULE Sample -->

ではどのようにURLコンテキスト情報を取得するかというとモジュールID管理画面で取得したい情報の引数項目にチェックをつけます。これによりURLコンテキストの情報を取得できるようになります。

引数の設定画面

これでプログラム側で、以下のようにURLコンテキスト情報を取得できるようになりました。

$string[] = 'Global Vars';
$string[] .= "BID = $this->bid";
$string[] .= "CID = $this->cid";
$string[] .= "EID = $this->eid";

return nl2br(implode("\r\n", $string));

ここまで、$this->cid や $this->eid はURLコンテキスト情報（つまりURLの情報）を取得すると説明してきましたが、モジュールID化する事により、そうでなくなる場合があります。以下の設定画面をみてください。

引数の設定画面2

この場合、表示しているURLが別のカテゴリーや、トップページなどカテゴリー情報がない場合でも、常に $this->cid はお知らせのカテゴリーIDを返すようになります。このようにモジュールID化するとモジュールIDの設定により取得してくる情報は変わるようになります。

モジュールID化時のコンテキスト情報の取得まとめ

モジュールIDの設定と関係なく表示ページのURLコンテキストが取得したい場合は、定数を利用します。