改善・修正した変更点

Ver. 3.2 ではPHP 8.4 対応をはじめとするプラットフォーム対応の更新、管理画面やパフォーマンスの改善、アクセシビリティ対応の強化など、多くの機能追加・修正が行われました。

対応PHPバージョンの変更

対応PHPバージョンが、PHP8.1.0 〜 PHP8.4.x に変更されました。 a-blog cms Ver. 3.1.x は PHP7.3まで対応していましたので、アップデート時はお気をつけください。

エントリ編集画面を改善

ToDo: 改善内容を追加

エントリー管理画面の UI をリニューアル

エントリー管理画面
エントリー管理画面

ToDo: 改善内容を追加

モジュール管理画面の UI をリニューアル

モジュール管理画面
モジュール管理画面

ToDo: 改善内容を追加

メイン画像にカスタムフィールドを設定できるように改善

Ver. 3.2 では、エントリーのメイン画像に メディアカスタムフィールドを利用できるようになりました。

これにより、従来のように「画像ユニット」や「メディアユニット」のみでしかメイン画像を指定できなかった制約が解消され、より柔軟なメイン画像管理が可能になります。

メイン画像を出力できるモジュール

以下のモジュールで、メイン画像の出力元（ユニット or カスタムフィールド）を選択できる設定が追加されています。

  • Entry_Summary

  • Entry_Body

  • Entry_GeoList

  • Entry_TagRelational

  • Category_EntrySummary

  • V2_Entry_Summary

  • V2_Entry_Body

  • V2_Entry_GeoList

  • V2_Entry_TagRelational

  • V2_Category_Entry_Summary

モジュールの設定方法

各モジュールの設定画面に「メイン画像の出力元」を選択する項目が追加されています。

ユニット or カスタムフィールドを選択します。
メインイメージ対象設定画面

メイン画像の出力元を選択

選択肢

説明

ユニット

従来通り、画像・メディアユニットからメイン画像を取得します

カスタムフィールド

指定したメディアカスタムフィールドからメイン画像を取得します。（対象フィールドは、カスタムフィールド選択肢横のテキスト入力欄でフィールド名を設定）

※ フィールド名を空にした場合は、デフォルトのカスタムフィールド（例：entry_main_image など）が自動的に使用されます。（後述）

カスタムフィールドが選択されている場合でも、該当するメディア画像が存在しない場合は、従来通りのユニットからのメイン画像出力に自動的にフォールバックします。

デフォルトのメイン画像カスタムフィールド設定

メイン画像用のカスタムフィールド名を明示的に設定しなくても動作する「デフォルトのフィールド名」が用意されています。

各モジュールの設定でフィールド名を空欄にしても、あらかじめ決められたデフォルトのカスタムフィールド名を使用することで、自動的にメイン画像として認識・出力されます。

デフォルトのメイン画面カスタムフィールド名の変更

private/config.system.yaml で変更が可能です。

main_image_field_name: entry_main_image # エントリーのメイン画像のフィールド名を設定します。

デフォルトのカスタムフィールド名を使用するメリット

  • 各モジュールでフィールド名の設定が不要

  • エントリー管理画面（エントリー一覧）で、メイン画像として出力できる

  • 関連エントリーの設定画面でサムネイル画像として出力できる

メイン画像用のメディアカスタムフィールドを使用する場合は、フィールド名に entry_main_image を使用することを推奨します。これにより、CMS全体で一貫した動作と表示が可能になります。

WebP画像をそのままアップロードできるように改善

従来バージョンはWebP画像をそのままアップロードできませんでしたが、Ver. 3.2 では、WebP画像のままアップロードできるようになりました。

＊ 画像エンジン（ImageMagic / GD）がWebPに対応している必要があります。

メディア機能でHEIC画像のJPEG変更に対応

iPhoneなどで撮影された写真に多く採用されている HEIC形式（High Efficiency Image File Format） の画像のJPEG画像変換に対応しました。HEIC画像をアップロードした際に自動でJPEG形式に変換してアップロードするようになります。

メディア機能の代替テキストに改行が使えるように

これまで代替テキスト（alt属性）には1行のみの入力が想定されていましたが、改行を含む複数行のテキストが登録・表示できるようになりました。

メディアの代替テキストが改行できるように
メディアの代替テキストが改行できるように

メディア一覧の検索条件に「自分のメディアのみ表示」を追加、またファイル名検索をキーワード検索に変更

メディア管理で「自分のメディアのみ表示」する検索オプションを追加しました。これにより、ログインしているユーザーがアップロードしたメディアのみに絞り込みができますた。

また従来ファイル名でしか検索できなかったのを、ファイル名・キャプション・代替テキスト・メモ内容からキーワードで検索できるようになりました。

メディア管理画面
メディア管理画面

カスタムユニットのデータがテキスト置換の対象外になる問題を修正（シリアライズせずに保存するよう改善）

従来は、カスタムユニットのデータをシリアライズして保存していたため、テキスト置換に対応できず、不便な状態となっていました。

本バージョンでは、シリアライズによる保存を廃止し、カスタムフィールドと同様の形式で保存するように改善されたことで、テキスト置換に対応可能となりました。

テキスト置換画面で対象にカスタムユニットが追加された
テキスト置換ができるように

またカスタムフィールド同様、キーワード検索のワードに含めるかどうかの設定も可能となりました。

