ポストインクルードの基本設定
ここでは、組み込みJavaScriptの「post include」機能の基本設定について説明します。post include機能は、フォームでpost(送信)した結果を、ページのリロードなしで表示する機能です。
config.js内の設定
/js/config.jsの以下の箇所に設定内容が記載されています。
//-------------- // post include postIncludeOnsubmitMark : '.js-post_include', postIncludeOnreadyMark : '.js-post_include-ready', postIncludeOnBottomMark : '.js-post_include-bottom', postIncludeOnIntervalMark : '.js-post_include-interval', postIncludeMethod : 'replace', // ( 'swap' | 'replace' ) postIncludeEffect : 'slide', // ( 'slide' | 'fade' | '' ) postIncludeEffectSpeed : 'slow', // ( 'slow' | 'fast' ) postIncludeOffset : 60, postIncludeReadyDelay : 0, postIncludeIntervalTime : 20000, postIncludeArray : [{ // 'mark' : '.js-post_include-original', // 'type' : 'submit', // 'method' : 'swap', // 'effect' : 'slide', // 'speed' : 'slow' }], postIncludeEvalValueMark : '.js-post_include-eval_value',
postIncludeOnsubmitMark | ここで指定したセレクタのフォームは、送信ボタンを押した後に結果を表示します。「.js-post_include」の場合は、class="js-post_include" が付与されているform要素に適用されます。 |
---|---|
postIncludeOnreadyMark | ここで指定したセレクタのフォームは、送信ボタンを押さなくてもページを読み込んだら自働的に送信されて結果を表示します。「.js-post_include-ready」の場合は、class="js-post_include-ready" が付与されているform要素に適用されます。 |
postIncludeMethod | swap:target属性で指定した場所の「中身」を置き換える / replace:target属性で指定した場所「自体」を置き換える |
postIncludeEffect | slide:スライド表示 / fade:フェード表示 / 指定なし:エフェクトなし |
postIncludeEffectSpeed | postIncludeEffectでエフェクトが指定されている時のみ有効になります。 slow:ゆっくり表示 / fast:早く表示 |
postIncludeOffset | js-include_bottomで読み込み時の下部からの読み込み開始位置になります。 |
postIncludeReadyDelay | js-include_readyで読み込み時の読み込み開始時間を遅くする設定になります |
postIncludeIntervalTime | js-post_include-intervalで読み込み時の更新頻度をミリ秒で設定します。 |
postIncludeArray | 配列として複数の設定を記述できます。同じページ内で複数の設定を併用したい場合などに利用します。 |
postIncludeEvalValueMark | JavaScriptのコードを変換する場合に使用します。フォームが送信されたタイミングでJavaScriptのコードを変換し、送信結果の表示を更新します。 例)<input type="hidden" name="keyword" value="ACMS.Config.searchEngineKeyword" class="js-post_include-eval_value" /> |
設定内容を変更するには
この機能の設定は、/js/config.jsの以下の箇所にあります。設定を変更する場合は、適用しているテーマ内にJavaScriptファイルを別途作成してください。詳しくは「組み込みJSについて」を参照してください。
Ver. 2.8.0よりpostIncludeEvalValueMarkの設定ではキャッシュさせないポストインクルードが動作しなくなりました。詳しい実装方法については「post includeの結果をキャッシュさせない方法」の代替案をご覧ください。(2020年11月19日)
Ver. 2.11.25よりデフォルトの設定だと tplコンテキストが無効になりました。ポストインクルードを利用する際には ポストインクルードの準備 をご覧ください。(2021年6月16日)