テンプレートNo.088タイプのマニュアル - 《無料》ホームページテンプレート.com | 商用可能なホームページテンプレート・レスポンシブWordPressテーマが完全無料

テンプレートNo.088タイプのマニュアルManual

テンプレートNo.088タイプのカスタマイズ方法マニュアルです。このタイプと同レイアウトのテンプレートは、ほぼこちらのマニュアルと同じ操作方法となります。

このマニュアルが使用できるテンプレート Manual	088、089、090

マニュアルのもくじManual

マニュアルの読み方
index.htmlを編集しよう

マニュアルの読み方Manual

青色の文字で示している部分はサイトの「テキスト（文章・文字）」にあたる部分です。自分のサイトの内容に合わせて編集を行なって下さい。

赤色の文字で示している部分はサイトの「画像」にあたる部分です。画像を変更される場合にはこの部分を編集して下さい。サンプルの画像をそのまま使用する場合には変更の必要はありません。

緑色の文字で示している部分はサイトの「リンク」にあたる部分です。作成したページにリンクするためにはこの部分を編集する必要があります。

確認事項・注意事項など

スマートフォン・タブレット端末向けのレイアウトは下記のマニュアルに従って作成して頂きますと、自動的に作成されます。個別にカスタマイズを行う必要はありません。カスタマイズが完了したらサーバーにアップロードして各端末でご確認下さい。

index.htmlを編集しようManual

「index.html」のカスタマイズ方法です。

【1】ナビゲーションメニュー部分の編集

<ul>
<li><a href="#header">TOP</a></li>
<li><a href="#sec01">VISION</a></li>
<li><a href="#sec02">MESSAGE</a></li>
<li><a href="#sec03">SERVICE</a></li>
<li><a href="#sec04">STORY</a></li>
<li><a href="#sec05">PROFILE</a></li>
</ul>

【2】メイン画像・社名・スローガン部分の編集

<img src="images/mainImg.jpg" alt=””>
<div id="slogan">
<h1>Vestibulum mauris</h1>
<h2>最新技術と自然との調和を目指す</h2>
</div>

【3】VISION部分の編集

<header>
<h2>VISION</h2>
</header>
<div class="vision">
ちかごろ世間で日本歴史の科学的研究ということがしきりに叫ばれている。科学的研究というのが近代史学の学問的方法による研究という意義であるならば、これは史学の学徒の間においては一般に行われていることであるから、今さらこと新しくいうには及ばないはずである。上にいったようなことがらについては、曖昧あいまいな態度をとり、または真実でない知識を強いて注入していたことも、明かな事実である。
</div>

【4】MESSAGE部分の編集

<div class="wrap">
<p class="bg"><img src="images/sec02_01.jpg" alt=""></p>
<div class="txt">
<div class="vMid">
<h2>MESSAGE</h2>
<p>ちかごろ世間で日本歴史の科学的研究ということがしきりに叫ばれている。科学的研究というのが近代史学の学問的方法による研究という意義であるならば、これは史学の学徒の間においては一般に行われていることであるから、今さらこと新しくいう。</p>
</div>
</div>
</div>
<div id="sec02_02" class="wrap">
<p class="bg"><img src="images/sec02_02.jpg" alt=""></p>
<div class="txt">
<div class="vMid">
<h2>MESSAGE</h2>
<p>日本歴史の科学的研究ということがしきりに叫ばれている。科学的研究というのが近代史学の学問的方法による研究という意義であるならば、これは史学の学徒の間においては一般に行われていることであるから、今さらこと新しくいう。</p>
</div>
</div>
</div>

【5】タイトル＋丸い画像＋文章部分の編集

<li>
<h2>SERVICE</h2>
<img src="images/circleImg01.png" width="288" height="288" alt="">
<p>科学的研究というのが近代史学の学問的方法による研究という意義であるならば、これは史学の学徒の間においては一般に行われていることであるから、今さらこと新しくいう。</p>
</li>
<li>
<h2>MESSAGE</h2>
<img src="images/circleImg02.png" width="288" height="288" alt="">
<p>日本歴史の科学的研究ということがしきりに叫ばれている。科学的研究というのが近代史学の学問的方法による研究という意義であるならば意義であるならば。</p>
</li>
<li>
<h2>STORY</h2>
<img src="images/circleImg03.png" width="288" height="288" alt="">
<p>科学的研究というのが近代史学の学問的方法による研究という意義であるならば、これは史学の学徒の間においては一般に行われていることであるから、今さらこと新しくいう。</p>
</li>

【6】背景＋2つの文章部分の編集

<li>
<h2>STORY</h2>
<p>科学的研究というのが近代史学の学問的方法によるちかごろ世間で日本歴史の科学的研究ということがしきりに叫ばれている。研究という意義であるならば、研究という意義であるならばこれは史学の学徒の間においては一般に行われていることであるから、今さらこと新しくいうには及ばないはずである。</p>
</li>
<li>
<h2>SUCCESS</h2>
<p>ちかごろ世間で日本歴史の科学的研究ということがしきりに叫ばれているということがしきりに叫ばれている。科学的研究というのが近代史学の学問的方法による研究という意義であるならば、これは史学の学徒の間においては一般に行われていることであるから、今さらこと新しくいうには及ばないはずである。</p>
</li>

※背景画像（bgSec04.jpg）は「css」フォルダ内の「style.css」で指定しています。

【7】会社情報部分の編集

グーグルマップ部分はグーグルマップで発行される埋め込みコードを入力して下さい。

<li>
<dl>
<dt>社名</dt>
<dd>Sample Company</dd>
<dt>代表取締役</dt>
<dd>見本太郎</dd>
<dt>住所</dt>
<dd>見本県見本市仮区見本町1-3-5</dd>
<dt>電話番号</dt>
<dd>01234-567-8901</dd>
<dt>設立</dt>
<dd>20XX年5月5日</dd>
<dt>資本金</dt>
<dd>1,000,000円</dd>
<dt>主な取引先</dt>
<dd><p><a href="#" target="_blank">見本商事株式会社</a></p><p><a href="#" target="_blank">株式会社年中無休商事</a></p><p><a href="#" target="_blank">株式会社仮称</a></p></dd>
</dl>
</li>
<li>
<div id="map">
<!– GOOGLE MAP –>
ここにグーグルマップのコードをペースト
<!– // GOOGLE MAP –>
</div>
</li>