M-Blog

1.静的ページと動的ページを共存させる

こんなときに

  • ホームページの一部のページはMODXを使って出力したい
  • 一部のページはほとんど更新しないから静的ページで出力したい
  • 既存のHTMLから徐々にMODXに移行したい

手順

1.HTMLファイルを用意する

静的ページで出力したいHTMLファイルを用意します。MODXで作成しているページの場合はエクスポート機能を使います(出力先:temp/backup/)。1.0.15J以降からは出力したいリソースを個別にエクスポートできるようになりました。作成する場合の文字コードはutf-8が望ましいでしょう。(Shift-JISなどの場合はMODXのインストールされたディレクトリにアップロードすることで文字化けの可能性を低くできるようです。)

一部MODXタグが使用可能です。使用可能なタグであればモディファイアも機能します。

使用可使用不可
{{チャンク名}} [*リソース変数*]
[[スニペット名]] [*リソース変数@リソースID*]
[(コンフィグ変数)] [^ベンチマーク^]
[~リソースID~]
[+プレースホルダ+]
[+@直接記述+ ]
[*pagetitle@8*] //機能しない
[+@8:pagetitle+] //機能する

HTMLファイルの例

<!doctype html>
<html lang="ja">
<head>
  <base href="[(site_url)]">
  <meta charset="[(modx_charset)]">
</head>
<body>{{header-image}}
  <h1>NEWS</h1>
<ul> [[Ditto? &parents=`2` &display=`5` &tpl=`@CODE:<li><a href="[~[+id+]~]">[+pagetitle+]</a></li>` ]]
</ul> </body> </html>

2.HTMLファイルのアップロード

HTMLファイルが用意できたらサーバーにアップロードします。

アップロード先は「temp/public_html」以下になります。ディレクトリ構造そのままアップロードします。

HTMLファイルの他にも出力に対応したファイルがあります。

HTML *.html,*.htm
XML *.xml,*.rdf
CSS *.css
Javascript *.js
TEXT *.txt
画像(ページとして処理されるため表示はされない) *.ico,*.jpg,*.jpeg,*.png,*.gif

アップロード後はMODXで作成したリソースよりも優先して出力されるようになります。MODXのリソースにもtemp/public_html/以下にもページがない場合はエラーページにリダイレクトされます。ページ表示の優先順位は以下のようです。

  1. MODXをインストールしたディレクトリ
  2. 「temp/public_html」以下
  3. MODXで作成したリソース

3.画像対策

同じディレクトリ構造で作業をするためにプラグインを作成します。下記をコピーしてプラグインコードに直接貼り付けて保存。TinyMCEから参照できるようにするならcontent/imagesディレクトリにアップロード。

/**
* Change Image Path
*
* 古い画像ディレクトリのパスをリソース描写直前に変更
*
* @internal @events OnWebPagePrerender
*/
$old_imageDir = 'path/to/dir/'; //旧画像ディレクトリのパス
$new_imageDir = $modx->config['site_url'].'temp/public_html/'.$old_imageDir; //新画像ディレクトリのパス

$modx->documentOutput = str_replace($old_imageDir, $new_imageDir, $modx->documentOutput);

以上、動的ページと静的ページを簡単に共存させることができます。次回はテンプレート変数で@Bindingsの使い方です。

© 2015 - 2019 M-Blog. Powered by MODX.

(URL:https://modx.mblo.info/,E-mail:info@mblo.info)

ブログについて
MODX Evolutionを使ってブログをしています。基本的にはまとめ、チートシートのメモなど、他にも日常のことをぼちぼち書いています。

コンテンツ
ブログ
MODXまとめ
MODXチートシート

動作環境
このブログはで運用しています。
・Apache 2.2.31
・OS Free BSD
・PHP 7.1.28
・MySQL 5.5.38
・MODX 1.0.22J-beta1

ブログ更新通知
RSS | ATOM

まとめ更新通知
RSS | ATOM

フィードバック

お問い合わせ
Twitter