「絵皿カウンター」
ライン

top
leftcountcountcountcountcountcountright
under

実際どうなってるか分解してみると…
↓
top
left　countcountcountcountcountcount　right
under
こんな感じです。
数字の部分が実際のカウンターになります。
※このサンプルは動きません。

完成サイズ［幅100×高さ100ピクセル］

花輪を作っていたつもりが、出来上がったらどうみてもお皿…。
でもなかなかカワイイ感じになりました。

ライン
「絵皿カウンター」の作り方。
部品見ただけで分かる方には必要の無い事です。
◇必要な事◇
　１、HTMLが理解できる。
　２、自分でCGIの設置ができる。
　３、プロバイダがCGIの使用を認めている

◇手順◇
　１、下の部品一覧から必要な部品をダウンロードする。
  • このカウンター専用のフォルダを一つ作るのが良いと思います。
  • ファイル名は変更しても構いませんが、そのままの方が分かり易いです。
　２、さらに下のソースをコピーして、カウンターを付けたい場所にペーストする。

　３、下のソースの赤字部分を消して、正しいファイルへのパスを入れる。
  • <!-- と -->の間はコメントです。ブラウザには表示されないので、そのままでOKです。
  • 分かり易い様に改行が入ってますが、詰めてしまってOKです。
  • 各属性の値は変更するとレイアウトが崩れるので注意してください。
　４、CGIを設置する。「CGI呼び出しコード」を消して正しいコードを入れる。
  • このカウンターセットは表示桁数が６桁専用です。
    ６桁のカウンターか、桁数を自由に設定できる物を使ってください。
  • それからオリジナルのgif画像が使用できるという事も必須です。
  • CGIはご自分で探して設置してください。私にはサポートできません。
    私が使わせてもらっているのは「とほほのWWW入門」さんのWwwCounterです。
　 ５、必要なファイルをサーバーにアップロードすれば出来上がりです。

ライン
「絵皿カウンター」部品一覧（全て透過GIF）
上（横100×縦42ピクセル／778バイト）
top赤top青top赤（無地）top青（無地）
左側（横23×縦8ピクセル／116バイト）
left赤left青..
右側（横23×縦8ピクセル／116バイト）
right赤right青..
下（横100×縦50ピクセル／1KB）
under赤under青under赤（無地）under青（無地）
カウンター用数字（横9×縦8ピクセル／55〜57バイト）
　0　1　2　3　4　5　6　7　8　9　
Windowsユーザーの方は画像にカーソルを合わせて
「右クリック」→「名前を付けて画像を保存」でお持ち帰り下さい。

ライン
「絵皿カウンター」ソース
<TABLE BORDER="0" ALIGN="center" CELLSPACING="0" CELLPADDING="0"><TR> <TD WIDTH="100" HEIGHT="42">
<!--上--><IMG SRC="「上」へのパス" WIDTH="100" HEIGHT="42" ALT="top">
</TD></TR>

<TR><TD WIDTH="100" HEIGHT="8">
<!--左--><IMG SRC="「左」へのパス" WIDTH="23" HEIGHT="8" ALT="left" BORDER="0">
<!--カウンター設置--><IMG SRC="CGI呼び出しコード" WIDTH="54" HEIGHT="8" ALT="count" BORDER="0">
<!--右--><IMG SRC="「右」へのパス" WIDTH="23" HEIGHT="8" ALT="right" BORDER="0">
</TD></TR>

<TR><TD WIDTH="100" HEIGHT="50">
<!--下--><IMG SRC="「下」へのパス" WIDTH="100" HEIGHT="50" ALT="under">
</TD></TR></TABLE>

鍵 <<<　　　　カウンター実験室　　　　>>>　。。