Movable Typeのレスポンシブ版無料テンプレートダウンロード中!|MTモンスター

2008年02月17日 - 2008年02月23日

MovableType6(MT6)のレスポンシブテンプレートが完全 無料なのはMTモンスター!

株式会社グリーンツリーがMTモンスターを運営しております。

フロンティアファイブ日テレG+出演 グリーンツリー社長 森田健太郎のインタビュー MovableType(MT)販売トップクラス ProNetメンバー
2008年02月10日 - 2008年02月16日 « トップへ » 2008年04月13日 - 2008年04月19日

2008年02月19日

[3カラム版] オリジナルデザインを作ろう!

[3カラム版] オリジナルデザイン

MTモンスター提供のテンプレートの場合、広告部分を削除しない限り自分だけのデザインに変更することはOKなので、多くの人がデザインをオリジナルに変更しています。あなたも世界で1つ自分だけのブログをつくっちゃおう!

ご注意!
必ずバックアップをとって作業下さい。またこのカスタマイズについては自己責任でお願い致します。弊社としては様々なケースが発生するため、ご質問にはお答えが出来ません。

STEP1:MTテンプレートをダウンロード!
まずはMTモンスターが提供しているデザインのなかから、一番あなたのイメージに近いデザインを選択して、そのテンプレートをダウンロードします。


STEP2:MTモンスターのテンプレートをインストール!
3カラム版インストール方法を読みながら、MTモンスター提供のテンプレートでブログが動くようにまずはしましょう!


STEP3:カスタマイズしよう!
ヘッダー画像を変更したい!
ヘッダー画像は950px×200pxで、header.jpgとしてmonster-imgフォルダにはいっています。その画像を書き換えるだけで、ヘッダーが変更になります。注意事項としては、ヘッダー画像が入ると自動的にカレンダーの下にも表示され、透けて見えるようになっています。そのため、ヘッダー画像の下部 35px程はカレンダーの下に来てしまうエリアになるのを意識してつくってみましょう!


ブログタイトルの文字の大きさを変更したい!
ブログタイトルの文字の大きさを変更したい場合は、MTモンスターが提供しているスタイルシート(メイン).cssというファイルの下記の場所を修正してみてください。尚、下記の設定部分(35pxやbold、#fff)は下記の通りとなっているとは限りません。

#header-name a {  ←ここがブログタイトルの設定になっています。
font-size: 35px ; ←ここがブログタイトルの文字の大きさの指定。
font-weight: bold ; ←ここがブログタイトルの文字が太字になっています。
color: #fff; ←ここがブログタイトルの文字の色が白になっています。
}

太字をやめたい場合は、bold→normalにするか、その行を削除してください。色を変更したい場合は、下記のサイトの色指定を参考にすると良いと思います。尚、#fffという表示は#ffffffと同じ意味です。
色見本:http://uic.to/support/topic/cgi/color.html


ブログタイトルの文字の場所変更したい!
ブログタイトルの文字の場所を変更する場合は、MTモンスターが提供しているスタイルシート(メイン).cssというファイルの下記の場所を修正してみてください。尚、下記の設定部分(20pxやleft)は下記の通りとなっているとは限りません。

#header-inner { ←ここがブログタイトルの位置の設定になっています。
padding: 20px 30px 0px ; ←上から20px、左右30px、下は0pxとなっています。
text-align: left; ←文字は左側という設定で、右にしたければrightとしてください。
}


