この記事では、2024年9月24日にリリースした Ver. 3.1.25 の修正内容について紹介いたします。

現在お困りの問題に該当する項目がありましたら、お早めにバージョンアップのご検討をお願いいたします。

Ver. 3.1.25 リリースノート

修正点

• CMS-6918 Ver. 3.1.23 より子カテゴリーの更新を行うと、親カテゴリーが外れてしまう問題の修正
• CMS-6921 Ver. 3.1.23 よりナビゲーションモジュールで並び替えの不具合が発生する問題の修正
• CMS-6922 Ver. 3.1.23 より、エントリー一覧のカテゴリー選択UIでSafariのクレジットカードの自動入力機能が動作してしまう問題の修正

CMS-6918 Ver. 3.1.23 より子カテゴリーの更新を行うと、親カテゴリーが外れてしまう問題の修正

Ver. 3.2.23 より子カテゴリーの更新を行うと、親カテゴリーが外れてしまう問題の修正を行いました。

Ver. 3.1.23 で子カテゴリーを編集し更新すると、上記画像のとおり、親カテゴリーが外れてしまっておりました。

Ver. 3.1.23 よりナビゲーションモジュールで並び替えの不具合が発生する問題の修正

Ver. 3.1.23 より、ナビゲーションモジュールで、子階層のナビゲーションを並び替えしようとしても、できない場合がある問題が発生しておりました。

CMS-6922 Ver. 3.1.23 より、エントリー一覧のカテゴリー選択UIでSafariのクレジットカードの自動入力機能が動作してしまう問題の修正

上記画像のように、Safari で、エントリー一覧のカテゴリー選択UIからカテゴリーを検索しようとすると、クレジットカードの自動入力機能が動作してしまっておりました。

最後に

該当する問題がありましたら、お早めにバージョンアップのご検討をお願いいたします。
また、迅速にご報告いただいたユーザーの皆さま、誠にありがとうございました。

今後もご報告いただいた内容に対して真摯に受け止め修正と改善を行ってまいります。
今後ともどうぞよろしくお願いいたします。

a-blog cmsでは、JavaScriptなどのコンテンツが表示領域に入った瞬間に読み込み、遅延ロードするための機能が用意されています。（Ver. 2.11.0より）

HTML要素に本来指定すべき属性をdata属性として指定しておき、表示領域に入ったら data- の接頭辞をはずして本来の属性として遅延ロードさせる組み込みJSです。 利用することによって、外部の埋め込みコードによるページの表示速度の問題を改善することができます。

例えば、以下のようなコードがあったとします。

<div class="js-lazy-contents" data-type="script" data-src="http://example.com/example.js" data-charset="utf-8"></div>

これが、表示領域に入ると、以下に変更されます。

<div class="js-lazy-contents" data-type="script" data-src="http://example.com/example.js" data-charset="utf-8" data-executed="1">
  <script src="http://example.com/example.js" charset="utf-8"></script>
</div>

このように、data-type 属性がタグ名として、残りのdata属性はdata-を除いた属性として新たに挿入されます。

例えばTwitterウィジェットなどのコンテンツはパフォーマンスに大きく影響するので、以下のようなHTMLで遅延ロードします。

<a class="twitter-timeline" href="https://twitter.com/TwitterDev/timelines/539487832448843776?ref_src=twsrc%5Etfw">National Park Tweets - Curated tweets by TwitterDev</a>
<div data-type="script" data-src="https://platform.twitter.com/widgets.js" data-charset="utf-8" class="js-lazy-contents">

使い方

js-lazy-contents というclass属性を適用し、data-type 属性に追加したいHTML要素、 data-* 属性に、dataを取り除いた属性を指定（ data-src 属性の場合は src 属性）します。

<div class="js-lazy-contents" data-type="script" data-src="http://example.com/example.js" data-charset="utf-8"></div>

デフォルトの設定

この機能の設定は、/js/config.jsの以下の箇所にあります。

lazyContentsMark: '.js-lazy-contents',

設定のカスタマイズ

config.jsのデフォルトの設定から設定を変更する場合は、適用しているテーマ内にJavaScriptファイルを別途作成し以下のように記述してください。詳しくは「組み込みJSについて：設定を編集する」を参照してください。

ACMS.Ready(function(){
  lazyLoadMark = '.js-lazy-contents',
});