Ver.2.5以上 へのアップデート
2.0.x と 2.1.x の環境から現在のバージョンでは、細かい変更も色々ありますが大きく以下の変更が必要になります。
- acms-admin.css の追加
- index.js から acms.js に変更
- acms.js の前に jQuery の読み込み
- ioncubeエンコーダーのバージョンアップ
Ver. 2.0.x または Ver. 2.1.x からアップデートする場合
【必須】acms-admin.css の追加
acms.css で使用しているメディアクエリーがモバイルファーストな書き方に変更された為、システムで利用している CSS を acms- admin.css に変更しました。acms.css についてはそのまま残して、ご利用のテーマに以下のコードを追記してください。
<link href="/css/acms-admin.min.css" rel="stylesheet" type="text/css" media="all">
acms- からはじまる今までのクラス名を変更しない場合は、使用していた旧バージョンの acms.cssはそのままご利用く ださい。また旧バージョンのacms.cssをご利用する場合は旧バージョンの/system/fonts/ディレクトリをご利用の テーマに移動をお願いします。
【必須】index.js から acms.js にファイル名変更
Ver. 2.5.0 以前では、組み込みJS を読み込む為に index.js を読み込んでいましたが、Ver2.5.0 より acms.js にファイル名が変更になりました。以下のようにリンクを修正をしてください。
<!-- BEGIN_MODULE Js -->
<script src="/acms.js{arguments}" charset="UTF-8" id="acms-js"></script><!-- END_MODULE Js -->
【必須】 jQuery の読み込み
組み込み JS が非同期で読み込まれるようになった事により、jQuery が読み込まれる前に、jQuery プラグインや組み込み JS のカスタマイズが動いてしまいエラーが出てしまいます。 そこで、jQuery が同期的に読まれるように以下の対策をお願いします。
対策1
jQuery を acms.js から読み込む事をやめ、テンプレートから直接 jQuery をロードします。
以前のバージョンでは組み込み JS の jQuery とバッティングしてエラーを出していましたが、Ver2.5.0 からテンプレー トから読み込んでいる jQuery を優先して読み込むようになりました。こうする事により、同期的にjQueryが読み込ま れますので、エラーを回避する事が出来ます。かならず、acms.js の前で読み込むようにしてください。
<script src="%{JS_LIB_JQUERY_DIR}jquery-%{JS_LIB_JQUERY_DIR_VERSION}.min.js" charset="UTF-8"></script>
<!-- BEGIN_MODULE Js -->
<script src="/acms.js{arguments}" charset="UTF-8" id="acms-js"></script><!-- END_MODULE Js -->
対策2
またテンプレートで config.js の値を書き換えている場合は、以下のように対応をお願いします。
ACMS.Ready(function() {
ACMS.Config.toggleMark = ‘toggleMark2’; // 例
});
【任意】カスタムユニットを利用されている場合
インクルード先が変更になっております。
- /include/unit.html に設置してある /include/custom-unit.html が /include/unit/custom.html に変更。
- /admin/entry/unit.html に設置してある /admin/entry/custom-unit.html が /admin/entry/unit/custom.html に変更
【任意】Entry_Summary で tag を出力している場合
Ver2.5.0よりEntry_Summaryモジュールのタグループ内のglueブロック名が glue から tagGlue に変更されました。ご利用の場合は変更して下さい。
Feed_Rss2モジュールでフィールドによる絞り込みを行っている場合
ver2.5.0 以前は Feed_Rss2 モジュールで「モジュールIDの条件設定」でフィールドが設定できるようになっており、エントリーのカスタムフィールドで絞り込めるようになっていたが、 ver2.5.0以降では、ここの設定がなくなり、「モジュールの表示設定」にこの設定が移動しました。
モジュールの条件設定にあった絞り込み条件をモジュールの表示設定のエントリフィルタに設定してください。
【任意】システムテーマのオフキャンバスを利用している場合
Ver. 2.5.0 以前は、システムテーマにあるオフキャンバスのJSとCSSをテーマでも利用していましたが、Ver. 2.5.0 でなくなり、組み込みJSへと変更されました。 デフォルトテーマ(site2014など)ベースでカスタマイズしている場合は、このオフキャンバスを利用している可能性が高いので以下対応をお願いします。
アップデート時にいらなくなったscriptタグをHTML上から削除する
以下の記述が不要になります。
<!-- offcanvasに利用されていたmodernizr.jsの記述 -->
<!-- site2014テーマでは js.htmlに記述されている -->
<script src="/js/off-canvas/modernizr.js"></script>
<!-- offcanvasに利用されていたoff-canvas.cssの記述 -->
<!-- site2014テーマでは link.htmlに記述されている -->
<link rel="stylesheet" href="/css/off-canvas/off-canvas.css">
<!-- offcanvasに利用されていたmain.jsの記述 -->
<!-- site2014テーマでは footer.htmlに記述されている -->
<script src="/js/off-canvas/main.js"></script>
組み込みJSを適応させるために該当部分にクラスを付与する
オフキャンバスメニューに収めたいエリアを「js-offcanvas」でくくるだけなので、特にHTMLの構造を気にする必要はありません。ただ、画面幅がbreakpointで指定した値よりも数値が小さい場合はoffcanvasMarkでくくられたHTMLが画面上に表示されなくなるので注意してください。 オフキャンバスメニューを使用したHTMLの構造は例えば以下のようになります。
<ul class="js-offcanvas" id="offcanvas">
<li><a href="#">メニュー</a></li>
<li><a href="#">メニュー</a></li>
<li><a href="#">メニュー</a></li>
<li><a href="#">メニュー</a></li>
</ul>
<a class="js-offcanvas-btn js-offcanvas-btn-r" href="#offcanvas">メニューを表示</a>
site2014テーマの場合は、id="nav"と振られた要素があるのでその要素に対して「js-offcanvas」というクラスを付与します。
<div id="nav" class="js-offcanvas">
...
また、header.htmlにオフキャンバスを開閉するためのボタンが記述されているのでそのボタンに対して「js-offcanvas-btn」というクラスを付与します。 さらにオフキャンバスを右から開閉させたい場合は「js-offcanvas-btn-r」左から開閉させたい場合は「js-offcanvas-btn-l」というクラスを追加します。
<a class="nav-btn acms-btn js-offcanvas-btn js-offcanvas-btn-l" id="nav-open-btn" href="#nav"><i class="acms-icon-sort"></i>メニュー</a>
オフキャンバスメニューを開閉させた時にヘッダーも追随させたい場合はさらにheaderに対して「js-offcanvas-header」というクラスを付与します。
<header id="headWrapper" class="js-offcanvas-header">
...
Ver. 2.0.x からアップデートする場合
ionCube Loader のバージョンアップが必要
Ver. 2.0.x では ioncube エンコーダー Ver. 6.5 を利用していましたが、現在は新しい PHP のバージョンに対応するため ioncube エンコーダー Ver. 9.0 を利用しています。古いバージョンの ioncube Loader では動作させることができませんので新バージョンの ionCube Loader をご利用ください。
ionCube Loader のバージョンアップについては ioncube Loader のインストール をご覧ください。