SSLへの書き換え

世の中に常時SSLのサイトが普及したことから、現在この機能は非推奨としています(2021年11月現在)

Ver. 2.11.38 でデフォルトではこの機能はオフになりました。

a-blog cmsでは、httpとhttpsのリンクを自動で書き換える機能が実装されています。(Ver.1.4.0より利用可能)

概要

お問い合わせフォームなどを設置していて一部httpsで運用したいページがある場合に、相対パスでリンクしているナビゲーションのリンク先を任意にhttpからhttpsまたはhttpsからhttpへ自動で変換する機能です。

動作しない条件

  • config.server.phpのFULLTIME_SSL_ENABLEが"1"の場合(※すべてがSSL/TLSリンクになるため機能が無効になります)。
  • 相対パスではなく、絶対パスで指定している場合
  • linkHttpsNoRewriteMarkに設定したセレクター(デフォルトでは.js-link_no_rewrite)が指定されている場合

設定について

この機能の設定は、/js/config.jsの以下の箇所にあります。設定を変更する場合は、適用しているテーマ内にJavaScriptファイルを別途作成してください。
詳しくは「組み込みJSについて:設定を編集する」を参照してください。

config.jsの記述

//------------------------------
  // link https disabler, enabler
  // 暗号化を利用したhttps通信時に通常のリンクがhttps://になってしまうものをhttp://に書き換えます。
  linkHttpsDisablerMark: 'off', // 'a:not([rel*="https"]),a:not([data-rel*="https"])',
  // a:not([rel*="https"]) というセレクタが設定されている場合はrel属性に"https"と指定されているリンクは書き換えを行わずにhttps://のままになります。
  linkHttpsEnablerMark: 'off', // 'a[rel*="https"],a[data-rel*="https"]',
  // 通常のhttp通信時にセレクタに該当するアンカーをhttps://から始まるURLに書き換えます。
  linkHttpsNoRewriteMark: '.js-link_no_rewrite',

それぞれの機能の解説


linkHttpsDisablerMark : 'a:not([rel*="https"]),a:not([data-rel*="https"])' https から始まるURのページを開き、ページ内で使用されているa要素のrel属性またはdata-rel属性ににhttpsという文字列が含まれていない場合、そのリンクはhttpから始まるリンクとなります
linkHttpsEnablerMark : 'a[rel*="https"],a[data-rel*="https"]a[rel*="https"]' httpから始まるURのページを開き、ページ内で使用されているa要素のrel属性またはdata-rel属性にhttpsという文字列が含まれている場合、そのリンクはhttpsから始まるリンクとなります。
linkHttpsNoRewriteMark : '.js-link_no_rewrite' このセレクターがついた要素はURLの書き換えをおこないません。

使い方

JavaScript

Ver. 2.11.38でデフォルトはオフになったため、ご利用いただくためにはconfig.jsの内容をテンプレートから上書きする必要があります。

<script>
  ACMS.Ready(function() {
    ACMS.Config.linkHttpsDisablerMark = 'a:not([rel*="https"]),a:not([data-rel*="https"])';
    ACMS.Config.linkHttpsEnablerMark = 'a[rel*="https"],a[data-rel*="https"]';
    ACMS.Config.linkHttpsNoRewriteMark = '.js-link_no_rewrite';
  });
</script>

HTML

<a href="/contact/" rel="https">お問い合わせフォームへ</a>

Ver. 3.1.25 リリースのお知らせ


この記事では、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のクレジットカードの自動入力機能が動作してしまう問題の修正


エントリー一覧のカテゴリー選択UIでSafariのクレジットカードの自動入力機能が動作してしまう

エントリー一覧のカテゴリー選択UIでSafariのクレジットカードの自動入力機能が動作してしまう

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


最後に

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

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

JavaScriptのコンテンツの遅延読み込み

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',
});