ブログの背景色を変更したい!
ブログの背景色を変更したい場合は、MTモンスターが提供しているスタイルシート(メイン).cssというファイルの下記の場所を修正してみてください。尚、下記の設定部分(#666や#dedbc8)は下記の通りとなっているとは限りません。

body { ←ここが背景色とか変更出来る部分です。
color: #666 ; ←全体の文字の色を変更出来ます。
background: #dedbc8; ←背景色を変更出来ます。
}

色の指定は、下記のサイトを参考にすると良いと思います。尚、#666という表示は#666666と同じ意味です。
色見本:http://uic.to/support/topic/cgi/color.html


[2カラム版] オリジナルデザインを作ろう!

[2カラム版] オリジナルデザイン

MTモンスター提供のテンプレートの場合、広告部分を削除しない限り自分だけのデザインに変更することはOKなので、多くの人がデザインをオリジナルに変更しています。あなたも世界で1つ自分だけのブログをつくっちゃおう!

ご注意!
必ずバックアップをとって作業下さい。またこのカスタマイズについては自己責任でお願い致します。弊社としては様々なケースが発生するため、ご質問にはお答えが出来ません。

STEP1:MTテンプレートをダウンロード!
まずはMTモンスターが提供しているデザインのなかから、一番あなたのイメージに近いデザインを選択して、そのテンプレートをダウンロードします。


STEP2:MTモンスターのテンプレートをインストール!
2カラム版インストール方法を読みながら、MTモンスター提供のテンプレートでブログが動くようにまずはしましょう!


STEP3:カスタマイズしよう!
デザイン全体を修正したい!
ヘッダ(header.jpg)と、背景パターン(container.jpg)の2枚のみで2カラム版はデザインされております。この画像を差し替えていただくことで、オリジナルデザインへ簡単に変更いただけるようになっています。


横幅の大きさを変更したい!
2カラム版はどうしても横幅が小さくなりがち・・・。そこでブログの横幅を一発で直せる方法があります!MTモンスターが提供しているスタイルシート(メイン).cssというファイルの下記の場所を修正してみてください。大きくしたい場合は、800をもっと大きな数字にするだけで大丈夫!

#container {
position: relative ;
width: 800px; ←ここを変更いただくだけでOKです。
margin: auto ;
overflow: hidden ;
text-align: left ;
}


MT54-001-2:無料MovableTypeテンプレート(2カラム)

MT4-001-2:無料MovableTypeテンプレート(2カラム)
[↑画像をクリックすると拡大]
番 号:MT54-001-2
対 応:MT v5.× v4.2 v4.1
タイプ:遺跡
特 徴:インディージョーンズ魔宮の伝説をイメージしたデザインです。
ダウンロード
ダウンロード
ダウンロード

MTモンスターが提供している2カラム版テンプレートはSEOよりも簡単にインストールできたり、デザインにこだわりたい方向けのテンプレート。今すぐ、MTでブログを始めよう!


2008年02月18日

MTモンスター提供 MTテンプレート一覧

MTテンプレート一覧

MTモンスター提供のテンプレートは下記のような特徴があります。早速、MTモンスターが提供する最新のテンプレートをダウンロードしよう!<補足:「レスポンシブ」、「2カラム」と「3カラム」の意味

カラムMTバージョンインストール難易度SEO強度インストール
説明ページ
オススメ!
レスポンシブ版
最新!
v6.×
とっても
簡単
当然SEOは
コチラ
3カラムv5.×簡単コチラ
v4.2超簡単 5分コチラ
v4.1少し大変コチラ
v4.0少し大変コチラ
2カラムv5.×簡単中強コチラ
v4.2超簡単 5分中強コチラ
v4.1簡単コチラ

SEO対策強化版【レスポンシブ】MT v6.×用テンプレート一覧
レスポンシブ版v6.×用テンプレート一覧



SEO対策強化版【3カラム】MT v5.× / v4.2 / v4.1 / v4.0用テンプレート一覧
SEO対策強化版の3カラムMT4.0/4.1/4.2用テンプレート一覧



デザイン重視版【2カラム】MT v5.× / v4.2 / v4.1用テンプレート一覧
2カラム版インストール方法

MTモンスター提供テンプレートのインストール方法!

MovableType(MT)テンプレートのインストール方法

MTモンスター提供のテンプレートは、MTのバージョンによってインストール方法が異なりますので、ご注意ください。<補足:「レスポンシブ」、「2カラム」と「3カラム」の意味

