平 賀 正 彦 氏 会 員 限 定 ホームページテンプレートVer 3.00 マニュアル Copyright 2010 1st-need Co,.Ltd. All Rights Reserved. 1
利 用 規 約 利 用 規 約 本 テンプレートは 平 賀 正 彦 氏 の 会 員 でない 方 の 利 用 はできません テンプレートの 不 正 利 用 無 断 での 譲 渡 改 変 しての 再 配 布 または 販 売 などは 堅 く 禁 じます 不 正 利 用 を 発 見 した 場 合 は info@1st-need.co.jp まで 通 報 ください 直 ちに 対 応 いたします 規 約 準 拠 と 裁 判 管 轄 1. 本 規 約 の 執 行 可 能 性 解 釈 および 有 効 性 は 日 本 国 法 に 従 って 判 断 されるものとします 2. 利 用 者 と 当 サイトは 本 規 約 に 関 するいかなる 紛 争 も 東 京 地 方 裁 判 所 を 専 属 的 管 轄 裁 判 所 に することに 同 意 します 免 責 事 項 本 テンプレートは 上 位 表 示 を 保 障 するものではありません SEO 対 策 はあくまでも 自 己 責 任 でお 願 いします 2010 年 3 月 制 定 施 行 Copyright 2010 1st-need Co,.Ltd. All Rights Reserved. 2
はじめに このたびは 平 賀 正 彦 氏 会 員 限 定 ホームページテンプレート をダウンロード して 頂 きまして 誠 にありがとうございます Web 標 準 W3C 準 拠 された このテンプレートを 使 って 制 作 したサイトは 様 々なブラウザにおいて 同 一 レイアウトを 実 現 し ユーザーの 閲 覧 環 境 に 応 じて 正 しい 情 報 を 伝 えられるように 設 計 されています どうぞ 自 信 をもってサイトを 制 作 してください 正 しい 構 造 のサイトが 自 社 制 作 できれば インターネットビジネスのうち8 割 は 成 功 したと 言 っても 良 いでしょう 本 テンプレートで 制 作 されたサイトがあなたに 多 くの 利 益 をもたらし 続 けますように 2010 年 3 月 吉 日 いせきけんじ http://isekikenji.jp/ Copyright 2010 1st-need Co,.Ltd. All Rights Reserved. 3
制 作 環 境 オリジナル 画 像 を 制 作 し img-layoutフォルダ 内 の 画 像 と 差 し 替 えるだけで オリジナルデザインのサイトが 作 成 できます 画 像 編 集 には Photoshop Fireworks などを 推 奨 します Dreamweaver(バージョン8 以 降 ) があれば サイト 制 作 (コード 記 述 とCSS 記 述 ) 作 業 もかなり 楽 になります 勝 手 にコードが 書 き 換 わったりして 使 いづらい 場 合 もありますが またソースコードを 入 力 するにはテキストエディターと 呼 ばれるソフトの 使 用 もオススメです シンプルなソフトとして Crescent Eveをご 紹 介 しておきます http://www.kashim.com/eve/ デスクトップアイコンにファイルをドラッグすればコード 編 集 ができます ホームページビルダーについては 編 集 画 面 のレイアウトが 崩 れたり コードが 一 部 書 き 換 わったりして あまりオススメできませんが サイト 制 作 自 体 は 可 能 です 実 際 にブラウザで 表 示 を 確 認 しながらの 作 業 を 行 ってください Copyright 2010 1st-need Co,.Ltd. All Rights Reserved. 4
ファイル 一 覧 css/ style.css img/ ba180150-01.gif img/ba_index.jpg img-layout/ bg_body.jpg bg_h2.jpg bg_mag2.jpg bg_top.jpg ico_pagetop01.gif li_arrow01~02.gif main_img.jpg menu0~5.jpg menu0~5_o.jpg side-f.jpg side-h.jpg 制 作 用 / bg_top.jpg menu0.jpg menu0_o.jpg menu1-5.jpg menu1-5_o.jpg img-flash/ banner00~03.jpg banner.txt company.html form-inquiry.html index.html law.html menu1.html menu2.html menu3.html menu4.html menu5.html privacy.html sitemap.html setup.js slide540180_3.js slide540180_3.swf 制 作 用 フォルダ 以 外 のファイルを 全 てサーバーにアップロー ドしていただきますと サイトとして 動 作 いたします 制 作 用 フォルダ 内 には トップバナーと 各 メニューボタンの テキストなし 画 像 が 入 っています 編 集 用 にお 使 いください menu0(_o).jpg のみ 他 のボタンとサイズが 違 います Copyright 2010 1st-need Co,.Ltd. All Rights Reserved. 5
各 ファイルの 説 明 (1) css/ style.css img/ ba180150-01.gif img/ba_index.jpg img-layout/ bg_body.jpg bg_h2.jpg bg_mag2.jpg bg_top.jpg ico_pagetop01.gif li_arrow01~02.gif main_img.jpg menu0~5.jpg menu0~5_o.jpg side-f.jpg side-h.jpg css/style.css は サイトの 全 体 のレイアウト 用 です このファイルで 文 字 色 背 景 色 配 置 などを 決 めています ファイル 内 の 記 述 を 編 集 するとレイアウト 崩 れを 起 こす 可 能 性 がありますので 編 集 しないようにお 願 いします imgフォルダには サイト 内 で 通 常 使 用 する 画 像 を 保 存 してくだ さい テストとして バナーを2つ 入 れています img-layoutフォルダには サイトのレイアウトに 使 う 画 像 を 保 存 しています この 中 の 画 像 と css/style.css が 連 動 してサイトとして 表 示 させています 各 画 像 の 使 用 箇 所 については 次 ページで 説 明 します Copyright 2010 1st-need Co,.Ltd. All Rights Reserved. 6
各 ファイルの 説 明 (2-1) img-layoutフォルダ bg_top.jpg menu0~5.jpg (カーソルオン 時 それぞれ menu0~5_o.jpg に 対 応 ) main_img.jpg side-h.jpg (サイドバー 見 出 しの 背 景 ) bg_h2.jpg (H2タグの 背 景 画 像 ) li_arrow01.gif side-f.jpg ( 枠 線 の 背 景 ) Copyright 2010 1st-need Co,.Ltd. All Rights Reserved. 7
各 ファイルの 説 明 (2-2) img-layoutフォルダ bg_body.jpg (ページの 両 端 の 影 部 分 の 画 像 この 小 さい 画 像 がY 軸 リピートで ページ 背 景 に 入 っています ) bg_mag2.jpg (まぐまぐ 登 録 フォームの 背 景 画 像 になります ) ico_pagetop01.gif Copyright 2010 1st-need Co,.Ltd. All Rights Reserved. 8
各 ファイルの 説 明 (3) img-flashフォルダ img-flash/ banner00~03.jpg banner.txt banner00~03.jpg 画 像 が 下 記 の 順 番 でスライドします banner01.jpg banner02.jpg banner03.jpg banner01.jpg( 以 下 繰 り 返 し) banner00.jpg はFlashが 表 示 されない 環 境 の 場 合 に 表 示 される 画 像 です 下 記 コードをHTMLファイルに 貼 り 付 けるとスライドバナーが 動 作 します <div id="flash"><script type="text/javascript" src="slide540180_3.js"></script></div> banner.txt ファイル 内 の &url= の 値 を 変 えることで 表 示 画 像 に 対 応 したリンクを 貼 ることができます ( 例 )&url01=menu1.html banner01.jpg をクリックすると menu1.html にジャンプ Copyright 2010 1st-need Co,.Ltd. All Rights Reserved. 9
各 ファイルの 説 明 (4) company.html 会 社 概 要 ページ form-inquiry.html お 問 い 合 わせページ index.html トップページ law.html 特 定 商 取 引 法 に 基 づく 表 記 ページ menu1.html メニュー1ページ menu2.html メニュー2ページ menu3.html メニュー3ページ menu4.html メニュー4ページ menu5.html メニュー5ページ privacy.html プライバシーポリシーページ sitemap.html サイトマップページ setup.js メニューボタンのロールオーバー 用 ファイル slide540180_3.js フラッシュスライドバナー 用 ファイル slide540180_3.swf フラッシュスライドバナー 用 ファイル 各 html ファイルは お 使 いの 環 境 に 合 わせてファイル 名 などを 変 更 してください ページを 追 加 する 場 合 は 既 存 のHTMLファイルをコピーしてファイル 名 を 変 更 してご 利 用 ください ページ 内 のコードの 記 述 方 法 文 字 装 飾 の 方 法 などはサポートサイトで 公 開 いたします メニューボタンにカーソルを 載 せると 画 像 が 変 わりますが この 動 作 を setup.js 内 で 行 っています HOMEボタン(menu0.jpg) の 場 合 カーソルを 載 せると menu0_o.jpg の 画 像 に 変 わります 同 じように menu*.jpg menu*_o.jpg と 連 動 しています Copyright 2010 1st-need Co,.Ltd. All Rights Reserved. 10
まぐまぐ 登 録 フォームレイアウトの 説 明 まぐまぐでメルマガ 発 行 されている 方 のための レイアウトになります 下 記 コード 内 の マガジンナンバー 部 分 (2 箇 所 )を10 桁 のメルマガIDに 変 更 してください 変 更 後 サーバーにアップすれば 正 常 に 動 作 します その 他 各 文 言 を 変 更 してお 使 いください <div id="mag2"> <p class="blue b center f14">マガジン サブタイトル( 簡 単 な 説 明 )</p> <p class="f12">メールマガジンの 説 明 メールマガジンの 説 明 メールマガジンの 説 明 ルマガジンの 説 明 メールマガジンの 説 明 (2 行 程 度 )</p> <form action="http://regist.mag2.com/reader/magrdop" method="post"> <div class="center"> <label for="op_reg6"> <input tabindex="1" accesskey="a" type="radio" id="op_reg6" name="op" value="reg" checked="checked" /> 登 録 </label> <label for="op_unreg6"> <input tabindex="2" accesskey="b" type="radio" id="op_unreg6" name="op" value="unreg" /> 解 除 </label> <input tabindex="3" accesskey="c" id="email6" type="text" size="26" name="rdemail" value="メールアドレス onfocus="if (this.value == 'メールアドレス') this.value = '';" onblur="if (this.value == '') this.value = 'メールアドレス';" /> <input type="hidden" name="magid" value=" マガジンナンバー " /> <input type="hidden" name="reg" value="hakkou" /> <input tabindex="4" accesskey="d" type="submit" value=" 送 信 " /> </div> </form> <p class="f12"> 発 行 周 期 : 毎 週 曜 日 <span class="f11"><a href="http://archive.mag2.com/ マガジンナンバー /">>> バックナンバーはこちら</a></span></p> </div> Copyright 2010 1st-need Co,.Ltd. All Rights Reserved. 11
サポートサイトのご 案 内 ページ 内 の 記 述 方 法 文 字 装 飾 の 方 法 や CSSファイル 編 集 の 方 法 など テンプレの 様 々な 使 い 方 や 相 談 のできる 専 用 サポートサイトを 公 開 いたします http://hiraga.hta.jp/ ID:hiraga PASS:masahiko IDとPASSは 定 期 的 に 変 更 する 予 定 です サポートサイトよりご 質 問 いただきますと テンプレート 制 作 者 いせきけんじが 回 答 いたします 他 社 サービスについてのご 質 問 などには 対 応 できないことがあります 詳 しくはサポートサイト 内 でご 確 認 ください Copyright 2010 1st-need Co,.Ltd. All Rights Reserved. 12
画 像 配 布 サイトのご 案 内 画 像 がうまく 作 れない などのご 相 談 をいただくことが 大 変 多 いため テンプレート 専 用 の 画 像 配 布 サイトを 準 備 中 です テンプレートのサイズに 合 った 画 像 を 無 料 配 布 する 予 定 です 準 備 できましたらメルマガ 内 で 告 知 いたします 登 録 はこちら http://isekikenji.jp/mag2.html Copyright 2010 1st-need Co,.Ltd. All Rights Reserved. 13
テンプレート 制 作 元 株 式 会 社 ファーストニード 代 表 取 締 役 : いせきけんじ 163-1030 東 京 都 新 宿 区 西 新 宿 3-7-1 新 宿 パークタワーN30 階 TEL:03-5326-3112 FAX:020-4622-8191 iseki@1st-need.co.jp http://hp-renewal.jp/ (ホームページリニューアル.jp) http://isekikenji.jp/ (プロユース 版 テンプレート 配 布 ) Copyright 2010 1st-need Co,.Ltd. All Rights Reserved. 14