• 追加された行はこの色です。
  • 削除された行はこの色です。
*.NET Ring ナビゲーションバーの設置法 [#qe9130a3]

#contents

.NET Ringに参加しているすべてのサイトにはナビゲーションバーが設置されている必要があります。ナビゲーションバーのサンプルをここで幾つか紹介しますが、このサンプルをそのままご使用していただいても構いませんし、編集あるいは、全く新しいものを作り、使用していただいても構いません。(よいナビゲーションバーができましたら、ぜひ[[こちら>../フォーラム]]で教えてください。また、ナビゲーションバーのサンプルに不備や、こうした方がいいということがありましたら、[[こちら>../フォーラム]]でご報告ください。あまり自信がありません。)

''なお、必ずソース内の「(あなたのID)」をご自分のIDに置換してご利用ください。''

*.NET Ringナビゲーションバーのサンプル [#lafd9298]

**画像を使用したサンプル [#h5b9ed32]

画像を使ったナビゲーションバーです。ページのスタイルシートなどの影響を受けにくいですが、''画像をダウンロードし、ご自分のサーバーにアップロードする必要があります''。

***灰色 [#w43efb5c]

&myhtml(navibar_img,navi_gray.png);

ソース:
#myhtml(textarea,name="gray" cols="60" rows="8" wrap="OFF"){{
<img src="navi_gray.png" alt=".NET Ring" width="121" height="76" border="0" usemap="#map_navi">
<map name="map_navi" id="map_navi">
<area shape="rect" coords="0,0,121,56" href="https://wiki.dobon.net/index.php?plugin=webring&ring=dotnet&id=(あなたのID)&mode=home" target="_blank" alt=".NET Ringのホームへ移動">
<area shape="rect" coords="0,56,40,76" href="https://wiki.dobon.net/index.php?plugin=webring&ring=dotnet&id=(あなたのID)&mode=prev" target="_top" alt=".NET Ringの前のサイトへ移動">
<area shape="rect" coords="40,56,80,76" href="https://wiki.dobon.net/index.php?plugin=webring&ring=dotnet&id=(あなたのID)&mode=list" target="_blank" alt=".NET Ring参加サイト一覧">
<area shape="rect" coords="80,56,121,76" href="https://wiki.dobon.net/index.php?plugin=webring&ring=dotnet&id=(あなたのID)&mode=next" target="_top" alt=".NET Ringの次のサイトへ移動">
</map>
}}

***青 [#u60f83e5]

&myhtml(navibar_img,navi_blue.png);

ソース:
#myhtml(textarea,name="gray" cols="60" rows="8" wrap="OFF"){{
<img src="navi_blue.png" alt=".NET Ring" width="121" height="76" border="0" usemap="#map_navi">
<map name="map_navi" id="map_navi">
<area shape="rect" coords="0,0,121,56" href="https://wiki.dobon.net/index.php?plugin=webring&ring=dotnet&id=(あなたのID)&mode=home" target="_blank" alt=".NET Ringのホームへ移動">
<area shape="rect" coords="0,56,40,76" href="https://wiki.dobon.net/index.php?plugin=webring&ring=dotnet&id=(あなたのID)&mode=prev" target="_top" alt=".NET Ringの前のサイトへ移動">
<area shape="rect" coords="40,56,80,76" href="https://wiki.dobon.net/index.php?plugin=webring&ring=dotnet&id=(あなたのID)&mode=list" target="_blank" alt=".NET Ring参加サイト一覧">
<area shape="rect" coords="80,56,121,76" href="https://wiki.dobon.net/index.php?plugin=webring&ring=dotnet&id=(あなたのID)&mode=next" target="_top" alt=".NET Ringの次のサイトへ移動">
</map>
}}

***赤 [#iba20140]

&myhtml(navibar_img,navi_red.png);

ソース:
#myhtml(textarea,name="gray" cols="60" rows="8" wrap="OFF"){{
<img src="navi_red.png" alt=".NET Ring" width="121" height="76" border="0" usemap="#map_navi">
<map name="map_navi" id="map_navi">
<area shape="rect" coords="0,0,121,56" href="https://wiki.dobon.net/index.php?plugin=webring&ring=dotnet&id=(あなたのID)&mode=home" target="_blank" alt=".NET Ringのホームへ移動">
<area shape="rect" coords="0,56,40,76" href="https://wiki.dobon.net/index.php?plugin=webring&ring=dotnet&id=(あなたのID)&mode=prev" target="_top" alt=".NET Ringの前のサイトへ移動">
<area shape="rect" coords="40,56,80,76" href="https://wiki.dobon.net/index.php?plugin=webring&ring=dotnet&id=(あなたのID)&mode=list" target="_blank" alt=".NET Ring参加サイト一覧">
<area shape="rect" coords="80,56,121,76" href="https://wiki.dobon.net/index.php?plugin=webring&ring=dotnet&id=(あなたのID)&mode=next" target="_top" alt=".NET Ringの次のサイトへ移動">
</map>
}}

