テンプレートの使い方

はじめにやる事。
まず、htmlソースが見れる状態(メモ帳などで開いてもOK)にして、
<title>●●●あなたのホームページ名●●●</title>
を編集しましょう。あなたのホームページ名が「Nikukyu Punch」だとすれば、
<title>Nikukyu Punch</title>
とすればOKです。SEO対策もするなら、PRしたいワードを冒頭に追加します。
<title>日本橋の居酒屋 Nikukyu Punch</title>

続いて、下の方の
Copyright(C) 2009 ●●●あなたのホームページ名●●●[…省略…]
も編集します。こちらは企業名だけを入れましょう。
例:Copyright(C) 2009 Nikukyu Punch[…省略…]
「2009」部分はその年その年にあわせて変更していって下さい。

ヘッダー画像について
上記画像は再利用不可です。必ず入れ替えてご利用下さい。配布元サイトは「素材辞典」さんの「イメージブック10」に収録されています。

ご自身で作成される場合は、sampleフォルダに入っているheader_bg.jpgの白いボックス部分に写真を配置し、imagesフォルダの方へ上書き保存して下さい。上の写真と置き換わります。サンプル画像のサイト名バックに入っている丸い飾りもsampleフォルダに入っています。(画像名はkazari.png)

上部のメインメニューについて
文字なしのベース画像がsampleフォルダに入っていますので好きに文字いれしてそのままimagesフォルダへ上書きして下さい。左からmenu_01.gif…と置き換わります。
当方でもメニューへの文字入れ代行(最初の1個目のみ500円、後は追加1個あたり150円。)承っております。もし全部入れ替えるなら、最初の1個分500円+残り5個(750円)=1,250円となります。
詳しくはこちらをご覧下さい

当ブロックの木目の見出しについて
「テンプレートの使い方」などの見出し画像は以下のようにh2タグで囲めばOKです。

当ブロック内のテキストは…
段落タグ<p>で囲みましょう。余白が自動で反映されます。

当ブロック内に画像を置く場合…
段落タグ<p>内なら、幅485pxまで。段落タグの外なら幅505pxまで。

トップページの「おしらせ」部分について
リストタグでできています。ulタグにclass指定で「new」を指定し、メニュー本体はliタグで作ります。 html側で書くと以下の通りです。

一見iframe風に見えますがstyle.css側でiframe風に設定したもので、実際にはちゃんとトップページ内に記載されています。

最後にやる事。
全ページが完成したら、htmlソースが見える状態にしてmetaタグを変更しましょう。今はあまり重要視されていませんがSEO対策の一環です。

ソースの上の方に、
content="ここにサイト説明を入れます"
という部分がありますので、テキストをサイトの説明文に入れ替えます。検索結果の文面に使われる場合もありますので、見た人がよく分かるような説明文を簡潔に書きましょう。
例:content="日本橋から徒歩5分の居酒屋です。築地直送の新鮮食材を利用しています。"

続いて、その下の行の
content="キーワード1,キーワード2,〜〜〜"
も設定します。ここはサイトに関係のあるキーワードを入れる箇所です。膨大な数のキーワードを詰め込むとスパム処理されるのでやめましょう。キーワード間はカンマ「,」で区切ります。
例:content="日本橋,築地直送,居酒屋,新鮮食材"

当店イチオシメニュー!

上部の「当店イチオシメニュー!」は
h3タグで囲めばフチの二重線が入ります。html側だと以下の通り。

上部のサイドメニューは
リストタグでできています。ulタグにclass指定で「sidemenu」を指定し、メニュー本体はliタグで作ります。h3の見出しを含め、サイドメニューの1ブロックをhtml側で書くと以下の通りです。

当ブロック内のテキストは…
段落タグ<p>で囲みましょう。上下の余白が自動で反映されます。

当ブロック内に画像を置く場合…
幅290pxまで。

サポート

■HPカラーの変更、お問い合わせフォームの設置、画像加工サービス(500円〜)など、ホームページ編集のお手伝いもしております。
>>詳細はこちら