今日行ったことはサイドバーを修正する作業です。
今日もテンプレートは自分で更新できる最短ホームページテンプレート を使っていきます。
このホームページテンプレートのサイドバーのところを編集します。
<!-- ここがサイドバーです -->
<table width="100%" cellpadding="0" cellspacing="0" style="border:1px solid #B06939; padding:5px; background-color:#ffffff;">
<tr align="left" valign="middle" height="42">
<td background="side-bar3.jpg">
<div style="font-size:11pt;"> <img src="c3.gif" alt=""> <a href="index.html"><strong>トップページ</strong></a></div>
</td>
</tr>
<tr align="left" valign="middle" height="42">
<td background="side-bar3.jpg">
<div style="font-size:11pt;"> <img src="c3.gif" alt=""> <a href="page1.html"><strong>コンテンツ１</strong></a></div>
</td>
</tr>
<tr align="left" valign="middle" height="42">
<td background="side-bar3.jpg">
<div style="font-size:11pt;"> <img src="c3.gif" alt=""> <a href="page2.html"><strong>コンテンツ２</strong></a></div>
</td>
</tr>
<tr align="left" valign="middle" height="42">
<td background="side-bar3.jpg">
<div style="font-size:11pt;"> <img src="c3.gif" alt=""> <a href="page3.html"><strong>コンテンツ３</strong></a></div>
</td>
</tr>
<tr align="left" valign="middle" height="42">
<td background="side-bar3.jpg">
<div style="font-size:11pt;"> <img src="c3.gif" alt=""> <a href="page4.html"><strong>コンテンツ４</strong></a></div>
</td>
</tr>
<tr align="left" valign="middle" height="42">
<td background="side-bar3.jpg">
<div style="font-size:11pt;"> <img src="c3.gif" alt=""> <a href="page5.html"><strong>コンテンツ５</strong></a></div>
</td>
</tr>
</table>
<div style="line-height:40%;"> </div>
今日学んだところは開いたファイルの上記の「コンテンツ」の１～５の部分です。
この部分に自分のホームページのコンテンツを打っていきます。
このように編集しました。
<!-- ここがサイドバーです -->
<table width="100%" cellpadding="0" cellspacing="0" style="border:1px solid #B06939; padding:5px; background-color:#ffffff;">
<tr align="left" valign="middle" height="42">
<td background="side-bar3.jpg">
<div style="font-size:11pt;"> <img src="c3.gif" alt=""> <a href="index.html"><strong>トップページ</strong></a></div>
</td>
</tr>
<tr align="left" valign="middle" height="42">
<td background="side-bar3.jpg">
<div style="font-size:11pt;"> <img src="c3.gif" alt=""> <a href="page1.html"><strong>サービス内容</strong></a></div>
</td>
</tr>
<tr align="left" valign="middle" height="42">
<td background="side-bar3.jpg">
<div style="font-size:11pt;"> <img src="c3.gif" alt=""> <a href="page2.html"><strong>商品情報</strong></a></div>
</td>
</tr>
<tr align="left" valign="middle" height="42">
<td background="side-bar3.jpg">
<div style="font-size:11pt;"> <img src="c3.gif" alt=""> <a href="page3.html"><strong>お申し込み</strong></a></div>
</td>
</tr>
<tr align="left" valign="middle" height="42">
<td background="side-bar3.jpg">
<div style="font-size:11pt;"> <img src="c3.gif" alt=""> <a href="page4.html"><strong>よくある質問</strong></a></div>
</td>
</tr>
<tr align="left" valign="middle" height="42">
<td background="side-bar3.jpg">
<div style="font-size:11pt;"> <img src="c3.gif" alt=""> <a href="page5.html"><strong>問い合わせ</strong></a></div>
</td>
</tr>
</table>
<div style="line-height:40%;"> </div>
次にお気に入りバー編集する作業です
<!-- ここがお気に入りバーです -->
<button onclick="window.external.addFavorite('http://????????.jp/','あああああああああ);" name="お気に入りに追加する" style="height:16pt;text-align:center; margin-top:0pt; line-height:100%; width:145px;">お気に入りに追加する</button>
<div style="line-height:40%;"> </div>
上記の赤色の部分を編集してお気に入りにしたときのタイトルが決めれます
<!-- ここがお気に入りバーです -->
<button onclick="window.external.addFavorite('http://????????.jp/','東京都のダイエット専門店);" name="お気に入りに追加する" style="height:16pt;text-align:center; margin-top:0pt; line-height:100%; width:145px;">お気に入りに追加する</button>
<div style="line-height:40%;"> </div>
このように編集することで
お気に入りにした時にタイトルが東京都のダイエット専門店で登録されるようになります。
これで編集完了です。
これでサイドバーの編集は終わりです。