<input type="text" name="product_amount{id}" value="{product_amount}" />
<input type="hidden" name="product_amount{id}:search" value="0" /> <!-- キーワード検索でヒットしないように設定 -->
<input type="hidden" name="unit{id}[]" value="product_amount{id}" />

従来データについて

アップデート前に作成されたカスタムユニットのデータは、シリアライズされた形式で保存されていますが、CMSのバージョンアップ時に、自動的に新しい保存方式（配列形式）へと移行されます。

ログインユーザーの最終アクセス時間を、ダッシュボードおよびユーザー・会員一覧で確認可能に

従来は、ダッシュボードでログイン日時を確認することはできましたが、あくまで「ログインした瞬間」の情報であり、その後の最終アクセス日時までは把握できない状態でした。

今回の改善により、最終アクセス日時に加え、接続元のIPアドレスや User-Agent も確認できるようになりました。

管理画面 > ダッシュボード のログイン履歴から確認できます。

ダッシュボードからログイン履歴画面に移動できます。
ログイン履歴画面

会員ログインに有効・無効のオプションを追加

従来は、会員機能を利用していない場合でも、サインイン画面やパスワードリセット画面が表示され、会員登録はできないが、ページが表示される状態となっていました。
（※会員登録自体は無効のため、実際には使うことのない不要な機能です）

このような状態はセキュリティ上も望ましくないため、本バージョンでは、ログインやパスワードリセット機能を会員機能を利用しない場合は、無効化できるオプションを追加しました。

設定は管理画面 > コンフィグ > ログイン設定 で行えます。

ログイン設定画面で設定できます。
ログイン設定画面

表側のエントリー編集画面を廃止し、同様の編集機能を管理画面内に移設

従来は、エントリー編集を行う際、

  • 管理画面側の編集画面

  • 表側の実装テーマ内で提供される編集画面

のいずれかを使用できるようになっていました。

しかし、表側の編集画面はテンプレートの Entry_Body 内に編集テンプレートをインクルードする必要があり、テーマごとにテンプレートの対応が必要でした。

このため、本バージョンより、表側の編集画面は廃止され、管理画面側のシステムテンプレートで管理するようになりました。編集画面の見た目は変わりますが挙動は従来通りになります。

新しい編集画面
新しい編集画面

カスタムフィールドメーカを改善

カスタムフィールドの設定をより柔軟に行えるよう、カスタムフィールドメーカーに以下の改善を行いました。

テキスト入力欄のタイプ属性を拡充

従来の「text」に加え、以下のHTML5入力タイプを選択できるようになりました：

  • tel（電話番号）

  • number（数値）

  • email（メールアドレス） など

これにより、スマートフォンなどでの入力支援（数字キーボード表示など）が期待できます。

プレースホルダーの設定に対応

各入力欄に任意のプレースホルダー（例：入力例や説明）を設定できるようになりました。

HTMLレイアウトタイプの選択オプションを追加

フィールド出力時のHTMLレイアウト方式として、以下から選択できるようになりました：

  • 従来タイプ（tableレイアウト）

  • モダンタイプ（div＋グリッドCSSレイアウト）

「モダン」タイプを選択すると、生成されるHTMLが <div> ベースの構造となり、CSSグリッドにより柔軟なレイアウト調整が可能になります。レスポンシブ対応やデザイン調整がしやすくなるのが特徴です。

テーブルレイアウトか、divによるレイアウトを選択可能に。
生成されるHTMLタイプを選択

シンタックスハイライト用のライブラリを Google Code Prettify から highlight.js に変更

組み込みJSのシンタックスハイライター「Google Code Prettify」を廃止し「highlight.js」を導入しました。

初期設定が js/config.js で設定されています。

// Syntax Highlighter
highlightMark: 'pre',
highlightConfig: {
  theme: 'atom-one-light', // テーマを指定（https://highlightjs.org/examples を参照）
  languages: ['bash', 'css', 'javascript', 'json', 'php', 'sql', 'typescript', 'xml', 'yaml', 'twig'], // ハイライトする言語を指定（https://highlightjs.org/download を参照）
},

設定例

<script>
ACMS.Ready(() => {
  ACMS.Config.highlightConfig.theme = 'atom-one-dark';
});
</script>
シンタックスハイライトについて詳しく見る

組み込みJSのバリデーターをアクセシビリティ対応

ToDo: 改善内容を追加

ACMS.addListener 使用時に、event.detail でカスタムイベントのデータを取得できるように

従来、ACMS.addListener に登録したコールバック関数では、イベントオブジェクトの event.obj プロパティを使ってカスタムデータを受け取る仕様となっていました。

ACMS.addListener('custom-event', function (event) {
  const data = event.obj; // カスタムデータ
});

本バージョンから、標準的な Web API の仕様に則り、event.detail でも同様のデータが取得可能になりました。

ACMS.addListener('custom-event', function (event) {
  const data = event.detail; // より標準的な取得方法
});

API機能で新しいV2モジュールに対応

API機能が新しいV2モジュールに対応しました。V2モジュールによるAPI出力は、従来のAPIに比べて格段にわかりやすいレスポンスとなっており、より扱いやすくなっています。

設定は、管理画面 > コンフィグ設定 > API設定 から行えます。

API設定画面
API設定画面

エンドポイント

https://example.com/api/v2/モジュールID名/