戻る






(サンプルの画像はソザイヤPOMO様のものです。※CGIには付属しません)

カレンダーにマークを付けるだけのシンプルなものです。

  • スタイルシート用ファイルを修正してデザイン変更が可能です
  • マークに使用する画像をブラウザ上からアップロード出来ます
  • 土日祝の文字色の変更などが可能です
  • 祝日は自動で判定します
  • 画像は、jpg, gif, png のみ許可しています
  • 複数人での利用を想定していないのでロック機能はありません
  • Javascriptが動作しないと正常に保存出来ません
  • CGI.pmが動作しないとご利用頂けません


  • このCGIでは当サイトの著作権表示がありません。
    ご利用の際は、お使いになるページのどこかにリンクを貼って下さるようお願い致します。
    見えるようならば表示形式は問いません。
    リンク先 -> http://www.ace-cgi.jp/

     サンプル/ダウンロード

  • サンプル 使用例
  • 設定画面


  • ダウンロード (Ver1.0)
    初期デザインはページ上部サンプル同等のものです。
    修正は下記「カスタマイズ」やダウンロードファイル内のstyle.cssをご参照下さい。

     設定

    mark.cgi
    #!/usr/local/bin/perl  ←お使いのサーバに合わせて下さい
    
    use File::Basename;
    use CGI;  ←CGI.pmが使えないサーバではご利用頂けません
    
    〜 途中省略 〜
    
    #------------------------------------------------
    # 環境に合わせて修正
    #------------------------------------------------
    $pass = "pass";  ←管理者パスワードです。必ず変更して下さい
    @week = ('日','月','火','水','木','金','土');  ←カレンダーの曜日表記です。日曜〜土曜の順に記述します
    $title = "mark";  ←タイトル
    $imgmax = 10;  ←アップロード画像の最大サイズを指定します(KB)
    
    〜 以下処理 〜

     設置

    パーミッション(カッコ内の数値)はサーバにより異なりますのでお使いのサーバに合わせて下さい。
    mark[755] ┬ mark.cgi   [755]
              ├ mark.txt   [666]
              ├ style.css  [644]
              ├ left.gif   [644]
              ├ right.gif  [644]
              ├ space.gif  [644]
              ├ jcode.pl   [644]
              ├ holiday.pl [644]
              ├ cgi-lib.pl [644]
              └ img        [777]
    
    ※この色はフォルダです

     使用方法

    mark.cgi?mode=set でパスワード入力画面が表示されます。
    パスワードを入力すると設定画面へと移行します。



    (1) 使用する画像をアップロードします

    「参照」ボタンを押してパソコン内のファイルを選択し「画像アップロード」ボタンを押すことによりアップロードされます。
    アップロードされたファイルは、上の枠内に追加表示されます。
    ファイルはデフォルトで10KBを上限としています。
    上限の変更は出来ますが、あまり大きな画像は適しません。

    (2) アップロードした画像を削除します

    画像の下のチェックボックスをONにして「チェックした画像を削除」ボタンを押すことにより画像が削除されます。
    削除した画像を過去に使用していた場合、表示が出来なくなりますのでご注意下さい。

    (3) 日付に画像を割り当てます

    日付横のラジオボタンを選択し、割り当てたい画像をクリックすると、日付の右側に画像が表示されます。
    対象月の割り当てたい日付にすべて設定した後「保存」ボタンを押すと、画面が変わってカレンダーが更新されて表示されます。
    割り当てを解除したい場合は日付横の「消」ボタンを押します。

    (4) 対象月を変更します

    で前の月へ、 で次の月へ移動します。

     カスタマイズ

    style.cssを修正する事である程度のデザインカスタマイズが可能です。
    クラス、ID 説明
    .font_sun 日曜の文字色
    .font_sat 土曜の文字色
    .font_hol 祝日の文字色
    #calendar カレンダー全体
    .calendar_sub カレンダータイトル(2008年4月の所)
    .calendar_week_L カレンダー週タイトル左のマス(日曜の所)
    .calendar_week_R カレンダー週タイトル右のマス(土曜の所)
    .calendar_week カレンダー週タイトル中央(月曜〜金曜の所)
    .calendar_day_L カレンダー左側(日曜欄)のマス
    .calendar_day_R カレンダー右側(土曜欄)のマス
    .calendar_day カレンダーその他(月〜金欄)のマス
    .calendar_day_sp カレンダー空白のマス(内部に指定が無ければ日〜土が有効になります)

     更新履歴

  • 初版リリース(08/04/23)