Movable Type 備忘録

 

 テンプレート・フォー・ユー８

こんにちわ^^

昨日は風は強かったけど、心地いい天気でしたねぇ。
近くの公園でバドミントンなどして久しぶりに体を動かしました♪

さて、これまた久しぶりにテンプレートを作ってみました。
新しく作ったわけではないのですが、以前、わたしが作ったテンプレートでして、ベースのテンプレート変更と共に配布をやめたものです。

個人的にはスッキリしてて気に入ってたテンプレートの1つだったので、リキッドスタイルに変更して復刻させてみました。

テンプレートについて

このテンプレートでは、MovableType備忘録でご紹介した、以下の内容がカスタマイズ済みになってます。

テンプレートの設置について

  1. まずテンプレート一式をダウンロードします。
    以下から圧縮ファイルをダウンロードして適当なフォルダに展開します。
    foryou005-white.zip

  2. 次にCSSやイメージファイル、スクリプトをサーバにアップロードします。
    アップロード先はどこでも構いません。 ここでは以下のようなディレクトリ構成でテンプレート設定の説明を進めていきます。

    http://●●●.com/
 +--- index.html
 +--- styles-site.css
 |
 +--- mt-memo/
      +--- ajax/
      |    +--- ajaxsearch.js
      |    +--- ajaxcomments.js
      |    +--- ajaxcontents.js
      |
      +--- js/
      |    +--- prototype.js
      |    +--- comment_res.js
      |
      +-- base-weblog.css
      +-- 2column-liquid.css
      +-- ajax-loader.gif
      +-- feed-icon.gif

    CSSファイル内の1行目に記述されている文字コード指定を変更してください。

    @charset "utf-8";

    そして、圧縮ファイル中のmt-memo/フォルダをそのままサーバにアップロードします。

  3. 次に、各テンプレートを設置します。
    変更するテンプレートを以下に記します。

    • スタイルシート( styles-site.css )
    • メインページ( index.html OR index.php )
    • エントリー・アーカイブ
    • カテゴリー・アーカイブ
    • 日付アーカイブ
    • コメント・プレビュー
    • コメント・保留
    • コメント・エラー
    • コメントの一覧
    • 検索結果

    まずはスタイルシートから。
    先ほどのディレクトリ構成を元に説明しますので、異なるディレクトリ構成の場合にはその都度読み替えてください。

    @charset "<$MTPublishCharset$>";

@import "mt-memo/base-weblog.css";
@import "mt-memo/2column-liquid.css";

    上記はstyles-site.cssがある場所からの相対パスとなっています。 問題なければそのままコピーして上書きしてしまいます。

  4. 次に、メインページです。
    圧縮ファイル中のtemplate/main_index.tmplをそのままメインページに上書きします。 そして、以下の行について各自の環境に合わせて変更します。

    20行目
<script type='text/javascript' src="<$MTBlogURL$>mt-memo/js/prototype.js"></script>
<script type="text/javascript" src="<$MTBlogURL$>mt-memo/ajax/ajaxsearch.js"></script>

  5. 次にエントリー・アーカイブです。
    圧縮ファイル中のtemplate/individual_entry_archive.tmplをそのままエントリー・アーカイブに上書きします。 そして以下の箇所を各自の環境に合わせて修正します。

    27行目
<script type="text/javascript" src="<$MTBlogURL$>mt-memo/js/prototype.js"></script>
<script type="text/javascript" src="<$MTBlogURL$>mt-memo/js/comment_res.js"></script>
<script type="text/javascript" src="<$MTBlogURL$>mt-memo/ajax/ajaxsearch.js"></script>
<script type="text/javascript" src="<$MTBlogURL$>mt-memo/ajax/ajaxcomments.js"></script>
<script type="text/javascript" src="<$MTBlogURL$>mt-memo/ajax/ajaxcontents.js"></script>
197行目
<img id="progress" style="display:none;" src="<$MTBlogURL$>mt-memo/ajax-loader.gif" alt="Loading..." />

  6. 次に、カテゴリー・アーカイブ、日付アーカイブです。
    圧縮ファイル中のtemplate/category_archive.tmpl、template/datebased_archive.tmplをそれぞれコピーして上書きします。 そして、今までと同様にJavaScriptのパスを各自の環境に合わせて変更します。

  7. 最後に、コメント・プレビュー、コメント・保留、コメント・エラー、コメントの一覧と検索結果をそれぞれ上書きします。

    • template/comment_preview_template.tmpl
      コメント・プレビュー
    • template/comment_pending_template.tmpl
      保留
    • template/comment_error_template.tmpl
      コメント・エラー
    • template/comment_popup_template.tmpl
      コメントの一覧
    • template/search_results_template.tmpl
      検索結果

    以上で各テンプレートの設置は完了です。

  8. 次にブログ検索用のXMLテンプレートを新規作成します。
    以下のコードをコピーして、テンプレートを作成してください。

    作成するファイル名は必ずsearch_data.txtとし、index.htmlと同じ場所に作成してください。

    <?xml version="1.0" encoding="utf8"?>
{
data:[
<MTEntries all="1">{
title:"<$MTEntryTitle remove_html="1" encode_js="1"$>"
,link:"<$MTEntryLink$>"
,body:"<$MTEntryBody remove_html="1" encode_js="1"$><$MTEntryMore remove_html="1" encode_js="1"$><MTComments>【<$MTCommentAuthor remove_html="1" encode_js="1"$>】<$MTCommentBody remove_html="1" encode_js="1"$></MTComments>"
},</MTEntries>
{title:"",link:"",body:""}
]
}

  9. 最後にプラグインをインストールします。
    月別アーカイブ一覧で使用しているArchiveDateHeaderプラグインとArchiveDateFooterプラグインのインストールします。
    上記URLからダウンロードして、サーバにアップロードします。

    もう1つ、コメント投稿時の返信機能を追加してますので、こちらのmt-link-numberプラグインをインストールします。
    上記URLからmt-link-number.zipという圧縮ファイルをダウンロードして、サーバにアップロードしてください。

以上で一通りの作業は完了です。
後はいつものように再構築して、表示確認を行ってください。

修正履歴

2007.05.21
»新規作成
  • Edit
  • Permalink
  • Comments(2)
  • Trackbacks(0)

 Trackback Pings(0)

No trackbacks found.

 Comments(2)

#1: Posted by ぷーこ [RES]

このテンプレートもシンプルでカッコいいですね！
また変えたくなってきちゃう(;^_^A アセアセ・・・
日付が日めくりカレンダー風なのがかわいいです。
今度リニュする時はこちらをお借りするかもです（*^_^*）

Posted on May 22, 2007
#2: Posted by bzbell [RES]

>>1 ぷーこ さん

こんにちわ^^

いつもありがとうございます (●＞∀＜●)

そそ、クレームブリュレわたしも食べました。
おぃしかったぁ♪

アイス好きなわたしはあのシリーズ全部制覇したい･･･と悩み中!!

Posted on May 22, 2007

 Post a Comment

コメント用フィード