テンプレートがサンプルと同じように表示できません
圧縮ファイル解凍後、まずはどこにも手を加えず、ご自身の環境で表示と動作の確認をなさることをおすすめします。
その後、以下をチェックしてみてください。
(個別サポートは出来かねますので、1つ1つご確認ください)
- 必要なファイルを全てアップロードしていますか?
- 各ファイルの呼び出しアドレスは正しいですか?
- 必要なタグが消えていませんか?
- 正しいモード(アスキーorバイナリ)で転送していますか?
- サーバやレンタルツールの影響はありませんか?
- 併せて参考にしていただきたいページ
必要なファイルを全てアップロードしていますか?
「文字の大きさや色が反映されない」、「背景画像が表示されない」など、デザインを再現できない場合はスタイルシートが読み込まれていない可能性が高いです。
デザインは主にスタイルシート(拡張子css)が構成しますので、必ずアップロードしてください。
また、アップロードの際は相対パスを活かした構成にすることに注意が必要です(理由は後述しています)。
ファイルやフォルダの移動・名前の変更をすると相対パスが無効になる可能性がありますので、あらかじめ相対パスの仕組みの理解が必要です。
「必要なファイルは全てアップロード済みなのに表示がおかしい」とご連絡をいただくことがありますが、
実際には必要なファイルが欠けていたり、アップロードする場所を間違えている(パスと合致しない)ケースが大半です。
先述のとおり、デザインを再現できない場合はスタイルシートが読み込まれていない可能性が高いので、「パスで指定した場所にスタイルシートが存在しているか」を重ね重ねご確認ください。
各ファイルの呼び出しアドレスは正しいですか?
テンプレートで使用する画像やスタイルシートは「相対パス」で読み込んでいます。
そのため、ファイルやフォルダの移動・名前の変更を行う場合は同時に関連箇所の書き換えが必要です。
たとえば当サイトのテンプレートでは、デザインを構成するためのスタイルシートを以下のように読み込んでいます。
<link rel="stylesheet" type="text/css" href="img/style.css">
上記は「img」フォルダの中の「style.css」を読み込むという指示です。
つまり、「style.css」は「img」という名前のフォルダに入っていなければパスが無効になります。
特に変更する必要がない場合や、意味がわからない場合は、ファイルやフォルダの移動・名前の変更をせず、配布時の状態のまま設置なさることをおすすめします。
- 関連ページ
必要なタグが消えていませんか?
テンプレートで使用しているタグの多くは、<開始タグ> と </終了タグ> がペアになっていなければいけません。
開始タグがあるのに終了タグがない、開始タグがないのに余分な終了タグが存在している、といった記述ミスはデザイン崩れの原因になる可能性が高いです。
ソースにミスがないか htmlの文法チェックツール で確認してみてください。
また、テンプレートを編集する際に自動修正機能のついたエディタを使用すると、意図せずタグが消えていたり、書き換えられる可能性があります。
編集の際は、自動修正機能のないエディタ(Windowsなら「メモ帳」、Macなら「SimpleText」など)を使用するか、自動修正機能をオフにした方が、ソフトの機能に依る問題を回避できます。
- 関連ページ
正しいモード(アスキーorバイナリ)で転送していますか?
画像は必ず「バイナリモード」で転送してください。
画像を「アスキーモード」(あるいは「テキストモード」)でアップロードすると正しく表示できない可能性があります。
転送モードがわからない場合は、お使いのアップローダーやFTPクライアントのマニュアル等をご確認ください。
サーバやレンタルツールの影響はありませんか?
サーバやレンタルツールによっては、自動的にタグが書き換えられたりコードが挿入されることがあります。
「サーバにアップロードした直後」からページが正しく表示されないのであればサーバの影響を、 「レンタルツールの使用を開始した直後」からならレンタルツールの影響を受けている可能性があります。
それぞれの仕様については、お使いのサーバやレンタルツールのヘルプ等をご確認ください。
いずれにしても「何かの拍子に表示が変わってしまった」場合は、その段階に原因がある可能性が高いと思われます。
小まめなチェックとバックアップの保存をおすすめします。
どの段階で表示が変わったのかわからない場合は、配布時の状態とソースを見比べて「何が違うのかを調べる」ことで解決に繋がる可能性があります。