カラムMTバージョンインストール難易度SEO強度インストール
説明ページ
オススメ!
レスポンシブ版
最新!
v6.×
とっても
簡単
当然SEOは
準備中
3カラムv5.×簡単コチラ
v4.2超簡単 5分コチラ
v4.1少し大変コチラ
v4.0少し大変コチラ
2カラムv5.×簡単中強コチラ
v4.2超簡単 5分中強コチラ
v4.1簡単コチラ


[2カラム版] インストール方法

2カラム版 MovableType(MT)テンプレートのインストール方法

MTモンスターが提供する2カラム版 Movable Type(MT)テンプレートは下記のステップでインストールが出来ます。

今までMTテンプレートのインストールはたくさんのファイルを入れなければならず、今までは大変でした。しかしながらMTモンスター提供2カラム版テンプレートは、たったの5個のテンプレートをインストールするだけでOK! 超カンタンです!

ご注意!(MT3からバージョンアップしてMT4になっている方)
MT4を新規にインストールした場合と違い、MT3からMT4にバージョンアップをした方は5つのテンプレートを入れるだけでは足りません。これはMT3からMT4にバージョンアップしますと新規にMT4をインストールすると入るはずのモジュールが入らないからです。MT3からMT4にバージョンアップした場合には、まず最初にMT3からバージョンアップしたMT4をご利用の場合をご覧下さい。

1. ダウンロードしたファイルを解凍してください。
目的のテンプレートをダウンロードしますと、ZIP形式で圧縮されておりますので、それを解凍してください。解凍しますと、下記のファイルが出てきます。
(1)monster-templeteフォルダ
メインページ.txt
アーカイブインデックス.txt
ブログ記事.txt
ブログ記事リスト.txt

(2)monster-img
画像が入っております。フォルダ毎そのままFTPにてアップしてください。

(3)スタイルシート.css

(4)はじめに.txt

上記のファイルがある事をまず確認してください。それではインストールをしていきましょう!

2. Movable Type 4 の管理画面へログインします。
Movable Type 4 の管理画面

3. ログイン後、「デザイン」→「スタイル」を選択します。
 ログイン後、「デザイン」→「スタイル」を選択

4. 赤枠の「既存のスタイル」を選択します。
「既存のスタイル」を選択

5. どれか適当にデザインを選択します。
適当にどれかのデザインを選択

6. 右側選択されたデザインの下部のプルダウンから「2カラム、大・小」を選択します。
「2カラム、大・小」を選択

7. 「デザイン適用」を押しします。
「デザイン適用」を押す

8. 「再構築」を押しします。
「再構築」を押しますとポップアップで再構築画面が出てきます。そこで、「すべててのファイル」が選ばれている状態で再構築をクリックしてください。
「デザイン適用」を押す

9. 「デザイン」→「テンプレート」を選択します。
「デザイン」→「テンプレート」を選択

10. 赤枠の「メインページ」をクリックします。
「メインページ」を選択

11. 「構文強調表示/強調表示なし」の選択
テンプレートを貼り付ける場合は、テキストエリア右上にある「構文強調表示/強調表示なし」から「強調表示なし」」を必ず選択してください。「構文強調表示」のままペーストすると元ファイルの改行が反映されません。つまり、貼り付けたときに改行されず1行で張り付いてしまう場合があり、表示が崩れる原因となります。特にIE7でこの問題が確認されています。
「メインページ」を選択

12. MTモンスターのメインページテンプレートに置き換えます。
下記の赤枠の中に入っているMovableTypeのテンプレートはバックアップをとっておいて下さい。その後、全てを一旦消し、そしてMTモンスターから提供されているメインページテンプレートに置き換え、最後に「保存」ボタンを押して下さい。最後に再構築をするので、「保存」の方が早くてオススメです。
メインページテンプレート

13. 右の「インデックステンプレート一覧」をクリック
インデックステンプレート一覧

14. 「アーカイブインデックス」をクリック
「アーカイブインデックス」をクリック

