グラフィックカウンターの設置方法





1. 先ずは、ココ をクリックしてください。
すると、cgi のソースリストのページが確認できると思います。1行目は “#!/usr/bin/perl” から始まり、最後は “} ” で終わっていると思います。
その全てを、コピー&ペーストでメモ帳に貼り付け、tclite.cgi として、登録してください。(ブラウザ画面の 〔編集(E)→すべて選択(A)〕で領域指定すると楽です。)

登録する時は、ファイル名はもちろんですが、拡張子( .cgi )を忘れないように!

ここで、重要な注意点があります。1行目の “#!/usr/bin/perl”の部分は、貴方がホームページ用として 利用している、サーバー(プロバイダ)によって書き方が異なります。もし、違っている場合は、この行を書き換えてください。( 書き換えても拡張子は忘れないように! )
一般的には、 “#!/usr/local/bin/perl”と記述するのが多いようですが、ここのパスが違っていると動作しませんので、必ずご利用のプロバイダに確認してください。 ※プロバイダのパスについてはF を見て下さい。


2. 1項と同じく、ココ をクリックしてください。
すると、pl のソースリストのページが確認できると思います。
1行目は “;# ====================================================================” から始まり、最後は “1; ” で終わっていると思います。
その全てを、コピー&ペーストでメモ帳に貼り付け、gifcat.pl として、登録してください。( 拡張子は.plです )

よって、先の1項で作成した “tclite.cgi” と、この2項で作成した “gifcat.pl” の2つを作りました。


3. もう1つ、メモ帳で何も書きこまない空ファイルを作ります。
メモ帳を開き、gcount1.txt ファイルを作成してください。( 拡張子は.txtです )
操作は、 [メモ帳を開く→ファイル(F)→名前を付けて保存(A)→ファイル名(N)→gcount1.txtで保存(S)]です。


4. 次に、カウンター用の数字画像は GIFファイルを使います。
使いたいGIF画像を、フリーで提供してくれるサイトから貰ってきます。
そして、0〜9の数字の画像に、ファイル名をそれぞれに対応して 0.gif、1.gif、〜9.gif としてください。

フリーでGIF画像を提供してくれるサイトは、最後の 「参考」 の欄に紹介しておきます。


5. つぎに、FTPソフトを起動します。 ※FTPソフトについてはF を見て下さい。

FTPソフトが起動したら、あなたのサーバ(貴方のパソコンではありませんよ!念の為・・・)に新しいフォルダーを3つ作ってください。
新規フォルダーの作り方は貴方のパソコンの操作と同じで、右クリックで [新規(N)→フォルダー(F)]を選択して、New Folder(新しいフォルダー)”を作り、 フォルダー名を変更してください。

3つのフォルダー名のフォルダー名はそれぞれ、“lockdir”、“data”、“img” とします。

次に、先ほど作った3つのファイルと0〜9の数字の画像ファイルを、サーバに送り出します。(アップロード)

FTPの転送モードには2種類あります。「テキスト(ASCII)モード」「バイナリー(RAW)モード」です。
1項で作った“tclite.cgi”、2項で作った “gifcat.pl” と3項で作った “gcount1.txt” は「テキストモード」で、4項の画像ファイルは「バイナリーモード」 で転送してください。
アップロードする先が、それぞれ違います。
“tclite.cgi”、“gifcat.pl”は、3つのフォルダーと同じ場所で、“gcount1.txt”は、“data”フォルダーの中に、画像ファイルは“img”フォルダーの中にそれぞれアップロードして下さい。

*** ディレクトリの構成 ***

6. このあと、まだFTPソフトを起動したままで、パーミッション(実行権)というものを設定します。
パーミッションの設定方法は、大抵はFTPソフトで行いますので、各ソフトのやり方にのっとって 慎重に行って下さい。
私の使っている、FTP Explorerでは、[ツール]より、コマンドを入力します。
具体的には、“site chmod xxx yyy”と入力すればOKです。(xxxはパーミッションコード、yyyはファイル名やフォルダー名)
今回の場合を表でまとめると、次の様になります。念のため5項で述べた、FTPの転送モードも併記しておきます。
   
ファイル名パーミッション FTPの転送モード
xxx.htm-バイナリーモード
tclite.cgi705テキストモード
gifcat.pl604テキストモード
lockdir(フォルダー)707-
data(フォルダー)707-
gcount1.txt606テキストモード
img(フォルダー)707-
0.gif〜9.gif604バイナリーモード

全ての設定が完了すれば、もうカウンターが動作するハズです。


7. サンプルのグラフィックカウンターを表示する htmlファイルでは、

<img src="http://sinta.quu.cc/cgi-bin/sinta/advance/grcount/tclite.cgi?gcount1&1" width="210" height="50">

としていますが、赤字の部分を貴方のアドレスに必ず書き変えてください。また、太字の部分も必ず表記してください。

サンプルを参考に、このカウンタを使いたいページの“htmlファイル”  に、

<img src="http://貴方のアドレス/tclite.cgi?gcount1&1" width="210" height="50">

のタグを、組み込んでもらえば完了です。


* * *
参考
  • htmlファイルで、<img src="tclite.cgi?gcount1&1" width="210" height="50">の部分 のパラメータを変えることによって、カウンターの機能を変えることが出来ます。
    <img src="tclite.cgi?@&A&B&C" width="D" height="E">で、
    ・@...カウンター名
    ・A...カウントアップさせる場合は、“1”を設定。(指定なしはカウントアップしない)
    ・B...表示桁数(指定なしは5桁)
    ・C...画像のディレクトリ名(指定なしは “img”)・・・ディレクトリ複数持つと、簡単に画像が差し替えられる 。また、複数のカウンターを動作させるのにも有効。
    ・D...gifファイルの横幅×桁数(単位:ピクセル)
    ・E...gifファイルの縦幅(単位:ピクセル)

  • 画像データ(gifファイル)は、フリーの画像から貰います。
    Counter★ GIF倶楽部 :数字のデザインが中心で、オーソドックスのものが多い。
    柚莉湖 《素材練習室》 :季節ものや、キャラクター系のかわいいデザインです。
    BEVEL :センスの良い、マーク系のデザインです。
    1set*Button&Counter* :センスの良い、マーク系のデザインです。
    1キロバイトの素材屋さん :1キロバイト以下の軽いカウンタ素材が揃ってます。

    いま紹介しましたサイトのデザインにかなり見劣りしますが・・・(^^;;  よろしければ、今回説明で使用した『しんたさんほーむぺーじ』のオリジナルを自由にお使い下さい。 ただし、著作権は放棄していません。





【ご注意】
本ページで紹介するプログラムをご自身での利用は自由ですが、再配布はしないで下さい。
本プログラムの利用に当り、いかなる損害に対して当方は一切の責任を負いません。