« 瀬戸内国際芸術祭に行きました | メイン | 『そめけん!』10月12日第25回放送 »

2010/10/09

TypePad上級者テンプレートによるカスタマイズの手順(4)

TypePadブログのカスタマイズ手順の最後の記事です。

これまでの記事

テスト用に作成したブログで、オリジナルのテンプレートが意図通りに反映したことを確認できたら、いよいよ本番のブログに反映します。

画像のアップロード

手順(2)の最初の作業として、テスト用のブログで画像アップロード用のディレクトリを作成し、オリジナルのデザインで使用する画像をアップロードしました。
それと同じことを本番のブログでも行ないます。

  • 画像のアップロードは管理画面上のメニュー「タイプリスト/アルバム」プルダウンの中の「ファイルマネージャー」より行います。
  • テスト用で作成した画像用ディレクトリと、本番用のディレクトリとで、階層の深さや下層のディレクトリ名が違わないように作成してください。(異なっていると、CSSファイルの中で相対パスで指定している画像のURLを修正しなければいけないため)

上級者テンプレートの新規作成

本番のブログのダッシュボードの「デザイン」のページを開き、上級者テンプレートを追加します。
具体的な方法は、手順(1)でテスト用ブログを作った時と同様です。

  • 「新しいデザインを作成」というところにある「テーマを選択」をクリックします。
    左側のテーマのカテゴリ一覧にある「カスタマイズ」をクリックします。
  • 下の画面が表示されたら「上級者テンプレート」を選択し、右側の「選択」ボタンをクリックします。
    上級者テンプレート選択

この時点では、まだ上級者テンプレートは本番のブログに適用されていません。
テスト用ブログで作成した各テンプレートの変更を反映し、このテンプレートを「適用」という作業をして初めて、ブログのデザインが変更されます。

上級者テンプレートのカスタマイズ

手順(3)では、テスト用のブログの上級者テンプレートをカスタマイズしました。それでできあがったオリジナルテンプレートの内容を、本番用の各テンプレートに上書きコピーしていきます。新しく作成したモジュールについても、本番用の上級者テンプレートの中に同じものを新しく作成します。

★このとき、画像のURLが絶対パスで指定されているところは、そのURLをテスト用から本番用に修正します。

上級者テンプレートの適用

テンプレートの修正・追加が終わったら、後はそれを適用するだけです。

方法は以下の2種類あり、どちらでも構いません。

  • テンプレートの一覧ページの一番下の「◯◯◯◯(ブログ名)にデザインを適用する」をチェックし、「変更を保存」ボタンをクリックする。
  • 該当ブログの「デザイン」トップページのテンプレートの一覧から、今作成した上級者テンプレートの「操作」のプルダウンリストより「適用」を選択する。

ブログの表示確認

適用の作業をしたら、本番のブログに反映するので、表示上おかしなところがないか、ブログの各ページを表示して確認します。

問題なければ、以上でテンプレートのカスタマイズ作業が完了です。

 

トラックバック

この記事のトラックバックURL:
http://www.typepad.com/services/trackback/6a0120a666f2a1970c01348812af56970c

Listed below are links to weblogs that reference TypePad上級者テンプレートによるカスタマイズの手順(4) :

» TypePad上級者テンプレートによるカスタマイズの手順(1) from おーぷんlog
先日やってみたTypePadの上級者テンプレートを使ったブログデザインカスタマイズの手順のメモです。... [続きを読む]

» TypePad上級者テンプレートによるカスタマイズの手順(2) from おーぷんlog
TypePadブログのカスタマイズ手順の2つ目の記事です。 前回のTypePad上級者テンプレートに... [続きを読む]

» TypePad上級者テンプレートによるカスタマイズの手順(3) from おーぷんlog
TypePadブログのカスタマイズ手順の3つ目の記事です。 これまでの記事 Typepad上級者テン... [続きを読む]

コメント

フィード You can follow this conversation by subscribing to the comment feed for this post.

この記事へのコメントは終了しました。

最近のコメント

Tweet

follow yatun on twitter

Powerd by TypePad. | Designed by Eri Yatsuzuka.