15. MTモンスターのアーカイブインデックスに置き換えます。
下記の赤枠の中に入っているMovableTypeのテンプレートであるアーカイブインデックスはバックアップをとっておいて下さい。その後、全てを一旦消し、そしてMTモンスターから提供されているアーカイブインデックスに置き換え、最後に「保存」ボタンを押して下さい。最後に再構築をするので、「保存」の方が早くてオススメです。
アーカイブインデックス

16. 右の「インデックステンプレート一覧」をクリック
インデックステンプレート一覧

17. 「スタイルシート」をクリック
スタイルシート

18. MTモンスターのスタイルシート.cssに置き換えます。
下記の赤枠の中に入っているMovableTypeのテンプレートであるスタイルシートはバックアップをとっておいて下さい。その後、全てを一旦消し、そしてMTモンスターから提供されているスタイルシート.cssに置き換え、最後に「保存」ボタンを押して下さい。最後に再構築をするので、「保存」の方が早くてオススメです。
スタイルシート

19. 右上の「インデックステンプレート一覧」をクリック
「インデックステンプレート一覧」をクリック

20. 右上の「アーカイブテンプレート」をクリック
「アーカイブテンプレート」をクリック

21. 「ブログ記事」をクリック
「ブログ記事」をクリック

22. MTモンスターのブログ記事に置き換えます。
下記の赤枠の中に入っているMovableTypeのテンプレートであるブログ記事はバックアップをとっておいて下さい。その後、全てを一旦消し、そしてMTモンスターから提供されているブログ記事に置き換え、最後に「保存」ボタンを押して下さい。
ブログ記事

23. 右上の「アーカイブテンプレート一覧」をクリック
「アーカイブテンプレート一覧」をクリック

24. 「ブログ記事リスト」をクリック
「ブログ記事リスト」をクリック

25. MTモンスターのブログ記事リストに置き換えます。
下記の赤枠の中に入っているMovableTypeのテンプレートであるブログ記事はバックアップをとっておいて下さい。そしてMTモンスター提供のブログ記事リストに置き換え、最後に「保存」を押して下さい。
ブログ記事リスト

26. 「再構築」をクリック
最後に再構築をクリックするとテンプレート関係は終了です。
「アーカイブテンプレート一覧」をクリック

27. 画像の送信
最終的に画像をアップすると全てが完了します。FTPソフトを使い、「monster-img」フォルダを作成し、その中にMTモンスターが提供している「monster-img」フォルダに入っている画像を全てアップロードして下さい。フォルダをそのままアップロードして頂いても構いません。尚、FTPソフトの使い方についてはFTPソフトの方にお聞き下さい。

お疲れ様でした。

[補足]
例えば、http://www.abc.com/ でブログを公開する場合は、 http://www.abc.com/monster-img/に画像フォルダを作っていただく形になります。もし、http://www.abc.com/blog/ でブログを公開する場合には、http://www.abc.com/blog/monster-img/ となります。


2008年02月10日 - 2008年02月16日 « トップへ » 2008年04月13日 - 2008年04月19日

人気テンプレート[1位]

MT6-R-001
テンプレートNo:MT6-R-001
タイプ:AirPlane
先進なイメージを表現したデザイン!

人気テンプレート[2位]

MT6-R-004
テンプレートNo:MT6-R-004
タイプ:Colored pencil
子供たちが色鉛筆で落書きをしたやさしいデザイン

人気テンプレート[3位]

MT6-R-003
テンプレートNo:MT6-R-003
タイプ:Orange Flower
オレンジ色の花を使い南国の暑さ表現

人気テンプレート[4位]

MT6-R-002
テンプレートNo:MT6-R-002
タイプ:GreenEco
緑色の心温まるエコなイメージを表現

人気テンプレート[5位]

MT6-R-005
テンプレートNo:MT6-R-005
タイプ:Brown Chic
ブラウンのシックな色を美しく表現