***四葉のクローバ [#ff26fc1e]

&myhtml(navibar_img,navi_lucky.gif);

ソース:
#myhtml(textarea,name="gray" cols="60" rows="8" wrap="OFF"){{
<img src="navi_lucky.gif" alt=".NET Ring" width="120" height="80" border="0" usemap="#luckynavi_map">
<map name="luckynavi_map" id="luckynavi_map">
<area shape="rect" coords="10,58,37,78" href="https://wiki.dobon.net/index.php?plugin=webring&ring=dotnet&id=(あなたのID)&mode=prev" target="_top" alt=".NET Ringの前のサイトへ">
<area shape="rect" coords="49,57,72,78" href="https://wiki.dobon.net/index.php?plugin=webring&ring=dotnet&id=(あなたのID)&mode=list" target="_blank" alt=".NET Ring参加サイト一覧">
<area shape="rect" coords="83,58,111,78" href="https://wiki.dobon.net/index.php?plugin=webring&ring=dotnet&id=(あなたのID)&mode=next" target="_top" alt=".NET Ringの次のサイトへ">
<area shape="rect" coords="0,0,120,57" href="https://wiki.dobon.net/index.php?plugin=webring&ring=dotnet&id=(あなたのID)&mode=home" target="_blank" alt=".NET Ringのホームへ">
</map>
}}

