商用利用可能な無料ホームページテンプレート・無料WordPressテーマ

→編集前のページ：
https://f-tpl.com/sample/tpl_005/subpage.html

→完成した「見本ボランティアセンター」の団体概要ページ：
https://f-tpl.com/sample/volunteer/about.html

1.「tpl_005」フォルダの中にある subpage.html をテキストエディタで開いて下さい。

2.内容は変更せずに別名で保存して下さい。このページでは見本ボランティアセンターの作成例ですので「about.html」を複製して作成しています。

ただし、1点だけ編集する必要があります。

subpage.html のメニューでは「会社情報」の部分に「class="active"」がついていますので現在自分が編集している項目の「li」に「class="active"」を移動しましょう。

※注意：「class="last"」となっている部分に「class="active"」を挿入したい場合には「class="last active"」のように半角スペースを入れて「active」を挿入して下さい。

下記を削除

<section class="content">
<h3 class="heading">ホームページサンプル株式会社の取り組み</h3>
<article>
<img src="images/sample1.jpg" width="190" height="140" alt="" class="alignright border" />
<p>ホームページサンプル株式会社では最新技術と自然との調和を目指します。革新的な技術で世の中を動かす企業を目指します。ホームページサンプル株式会社では最新技術と自然との調和を目指します。革新的な技術で世の中を動かす企業を目指します。ホームページサンプル株式会社では最新技術と自然との調和を目指します。革新的な技術で世の中を動かす。革新的な技術で世の中を動かす企業を目指します。ホームページサンプル株式会社では最新技術と自然との調和を目指します。革新的な技術で世の中を動かす。革新的な技術で世の中を動かす。</p>
</article>
</section>

<section class="content">
<h3 class="heading">ホームページサンプル株式会社の取り組み</h3>
<article>
<img src="images/sample2.jpg" width="190" height="140" alt="" class="alignleft border" />
<p>革新的な技術で世の中を動かす企業を目指します。ホームページサンプル株式会社では最新技術と自然との調和を目指します。革新的な技術で世の中を動かす企業を目指します。</p>
<p>ホームページサンプル株式会社では最新技術と自然との調和を目指します。革新的な技術で世の中を動かす企業を目指します。ホームページサンプル株式会社では最新技術と自然との調和を目指します。革新的な技術で世の中を動かす。革新的な技術で世の中を動かす。</p>
</article>
</section>

変更前

<section class="content">
<h3 class="heading">会社概要</h3>
<article>
<table class="table">
<tr>
<th>会社名</th>
<td>ホームページサンプル株式会社（英語表記 Homepage sample Inc.）</td>
</tr>
<tr>
<th>設立</th>
<td>平成10年1月10日</td>
</tr>
<tr>
<th>事業内容</th>
<td>IT・マーケティング・福祉など</td>
</tr>
<tr>
<th>住所</th>
<td>〒012-3456 見本県見本市サンプル1-2</td>
</tr>
<tr>
<th>電話番号</th>
<td>0123-4567-89012</td>
</tr>
<tr>
<th>メールアドレス</th>
<td>info@example.com</td>
</tr>
</table>
</article>
</section>

変更後

<section class="content">
<h3 class="heading">団体概要</h3>
<article>
<table class="table">
<tr>
<th>団体名</th>
<td>見本ボランティアセンター</td>
</tr>
<tr>
<th>設立</th>
<td>平成20年10月15日</td>
</tr>
<tr>
<th>活動内容</th>
<td>各種ボランティア活動・資金支援・技術援助・環境改善活動など</td>
</tr>
<tr>
<th>所在地</th>
<td>〒012-3456 見本県見本市サンプル1-2</td>
</tr>
<tr>
<th>電話番号</th>
<td>0123-4567-89012</td>
</tr>
<tr>
<th>メールアドレス</th>
<td>info@example.com</td>
</tr>
<tr>
<th>メンバー</th>
<td>50名（2013年時点）</td>
</tr>
<tr>
<th>代表者</th>
<td>見本 太郎</td>
</tr>
</table>
</article>
</section>

下記を削除

<section class="content" id="gallery">
<h3 class="heading">写真ギャラリー</h3>
<article>
<figure class="grid"><a href="subpage.html"><img src="images/gallery1.jpg" width="190" height="140" alt=""></a></figure>
<figure class="grid"><a href="subpage.html"><img src="images/gallery2.jpg" width="190" height="140" alt=""></a></figure>
<figure class="grid"><a href="subpage.html"><img src="images/gallery3.jpg" width="190" height="140" alt=""></a></figure>
<figure class="grid"><a href="subpage.html"><img src="images/gallery4.jpg" width="190" height="140" alt=""></a></figure>
<figure class="grid"><a href="subpage.html"><img src="images/gallery5.jpg" width="190" height="140" alt=""></a></figure>
<figure class="grid"><a href="subpage.html"><img src="images/gallery6.jpg" width="190" height="140" alt=""></a></figure>
</article>
</section>

下記を削除

<h3 class="heading">ホームページサンプル</h3>
<article>
<ul class="list">
<li><a href="subpage.html"><img src="images/thumb1.jpg" width="42" height="42" alt=""></a>サンプル株式会社では最新技術と自然との調和を目指します。</li>
<li><a href="subpage.html"><img src="images/thumb2.jpg" width="42" height="42" alt=""></a>サンプル株式会社では最新技術と自然との調和を目指します。</li>
<li><a href="subpage.html"><img src="images/thumb3.jpg" width="42" height="42" alt=""></a>サンプル株式会社では最新技術と自然との調和を目指します。</li>
</ul>
</article>

下記を削除

<p><a href="subpage.html"><img src="images/side_banner.jpg" width="237" height="63" alt="" class="border" /></a></p>