2011年10月07日(金)

MODX(Evolution)のテンプレート変更方法

MODXのテンプレート(テーマ)変更の手順をまとめました。

ワードプレスのようにファイル一式をまとめてアップロードして変更する方法ではなく、「テンプレートを編集する」ような感覚の作業内容となります。
ワードプレスに慣れていると、最初は少し違和感や使いにくさを感じることがあるかもしれませんが、理解できると便利だと感じる事が多いです。

MODXは人気の高いCMSの1つで、主にブログというよりウェブサイトに適したCMSです。
詳しい内容とインストール方法はこちらの記事「MODX(Evolution)のインストール手順まとめ」をご覧下さい。

まずはMODX用のテンプレートを探して、ダウンロード&解凍しておきます。

次にMODXの管理画面に行き、上に表示されているタブメニューの「エレメント」中にある「エレメント管理」に進みます。

MODXのテンプレート変更手順 その1

それぞれの項目を入力します。

テンプレート名:
テンプレート名でもいいですし、半角英数字でお好きに名前をつけてOK。今回はtestと名前をつけました。
説明:
自分用のメモみたいな感じで、何か説明を書いておきます。
既存のカテゴリー:
このテンプレートのカテゴリを決めます。どこに所属させるか選ぶだけのものなので、わからない・迷う場合はContentでいいかと思います。
カテゴリー作成:
任意の名前でカテゴリを作成できます。今回は作らないので空欄にします。

そして『 テンプレート コード (html)』には、先ほど解凍したファイル内にあるhtmlコードのファイルを開いて内容をコピーし、貼り付けます。

MODXのテンプレート変更手順 その2

htmlコードのファイル名は、テンプレートによって違うのでなんともいえませんが「template.txt」とか「テンプレート名.txt」などの名前になっているかと思います。

また、拡張子もテンプレートごとに違うので「.txt」の場合もあれば「.html」の場合もあります。htmlファイルの場合は、テキストエディタで開いてから内容をコピーします。

MODXのテンプレート変更手順 その3

保存が完了すると、エレメントには先ほど「test」の名前を付けたテンプレートが追加されているはずです。

次は管理画面から離れて、FTPを使います。

MODXがインストールされているフォルダに進み、『/assets/templates』フォルダに、上の作業で登録したテンプレート名のフォルダを作ります。

今回は上で「test」という名前をつけたので、『/assets/templates/test/』となります。

作成したフォルダの中に、先ほど管理画面で貼り付けしたテンプレートファイル以外のフォルダ&ファイルを丸ごとアップロードします。

例えば僕の環境では「test.txt」と「css」フォルダ「img」フォルダがあったので、testフォルダにcssとimgフォルダを中身ごとアップしました。

以上の作業で、テンプレートの登録が完了し、使える状態になりました。

ワードプレスや他のCMSはこれですべてのページにこのテンプレートを適応させる事ができますが、MODXは他とは概念というか使い方が違っており、登録したテンプレートを各ページごとに選択して使う事になります。

「管理画面から変更」する方法と、「各ページの編集から変更」する方法の2つありますので、下の画像を参照して下さい。

MODXのテンプレート変更手順 その4

管理画面から変更する場合は、左メニューからページを選択し、「使用テンプレート」の項目で選び保存ボタンを押します。

各ページで変更する場合は、MODXにログインした状態で画面上の方にマウスを持っていくと、画像のような編集へのリンクが出現するので「編集する」に進みます。

MODXのテンプレート変更手順 その5
ページ編集画面がポップアップで表示されるので、「使用テンプレート」を選び保存ボタンを押します。

MODXのテンプレート変更手順 その6

このエントリーをはてなブックマークに追加
はてなブックマーク - MODX(Evolution)のテンプレート変更方法
[`yahoo` not found]
[`yahoo_users` not found]
[`evernote` not found]

コメントを残す

*」は入力必須項目


  • © 2010-2018 試行錯誤 All Rights Reserved.