**HTMLテーブルを使用したサンプル [#h5ba5b74]

HTMLのテーブルとスタイルシートのみを使用したナビゲーションバーです。基本的にはソースを貼り付けるだけでOKですが、ページにスタイルシートを使っている場合は、このままでは正常に表示されない恐れがあります。なお、スタイルシートの部分は、HTMLヘッダに入れた方がよいでしょう。

***灰色 [#qf70a7e3]

(iframeで表示) 

&myhtml(navibar_html,navi_gray.html);

ソース:
#myhtml(textarea,name="gray" cols="60" rows="8" wrap="OFF"){{
<style TYPE=text/css>
<!--
table.dotnetring { background-color: #202020; width: 121px; height: 76px }
table.dotnetring table.convex { border-right: #515151 1px solid; border-top: #C0C0C0 1px solid; border-left: #C0C0C0 1px solid; border-bottom: #515151 1px solid; background-color: #606060 }
table.dotnetring table.concavity { border-right: #C0C0C0 1px solid; border-top: #515151 1px solid; border-left: #515151 1px solid; border-bottom: #C0C0C0 1px solid; background-color: #808080 }
table.dotnetring table.titleout { width: 119; height: 53; padding: 2px; text-align: center }
table.dotnetring table.titlein { width: 113; height: 49; text-align: center }
table.dotnetring table.button { width: 39; height: 16; text-align: center }
table.dotnetring big { font-weight: bold; font-size: 12pt; font-family: Arial Black }
table.dotnetring small { font-weight: normal; font-size: 7pt }
table.dotnetring a:link { text-decoration:none; color:#FFFFFF }
table.dotnetring a:visited { text-decoration:none; color:#FFFFFF }
table.dotnetring a:active { text-decoration:none; color:#FFFF00 }
table.dotnetring a:hover { text-decoration:none; color:#FF5C41 }
-->
</style>

<table class="dotnetring" width="121" height="76" border="0" cellpadding="0" cellspacing="1" title=".NET関連サイトのウェブリング「.NET Ring」">
<tr><td height="75%" colspan="3">
<table class="convex titleout" width="100%" height="100%" cellpadding="0" cellspacing="0">
<tr><td>
<table class="concavity titlein" width="100%" height="100%" cellpadding="0" cellspacing="0">
<tr><td align="center" valign="middle">
<big>
<a href="https://wiki.dobon.net/index.php?plugin=webring&ring=dotnet&id=(あなたのID)&mode=home" target="_blank" title=".NET Ringのホームへ移動">.NET Ring</a>
</big>
</td>
</tr>
</table>
</td></tr>
</table>
</td></tr>
<tr>
<td width="33%">
<table class="convex button" width="100%" height="100%">
<tr><td align="center" valign="middle">
<small>
<a href="https://wiki.dobon.net/index.php?plugin=webring&ring=dotnet&id=(あなたのID)&mode=prev" target="_top" title=".NET Ringの前のサイトへ移動">前</a>
</small>
</td>
</tr>
</table>
</td>
<td>
<table class="convex button" width="100%" height="100%">
<tr><td align="center" valign="middle">
<small>
<a href="https://wiki.dobon.net/index.php?plugin=webring&ring=dotnet&id=(あなたのID)&mode=list" target="_blank" title=".NET Ring参加サイト一覧">一覧</a>
</small>
</td></tr>
</table>
</td>
<td width="33%">
<table class="convex button" width="100%" height="100%">
<tr><td align="center" valign="middle">
<small>
<a href="https://wiki.dobon.net/index.php?plugin=webring&ring=dotnet&id=(あなたのID)&mode=next" target="_top" title=".NET Ringの次のサイトへ移動">次</a>
</small>
</td>
</tr>
</table>
</td></tr>
</table>
}}

***青 [#hf067844]

(iframeで表示)

&myhtml(navibar_html,navi_blue.html);

ソース:
#myhtml(textarea,name="gray" cols="60" rows="8" wrap="OFF"){{
<style TYPE=text/css>
<!--
table.dotnetring { background-color: #121328; width: 121px; height: 76px }
table.dotnetring table.convex { border-right: #333270 1px solid; border-top: #B2B4DE 1px solid; border-left: #B2B4DE 1px solid; border-bottom: #333270 1px solid; background-color: #383B7C }
table.dotnetring table.concavity { border-right: #B2B4DE 1px solid; border-top: #333270 1px solid; border-left: #333270 1px solid; border-bottom: #B2B4DE 1px solid; background-color: #F5F5FF }
table.dotnetring table.titleout { width: 119; height: 53; padding: 2px; text-align: center }
table.dotnetring table.titlein { width: 113; height: 49; text-align: center }
table.dotnetring table.button { width: 39; height: 16; text-align: center }
table.dotnetring big { font-weight: bold; font-size: 12pt; font-family: Arial Black }
table.dotnetring big a:link { text-decoration: none; color: #383B7C }
table.dotnetring big a:visited { text-decoration: none; color: #383B7C }
table.dotnetring big a:active { text-decoration: none; color: #FFFF00 }
table.dotnetring big a:hover { text-decoration: none; color: #FF5C41}
table.dotnetring small { font-weight: normal; font-size: 7pt }
table.dotnetring small a:link { text-decoration: none; color: #F5F5FF }
table.dotnetring small a:visited { text-decoration: none; color: #F5F5FF }
table.dotnetring small a:active { text-decoration: none; color: #FFFF00 }
table.dotnetring small a:hover { text-decoration: none; color: #FF5C41 }
-->
</style>

<table class="dotnetring" width="121" height="76" border="0" cellpadding="0" cellspacing="1" title=".NET関連サイトのウェブリング「.NET Ring」">
<tr><td height="75%" colspan="3">
<table class="convex titleout" width="100%" height="100%" cellpadding="0" cellspacing="0">
<tr><td>
<table class="concavity titlein" width="100%" height="100%" cellpadding="0" cellspacing="0">
<tr><td align="center" valign="middle">
<big>
<a href="https://wiki.dobon.net/index.php?plugin=webring&ring=dotnet&id=(あなたのID)&mode=home" target="_blank" title=".NET Ringのホームへ移動">.NET Ring</a>
</big>
</td>
</tr>
</table>
</td></tr>
</table>
</td></tr>
<tr>
<td width="33%">
<table class="convex button" width="100%" height="100%">
<tr><td align="center" valign="middle">
<small>
<a href="https://wiki.dobon.net/index.php?plugin=webring&ring=dotnet&id=(あなたのID)&mode=prev" target="_top" title=".NET Ringの前のサイトへ移動">前</a>
</small>
</td>
</tr>
</table>
</td>
<td>
<table class="convex button" width="100%" height="100%">
<tr><td align="center" valign="middle">
<small>
<a href="https://wiki.dobon.net/index.php?plugin=webring&ring=dotnet&id=(あなたのID)&mode=list" target="_blank" title=".NET Ring参加サイト一覧">一覧</a>
</small>
</td></tr>
</table>
</td>
<td width="33%">
<table class="convex button" width="100%" height="100%">
<tr><td align="center" valign="middle">
<small>
<a href="https://wiki.dobon.net/index.php?plugin=webring&ring=dotnet&id=(あなたのID)&mode=next" target="_top" title=".NET Ringの次のサイトへ移動">次</a>
</small>
</td>
</tr>
</table>
</td></tr>
</table>
}}


***赤 [#a19172db]

(iframeで表示)

&myhtml(navibar_html,navi_red.html);

ソース:
#myhtml(textarea,name="gray" cols="60" rows="8" wrap="OFF"){{
<style TYPE=text/css>
<!--
table.dotnetring { background-color: #300000; width: 121px; height: 76px }
table.dotnetring table.convex { border-right: #780000 1px solid; border-top: #FFA9A9 1px solid; border-left: #FFA9A9 1px solid; border-bottom: #780000 1px solid; background-color: #8E0000 }
table.dotnetring table.concavity { border-right: #FFA9A9 1px solid; border-top: #780000 1px solid; border-left: #780000 1px solid; border-bottom: #FFA9A9 1px solid; background-color: #FFF5F5 }
table.dotnetring table.titleout { width: 119; height: 53; padding: 2px; text-align: center }
table.dotnetring table.titlein { width: 113; height: 49; text-align: center }
table.dotnetring table.button { width: 39; height: 16; text-align: center }
table.dotnetring big { font-weight: bold; font-size: 12pt; font-family: Arial Black }
table.dotnetring big a:link { text-decoration: none; color: #9E0000 }
table.dotnetring big a:visited { text-decoration: none; color: #9E0000 }
table.dotnetring big a:active { text-decoration: none; color: #FFFF00 }
table.dotnetring big a:hover { text-decoration: none; color: #FF5C41 }
table.dotnetring small { font-weight: normal; font-size: 7pt }
table.dotnetring small a:link { text-decoration: none; color: #FFF5F5 }
table.dotnetring small a:visited { text-decoration: none; color: #FFF5F5 }
table.dotnetring small a:active { text-decoration: none; color: #FFFF00 }
table.dotnetring small a:hover { text-decoration: none; color: #FF5C41 }
-->
</style>

<table class="dotnetring" width="121" height="76" border="0" cellpadding="0" cellspacing="1" title=".NET関連サイトのウェブリング「.NET Ring」">
<tr><td height="75%" colspan="3">
<table class="convex titleout" width="100%" height="100%" cellpadding="0" cellspacing="0">
<tr><td>
<table class="concavity titlein" width="100%" height="100%" cellpadding="0" cellspacing="0">
<tr><td align="center" valign="middle">
<big>
<a href="https://wiki.dobon.net/index.php?plugin=webring&ring=dotnet&id=(あなたのID)&mode=home" target="_blank" title=".NET Ringのホームへ移動">.NET Ring</a>
</big>
</td>
</tr>
</table>
</td></tr>
</table>
</td></tr>
<tr>
<td width="33%">
<table class="convex button" width="100%" height="100%">
<tr><td align="center" valign="middle">
<small>
<a href="https://wiki.dobon.net/index.php?plugin=webring&ring=dotnet&id=(あなたのID)&mode=prev" target="_top" title=".NET Ringの前のサイトへ移動">前</a>
</small>
</td>
</tr>
</table>
</td>
<td>
<table class="convex button" width="100%" height="100%">
<tr><td align="center" valign="middle">
<small>
<a href="https://wiki.dobon.net/index.php?plugin=webring&ring=dotnet&id=(あなたのID)&mode=list" target="_blank" title=".NET Ring参加サイト一覧">一覧</a>
</small>
</td></tr>
</table>
</td>
<td width="33%">
<table class="convex button" width="100%" height="100%">
<tr><td align="center" valign="middle">
<small>
<a href="https://wiki.dobon.net/index.php?plugin=webring&ring=dotnet&id=(あなたのID)&mode=next" target="_top" title=".NET Ringの次のサイトへ移動">次</a>
</small>
</td>
</tr>
</table>
</td></tr>
</table>
}}

*ナビゲーションバーの自作 [#links]

ナビゲーションバーを自作していただいても結構です。ただし、ナビゲーションバーを故意に隠したり、見え辛くしたり、あまりに小さくしないようにしてください。

ナビゲーションバーに使用するリンクは次のようなものです。この内、「次のサイトへ」、「前のサイトへ」、「リングのホームへ」は必ずナビゲーションバーに付けてください。

-次のサイトへ(''必ず付けてください'')~
https://wiki.dobon.net/index.php?plugin=webring&ring=dotnet&id=(あなたのID)&mode=next

-前のサイトへ(''必ず付けてください'')~
https://wiki.dobon.net/index.php?plugin=webring&ring=dotnet&id=(あなたのID)&mode=prev

-リング内のサイトを一覧表示~
https://wiki.dobon.net/index.php?plugin=webring&ring=dotnet&id=(あなたのID)&mode=list

-リング内のどこかのサイトをランダムに表示~
https://wiki.dobon.net/index.php?plugin=webring&ring=dotnet&id=(あなたのID)&mode=random

-リングのホームを表示します(つまりこのサイト)(''必ず付けてください'')~
https://wiki.dobon.net/index.php?plugin=webring&ring=dotnet&id=(あなたのID)&mode=home

-.NET Ringへの参加フォームを表示~
https://wiki.dobon.net/index.php?plugin=webring&ring=dotnet&id=(あなたのID)&mode=addform

//これより下は編集しないでください
#pageinfo(,2007-05-06 (日) 17:55:01,DOBON!,2007-05-06 (日) 17:55:01,DOBON!)
#pageinfo([[:Category/.NET Ring]],2007-05-06 (日) 17:55:01,DOBON!,2007-05-07 (月) 00:07:23,DOBON!)

[ トップ ]   [ 新規 | 子ページ作成 | 一覧 | 単語検索 | 最終更新 | ヘルプ ]