post include から htmx へ ― 2026 年版 a-blog cms における 部分更新のベストプラクティス
※本記事は、旧記事「post_include を次のレベルへ！ a-blog cms における htmx の活用法！」を、a-blog cms Ver. 3.2 以降の仕様に合わせて更新したものです。
2026 年、なぜ「 post include → htmx 」なのか
a-blog cms には、長年「 post include 」という部分更新の仕組みがあり、フォーム送信結果をページ遷移なしで差し替える用途で活用されてきました。
一方で、2025年9月にリリースされた a-blog cms Ver. 3.2 では、上位互換の位置付けとして htmx が「組み込み JS」に標準搭載されました。これにより、従来の「 post include 」は Ver. 3.2 から 非推奨 とされ、代替として htmx の利用が推奨されています。
ポイントは 2 つです。
htmx が「標準搭載」されたため、導入のハードルがほぼゼロになった
POST 限定の発想から脱却し、 GET を含む多様な UI を、HTML 属性中心で素直に組み立てられる
Ver. 3.2 からは「 htmx を読み込む設定」が基本的に不要
旧記事（2024 年版）では、 htm を使うために <head> で CDN から読み込む例を掲載していました。しかし Ver. 3.2 では、組み込み JS に htmx が含まれるため、HTML に hx-get や hx-post などの属性を書くだけで動作します（通常は事前設定不要）。
補足として、JavaScript で後から動的に hx- 属性を付与する等で「読み込みタイミングが不安定になる」ケースでは、事前に次の <meta> を入れて対応できます。
<meta name="acms-htmx" content="enable">
まず押さえる： post include の典型パターン（旧）
旧来の「 post include 」は、class="js-post_include" を付けたフォームをトリガーに、結果差し替えを行う設計が中心でした。
<form action="" method="POST" class="js-post_include" target="#result">
<input type="text" name="keyword" value="">
<input type="hidden" name="tpl" value="result.html">
<input type="submit" name="ACMS_POST_2GET_Ajax" value="検索">
</form>
<div id="result">検索結果が表示されるエリア</div>この仕組み自体は、今も「動く」ケースが多いものの、Ver. 3.2 以降は 非推奨 です。これから新規に作るなら、 htmx を前提に寄せておくのが安全です。
置き換え例 1：フォーム（検索）を htmx で書く
「 post include のフォーム」を、 htmx の属性に置き換えると、考え方がより一般化します。旧記事でも「置き換え例」を紹介していましたが、2026 年版では「標準搭載」を前提に、よりシンプルに扱えます。
<form
method="POST"
hx-post=""
hx-target="#result"
hx-swap="outerHTML"
>
<input type="text" name="keyword" value="">
<input type="hidden" name="tpl" value="result.html">
<button type="submit">検索</button>
</form>
<div id="result">検索結果が表示されるエリア</div>hx-post：送信先（サーバー側は HTML フラグメントを返す）hx-target：差し替える領域hx-swap：差し替え方式（例ではouterHTML）
置き換え例 2：リンク（ GET ）で部分更新する
post include では「リンクから部分更新」はやりづらい（または実装が遠回り）でしたが、 htmx はリンクに hx-get を付けるだけで自然に書けます。
<a href="result.html" hx-get="result.html" hx-target="#result" hx-swap="outerHTML">
クリックして差し替え
</a>
<div id="result">ここが更新されます</div>この「リンクでもフォームでも同じ思想で書ける」点が、移行する価値のひとつです。
htmx の設定を追加する
標準の設定は js/config.js に設定されていますが、そこに設定を追加する際には、以下のような設定を追加します。この場合には、View Transition API を有効にする設定です。
<script>
ACMS.Ready(function() {
ACMS.Config.htmxConfig.globalViewTransitions = true;
});
</script>まとめ：2026 年の「部分更新」は htmx を主語にする
ここまでの整理を踏まえ、2026 年時点での a-blog cms における「部分更新」の考え方を、あらためて要点としてまとめます。
a-blog cms Ver. 3.2 から htmx は、組み込みJS として 標準搭載
その結果、 post include は Ver. 3.2 より 非推奨 、代替は htmx 推奨
フォームもリンクも同じ考え方で「HTML 属性中心」に組み立てられるのが強み
旧来の post include に慣れているほど、移行はスムーズです。まずは「検索フォーム」や「もっと見る」など、差し替えポイントが明確な箇所から htmx 化していくのがおすすめです。
