Quiz Generator Script Ranking+

クイズにランキング機能が付いたクイズジェネレータ ランキングプラス(クイズ作成スクリプト ランキング付き)です。

ランキング機能のないQuiz Generator Script V2.1はこちらです

複数選択式Quiz Generator Scriptはこちらです

複数選択式レベルアップQuiz Generator Scriptはこちらです

特徴

JS設定ファイルを変更するだけで、簡単に4択クイズ+ランキングが作成できます。
ランキングなどの表示・登録はCGI(Perl)で行なっていますが、全てJavaScriptからCGIを制御しています。
設定ファイルを変更するだけで、設定は全てCGIへ送られます。CGIに関する知識は不要です。

導入前に、まずはQuiz Generator Script V2.0をお試しください。
正常に動作確認後、こちらをダウンロードしてください。

サンプルは色々な設定で設置してあります。クイズを実行しお試しください。

ダウンロード

設置方法

ダウンロードしてご覧下さい。

HTMLの記述。

HTMLヘッダ内に記述 Jquery及びJquery.cookieを使用しています。
<script type="text/javascript" src="jquery-1.7.1.min.js"></script> 
<script type="text/javascript" src="jquery.cookie.js"></script> 
<script type="text/javascript" src="quiz-config.js"></script>
<script type="text/javascript" src="quiz-generator-ranking.js"></script>
<link rel="stylesheet" type="text/css" href="quiz-generator-ranking.css" />
HTML body内に記述
<div id="quiz_box"></div>

クイズ設定ファイル(quiz-config.js)の記述

各種設定&問題・回答&得点による振り分けメッセージなど
/*------------------------------------------------------------------------
 * Quiz Generator Script Ranking+ 設定ファイル
 * Copyright 2012 Sawa's Factory
 * http://sawa-s.com/quiz-generator-ranking.html
------------------------------------------------------------------------*/

/*---------- オープニング&クイズ設定 ----------*/
/* クイズボックスの横幅 縦幅*/
var q_w=450;		//横幅 px  min=400
var q_h=380;		//縦幅 px  選択数の増減によって調整してください。3択:330  4択:380   5択:430
/* タイトル */
var q_title="4択クイズ";
/* オープニングメッセージ ボタン */
var opening_msg=[
	"このクイズは4択形式のクイズです。",
	"全部で10問あり、満点は100点です。",
	"あなたは何点取れるでしょうか?",
	"",
	"お名前(ハンドルネーム可)を入力してください。",
	"80点以上ならば一覧&amp;ランキングに登録する事ができます。"
];
var opening_start_button="START";
/* 出題数 */
var q_no=10;
/* 出題順 0-昇順 1-ランダム */
var q_rnd=0;
/* 正解・不正解の表示 0-しない 1-する */
var q_dsp=1;
/* 正解・不正解を表示する場合、表示する秒数 */
var q_dtime=2;
/* 正解・不正解を表示する場合、サウンドを使用  0-しない 1-する */
var q_sound=0;
/* 制限時間(秒) 0-設定なし  */
var q_timer=0;
/* 選択岐をシャッフル 0-しない 1-する */
var q_sfl=1;
/* 正解・不正解を表示する 画像ファイル(入れ替える場合のみ) 不正解画像,正解画像の順 */
var img_file=["image/0a.png","image/1a.png"];
/* サウンドを鳴らす場合のサウンドファイル (入れ替える場合のみ) 不正解サウンド,正解サウンドの順 */
var sound_file=["sound/0.wav","sound/1.wav"];

/*---------- 問    題 ----------*/
var questions = [
 ["問題1", ["選択1-1", "選択1-2", "選択1-3", "選択1-4"], 1, 5]
,["問題2", ["選択2-1", "選択2-2", "選択2-3", "選択2-4"], 1, 6]
,["問題3", ["選択3-1", "選択3-2", "選択3-3", "選択3-4"], 1, 7]
,["問題4", ["選択4-1", "選択4-2", "選択4-3", "選択4-4"], 1, 8]
,["問題5", ["選択5-1", "選択5-2", "選択5-3", "選択5-4"], 1, 9]
,["問題6", ["選択6-1", "選択6-2", "選択6-3", "選択6-4"], 1, 10]
,["問題7", ["選択7-1", "選択7-2", "選択7-3", "選択7-4"], 1, 11]
,["問題8", ["選択8-1", "選択8-2", "選択8-3", "選択8-4"], 1, 12]
,["問題9", ["選択9-1", "選択9-2", "選択9-3", "選択9-4"], 1, 15]
,["問題10", ["選択10-1", "選択10-2", "選択10-3", "選択10-4"], 1, 20]
];

/*---------- エンディング設定 ----------*/
/* 一覧に登録する点数 これを0にするとクイズ参加者全員の得点を登録する。 */
var quiz_clear = 80;
/* 得点振り分けメッセージ*/
var endings = [
	 [100, [
		"<span class='msg_tokuten'> う〜ん、お見事!!</span>"
		,"<span class='msg_tokuten'> !name!!name_keishou! の得点は <strong>満点</strong>でした。</span>"
		,"",
		,"正解数は!seikai_num!問、正解率は!percent!%です。"
	]]
	,[80, [
		"<span class='msg_tokuten'>う〜ん。さすがですね。</span>"
		,"<span class='msg_tokuten'>!name!!name_keishou!の得点は <strong>!tokuten!点</strong> でした。</span>"
		,""
		,"正解数は!seikai_num!問、正解率は!percent!%です。"
		,"再挑戦をお待ちしています。"
	]]
	,[50, [
		"<span class='msg_tokuten'>なかなかやりますね。</span>"
		,"<span class='msg_tokuten'>!name!!name_keishou!の得点は <strong>!tokuten!点</strong> でした。</span>"
		,""
		,"正解数は!seikai_num!問、正解率は!percent!%です。"
		,"再挑戦をお待ちしています。"
	]]
	,[30, [
		"<span class='msg_tokuten'>もうちょっとです。がんばりましょう</span>"
		,"<span class='msg_tokuten'>!name!!name_keishou!の得点は <strong>!tokuten!点</strong> でした。</span>"
		,""
		,"正解数は!seikai_num!問、正解率は!percent!%です。"
		,"再挑戦をお待ちしています。"
	]]
	,[0, [
		"<span class='msg_tokuten'>あれ、わざと間違えたのかな。</span>"
		,"<span class='msg_tokuten'>!name!!name_keishou!の得点は <strong>!tokuten!点</strong> でした。</span>"
		,""
		,"正解数は!seikai_num!問、正解率は!percent!%です。"
		,"再挑戦をお待ちしています。"
	]]
];
/* リスタートのボタン名 */
var restart_button_name="RESTART";
/*---------- 管理モード ----------*/
var pw="0123";

/*--------------- ここからCGI登録、一覧・ランキング表示に関する設定 ---------------/*
/* JavaScriptでCGIを制御しております。
    以下の設定をするだけでCGIへデータが渡されます。 */

/* CGIファイルの場所と名前 CGIが別サーバーの場合はhttp://…から書く */
var cgi_file="cgi/record.cgi";

/* ---------- 名前入力関係の設定 ---------- */
/* 名前の入力 0-匿名(省略)可 1-入力必須 */
var name_input=0;
/* 匿名の場合の名前 */
var tokumei="匿名";
/* 名前のあとの敬称 */
var name_keishou="さん"
/* 名前の最大文字数 */
var name_length=6;
/* クッキー保存期間 日数 */
var cookieExpires=7;
/* クッキーパス */
var cookiePath="/";

/* ---------- 最新のクイズ履歴一覧の設定 ---------- */
/* 一覧に表示する人数 */
var listing_num=20;
/* 一覧の名称 */
var listing_title="最新" + listing_num + "名の履歴一覧";

/* ---------- ランキングの設定 ---------- */
/* ランキングをクリアするタイミング
    0-クリアしない 1-月が変わったらクリアする 2-年が変わったらクリアする
    クイズ運用後に変更すると、クリアされてしまうので注意。 */
var ranking_clear=1;
/* ランキングに表示する人数 */
var ranking_num=20;
/* ランキングの名称 */
var ranking_title="今月のランキング";
/* コメントの入力 0-省略可 1-必須 */
var ranking_comment=1;
/* コメントの最大文字数 */
var ranking_comment_length=12;
/* ランクインした場合の登録メッセージ */
var rankin_msg=[
	"!name!!name_keishou! の得点が <span style='color:red;font-weight:bold;font-size:16px;'>!rank!位</span> にランクインされました。",
	"コメント欄に感想等書いてくれると嬉しいです。",
	"",
	"ランキングに登録するには[登録]を、<br/>登録せず結果を見る場合は[結果表示]をクリックしてください。"
];
/* 一覧及びランキングをクローズするボタン画像 */
var lr_close_button="image/close_button.png";

/* ---------- 一覧&ランキングに出力するソートキーの設定 ---------- */
/* ソートキー */
var sort_key="!tokuten!";
/* 追加キー */
var listing_add_key="!percent!";
/* 一覧及びランキングに表示する名前 */
var sort_key_name=new Array();
sort_key_name['!tokuten!']="得点";
sort_key_name['!seikai!']="正解点数";
sort_key_name['!seikai_num!']="正解数";
sort_key_name['!percent!']="正解率<br/>(%)";

/* ---------- 一覧&ランキングの登録設定 ---------- */
/* 匿名の場合、一覧及びランキングに登録 0-しない 1-する */
var listing_tokumei=1;
/* 匿名の場合、ランキングに登録 0-しない 1-する */
var ranking_tokumei=0;
/* 一覧に重複登録 0-許可する 1-許可しない */
var listing_dupli=1;
/* ランキングに重複登録 0-許可する 1-許可しない  */
var ranking_dupli=1;

Quiz Generator Script Ranking+(quiz-config.js)の解説

Quiz Generator Script V2.0とほぼ同じですが、メッセージなどは配列に入れてあります。
またファイル数が多くなるためフォルダ(ディレクトリ)でファイルを分けてあります。
変数名は一覧をlisting、ランキングをrankingとしています。

var q_w=450;
var q_h=380;

クイズボックスの横幅と縦幅を記述。解答の選択数が5個の場合は縦幅を430以上にしてください。

var q_title="・・・";

クイズのタイトルを記述してください。

var openning_msg=["・・・","・・・",・・・];

オープニングメッセージを記述してください。
配列になっていて表示する際は改行が入ります。
下記にあるタグ・スタイルを指定できます。

var opening_start_button = "START";

スタートボタンの名前を入れてください。例:クイズスタート など。

var q_no=10;

出題数を記述。問題数より少なくても可。多いとエラーになる。
問題数が20問、出題数が10問、ランダム出題の場合、問題の中からランダムに10問出題されます。ランダムですので毎回出題内容が変わります。
問題20問、出題10問、昇順出題の場合は先頭から10問が出題され、残りの10問は出題されません。

var q_rnd=1;

出題順 0-昇順 1-ランダムに出題(一度出題した問題は再出題(重複)しません。)

var q_dsp=1;

正解・不正解の表示 0-表示しない 1-表示する、正解か不正解か分からない事でエンディングが楽しみになるかも?

var q_dtime=2;

正解・不正解を表示する場合、表示する秒数。

var q_sound=1;

正解・不正解を表示する場合、サウンドを 0-使用しない 1-使用する。
使用するにした場合、オープニングメッセージに「※注:音が出ます。」と追加表示されます。

var q_timer=10;

制限時間(秒) 0-設定なし 制限時間を設定するとカウントダウンします。時間切れの場合は不正解となり、次の問題に進みます。

var q_sfl=1;

選択岐のシャッフル 0-しない 1-する
選択岐をランダムに入れ替えることができます。シャッフルするに設定しておけば、以下の選択○-1に正解を置く事が出来ますので、問題数が多い場合には書きやすいと思います。

var img_file=["image/0.png","image/1.png"];

正解・不正解を表示する画像ファイルを入れ替える場合のみ変更してください。
var img_file=["不正解画像名","正解画像名"];、画像ファイルをフォルダに入れる場合はフォルダ名も指定してください。
例:var img_file=["image/fuseikai.png","image/seikai.png"];
画像は透過PNGまたは透過GIFを使った方が綺麗です。

var sound_file=["sound/0.wav","sound/1.wav"];

サウンドファイルを入れ替える場合のみ変更してください。
var img_file=["不正解サウンド名","正解サウンド名"];、サウンドファイルをフォルダに入れる場合はフォルダ名も指定してください。
例:var sound_file=["sound/fuseikai.wav","sound/seikai.wav"];
サウンドファイルはWAV,MIDなどembedタグで動作するものを指定してください。またサウンドファイル先読みしますが、サイズが小さいほうが良いでしょう。

var questions = [
["問題1", ["選択1-1", "選択1-2", "選択1-3", "選択1-4"], 1, 7]
,["問題2", ["選択2-1", "選択2-2", "選択2-3", "選択2-4"], 2, 7] 以下省略
];

[問題文,[解答の選択岐],正解番号,得点]のように記述する。問題数は何問でも続けて書くことが出来ます。例えば100問ある場合は100個列記してください。
問題文はタグ・スタイル(下記参照)を指定できます。

解答の選択岐は複数記述してください。5択の場合は5個書いてください。
正解番号は選択岐の正解の番号(頭から1 2 3 4...と数える)を書いてください。

得点は任意の数字を書いてください。全て10でもOKです。例えば、簡単な問題がある場合、他の問題が10なら2とすることが出来ます。逆に難しい問題は15とする事ができます。これは難しい問題を正解した場合は得点が高くなるという事です。お好きなように得点を配分してください。

総得点の計算方法は、正解した得点の合計÷出題した得点の総合計(出題しなかった問題の得点は含まない)×100を四捨五入します。ですので満点は100点になります。得点の総合計は100にしなくてもOKです。

var quiz_clear = 80;

一覧に登録する点数 これを0にするとクイズ参加者全員の得点を登録する。
またこの得点以上でないとランキングにも登録されません。

例:50、50点以上獲得者が一覧に登録、またランキングに参加できる。
例:0、クイズ挑戦者全員の得点が一覧に登録、また全員がランキングに参加できる。
例:100、満点獲得者のみ一覧に登録、ランキングは意味がなくなりコメント閲覧のみになる。

var endings = [
[100, ["・・・","・・・",・・・]]
,[80, ["・・・","・・・",・・・]]
,[50, ["・・・","・・・",・・・]]
,[30, ["・・・","・・・",・・・]]
,[0, ["・・・","・・・",・・・]]
];

[分岐点数,[エンディングメッセージ(配列)]]のように記述する。
分岐得点は分岐させる得点を書いてください。総得点がこの得点以上の場合、エンディングメッセージを決めています。例は5個ですが幾つでも書くことが出来ます。例えば3つで90,50,0、6つで100,85,50,35,20,0など。必ず最後は0になるようにしてください。最初は100でなくても構いません。90ならば総得点が90点以上のメッセージになります。
エンディングメッセージにはその分岐点数に合ったメッセージを記入してください。タグ・スタイルを指定できます。
エンディングメッセージには以下の文字列(! !を先頭と最後に入れる)を含めることで置換されます。これら全てを使わなくても構いません。どれを使うかはあなたが判断してください。

置換文字列名称解説
!name!名前オープニングで入力した名前(未入力の場合は下記にある匿名)が入ります。
!name_keishou!敬称下記で決めた敬称。
!tokuten!得点得点が入ります。
!seikai_num!正解数正解数が入ります。
!percent!正解率(%)正解数÷出題数×100を四捨五入した値が入ります。
var restart_button_name="RESTART";

リスタートのボタン名を入れてください。例:再挑戦 など

var pw="0123";

管理モードのパスワードです。name_lengthで設定した長さ以内にしてください。
管理モードでは一覧及びランキングのクリアが可能です。
管理モードに入るためには、名前の入力欄にパスワードを入力し、STARTをクリックしてください。

ここからはCGIに関する設定

var cgi_file="cgi/record.cgi";

CGIファイルの場所・ファイル名です。
CGIが別サーバーになる場合はhttp://・・・から記入してください。

var name_input=0;

名前の入力 0-匿名(省略)可 1-入力必須
入力必須にすると名前を入力しないとアラートが出てクイズはスタートしません。

var tokumei="匿名";

名前を入力しなかった場合の名前。例:名無し など

var name_keishou="さん"

名前のあとの敬称。例:さん、様、殿、君 など

var name_length=6;

名前の最大文字数。あまり長いと一覧・ランキング表示で改行されます。

var cookieExpires=7;

クッキー保存期間。日数を入れてください。

var cookiePath="/";

クッキーパス。複数のクイズを設置する場合はそれぞれ指定してください。

var listing_num=20;

一覧に表示する人数。

var listing_title="最新" + listing_num + "名の履歴一覧";

一覧の名称。
例、quiz_clear=80ならばクイズクリア者一覧など

var ranking_clear=1;

ランキングをクリアするタイミング。
0-クリアしない 1-月が変わったらクリアする 2-年が変わったらクリアする
クリアするタイミングは月または年が変わった直後、クイズを実行してCGIアクセスが有った時。設定点数未満でCGIにアクセスがなければクリアされません。

クイズ運用後に変更すると、ランキングクリアされてしまうので注意。
管理モードでご自身でクリアすることも可能。

var ranking_num=20;

ランキングに表示する人数。

var ranking_title="今月のランキング";

ランキングの名称。

var ranking_comment=1;

コメントの入力。 0-省略可 1-必須

var ranking_comment_length=12;

コメントの最大文字数。
長いとランキング表示で改行されます。

var rankin_msg=["・・・","・・・",・・・];

ランクインした場合の登録メッセージ。
下記の置換文字列を含めることができます。

置換文字列名称解説
!rank!ランクランクインした場合の順位が入ります。
!name!名前オープニングで入力した名前(未入力の場合は上記にある匿名)が入ります。
!name_keishou!敬称上記で決めた敬称。
var lr_close_button="image/close_button.png";

一覧及びランキングをクローズするボタン画像。

var sort_key="!tokuten!";
var listing_add_key="!percent!";

一覧とランキングに使用するソートキー、一覧に追加表示できる追加キー。(! !を先頭と最後に入れる)
ソートキーはランキングの順位決めと表示に使用します。
追加キーは一覧表示用に使用します。こちらのキーは表示のみでソートはしません。
運用途中で変更する場合はlisting,rankingデータファイルをクリアしてください。
以下のキーを使用してください。すべてソートキー、追加キーとして指定できます。

文字列名称解説
!tokuten!得点得点が入ります。満点は100です。
!seikai!正解点数questions=で決めた正解の点数合計が入ります。
!seikai_num!正解数正解数が入ります。
!percent!正解率(%)正解数÷出題数×100を四捨五入した値が入ります。
sort_key_name['!tokuten!']="得点";
sort_key_name['!seikai!']="正解点数";
sort_key_name['!seikai_num!']="正解数";
sort_key_name['!percent!']="正解率<br/>(%)";

一覧及びランキングに表示する名前です。

var listing_tokumei=1;

名前が未入力(匿名)の場合、一覧及びランキングに登録 0-しない 1-する
これを”しない”とすると、匿名の場合はランキングにも参加できません。

var ranking_tokumei=0;

匿名の場合、ランキングに登録 0-しない 1-する
匿名でもランキングに登録するか決めます。上のlisting_tokumei=0の場合はこちらは無効です。

var listing_dupli=1;

一覧に重複登録 0-許可する 1-許可しない
同じ人が複数回クイズを実行した場合、一覧に重複させるかを決めるものです。
1-許可しないとした場合、最新の結果が一番上に表示され、古い結果は削除されます。
重複チェックはクッキーではなく、ホスト名を取得して行なっています。名前を変更しても1-許可しないとすると古い結果は消されます。

var ranking_dupli=1;

ランキングに重複登録 0-許可する 1-許可しない
同じ人が複数回クイズを実行しランクインした場合、ランキングに重複させるかを決めるものです。
1-許可しないとした場合、過去(ランキングデータ)のソートキーと比較し、それよりも高い場合は最新の結果が順位付けされ古い結果は削除、低い場合はランキングに登録されません。
重複チェックはクッキーではなく、ホスト名を取得して行なっています。名前を変更しても1-許可しないとすると古い結果は消されます。

タグ・スタイルの指定、注意事項

オープニング・エンディングメッセージと問題文はタグ・スタイルの指定が可能です。
例:<span style='color:#000;font-size:20px;'></span>,
<strong></strong>,<i></i>,<br />,<img src='image-URL' />など

使用できないタグ・文字は、<div id='id'></div>、ダブルクォーテーション、カンマです。ダブルクォーテーションは&quot;またはシングルクオーテーションを使用してください。タグ内もシングルクオーテーションで記述してください。

1ページに複数のクイズを作成したい場合、文字コードが異なる場合、ブログに貼り付けたい場合などダウンロードに付属しているiframe.htmlのようにiframeを使用してください。

問題文に画像を使いたい場合、imgタグを使用できますが、画像が大きい場合はスタイルシート(#quiz_questionのwidth,height、#quiz_wrapのwidth(縦幅は自動計算)、クイズボックスの横幅縦幅の設定)を変更する必要があります。(既定値は最大横幅350px 高さ4文字分64pxくらい)

サウンドを使用しない場合・正解不正解を表示しない場合は、サウンドファイル・画像ファイルは削除してしまって構いません。

StyleSheetです。

スタイルシートの一部
/*------------------------------------------------------------------------
 * Quiz Generator Script Ranking+ スタイルシート
 * Copyright 2012 Sawa's Factory
 * http://sawa-s.com/quiz-generator-ranking.html
------------------------------------------------------------------------*/
@charset "shift-jis";
/* クイズ出題ボックスの設定 */
#quiz_box{
	position: relative;
	overflow: hidden;
/* 背景や位置、文字の設定 お好きなように変更してください。  */
	margin: 0 auto;
	border: 2px outset #396;
	background: #EEFFFF;
	color: #000;
	font-size: 14px;
	font-family: "メイリオ","Meiryo","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","MS Pゴシック", "MS P Gothic","Osaka",Verdana,Arial, Helvetica, sans-serif;
	font-weight: normal;
	letter-spacing: 3px;
	line-height: 120%;
}
/* クイズタイトル */
#quiz_title{
	margin: 10px auto;
	width: 400px;
	height: 30px;
	text-align: center;
	font-size: 18px;
	line-height: 32px;
	background: #366;
	border: 1px solid #339;
	color: #FFE;
}
/* オープニング メッセージ フォントなどは変更可 */
#quiz_msg{
	margin: 1em auto;
	width: 400px;
	height: 300px;
	text-align: left;
	font-size: 14px;
	line-height: 18px;
	letter-spacing: 2px;
}
#quiz_msg p {
	padding-top:2px;
}
/* レベルオープニングメッセージ */
#level_opening_msg{
	margin: 40px auto;
	width: 400px;
	height: 300px;
	font-size: 18px;
	text-align: left;
	font-size: 14px;
	line-height: 20px;
	letter-spacing: 2px;
}
/* レベル-エンディング 得点表示 変更可 */
span.msg_tokuten{
	color: red;
	font-size: 18px;
}
/*--   正解・不正解画像の表示    表示位置(top,left,width)は自由に変えてください --*/
#dsp0, #dsp1 {
	position: absolute;
	top: 80px;
	left: 0px;
	width: 100%;
	margin: 0; padding: 0;
	z-index: 11;
	display:none;
	text-align: center;
}
/* 名前・コメント入力フォーム */
.name_form, .comment_form{
	margin-top:10px;
}
.name_form_in, .comment_form_in{
	padding:3px;
	font-size:15px;
}

/* タイトル 一覧&ランキング表示用 */
#quiz_lr_title{
	margin: 10px auto;
	width: 400px;
	height: 30px;
	text-align: center;
	font-size: 18px;
	line-height: 32px;
	background: #8B0000;
	border: 1px solid #339;
	color: #FFE;
}
/* 一覧&ランキング表示枠 width height はJSで制御   */
#quiz_lr_wrap {
	position: absolute;
	top: 50px;
	left : 5px;
	overflow-x: hidden;
	overflow-y: scroll;
}
/* 一覧&ランキング表示テーブル */
table.lr_table{
	margin:0;
	width:100%;
	border:1px solid #000;
	border-collapse:collapse;
	font-size:14px;
	line-height:14px;
	letter-spacing:1px;
}
/* 一覧&ランキング表示用テーブル要素 */
table.lr_table th{
	padding:3px;
	border:1px dotted #000;
	background-color:#ccc;
	font-weight:bold;
}
table.lr_table td{
	padding:2px;
	border:1px dotted #000;
	background-color:#fff;
	font-weight:normal;
}
table.lr_table td.ranking{
	text-align:center;
	font-weight:bold;
}
table.lr_table td.ranking_date{
	text-align:center;
	font-size:13px;
}
table.lr_table td.listing_date{
	text-align:center;
	font-size:14px;
}
table.lr_table td.sortkey{
	text-align:center;
	font-size:13px;
}
table.lr_table td.addkey{
	text-align:center;
	font-size:13px;
}
table.lr_table td.name{
	text-align:center;
	font-size:13px;
}
table.lr_table td.comment{
	font-size:12px;
}
.quzi_lr_open_button {
	margin: 10px auto;
	width: 250px;
	height: 15px;
	border: 1px outset #ccc;
	font-size: 15px;
	line-height: 15px;
	padding: 2px 0;
	text-align: center;
	background: #87CEFA;
	color: #000080;
	cursor: hand;
	cursor: pointer;
}
/*以下省略。*/

一覧&ランキング処理CGIの記述

record.cgiの先頭
#!/usr/local/bin/perl
#----------------------------------------------------------------------
#   Quiz Generator Script Ranking+
#   Copyright 2012 Sawa's Factory
#   http://sawa-s.com/quiz-generator-ranking.html
#----------------------------------------------------------------------
use strict;
use lib "./lib";
use Jcode;

#一覧&ランキング&設定ファイルの指定
my $listing_file="data/listing.dat";
my $ranking_file="data/ranking.dat";
my $config_file="data/config.dat";
# ------------ 設定ここまで ------------ #
#!/usr/local/bin/perl

一行目 Perl のパス設定
お使いのレンタルサーバ事業者の指定通りに修正してください。

my $listing_file="data/listing.dat";
my $ranking_file="data/ranking.dat";
my $config_file="data/config.dat";

一覧&ランキング&設定ファイルの指定。ディレクトリ及びファイル名を指定。

文字コード

文字コードは全てShift-JISを使用しています。
もし変更する必要がある場合、HTMLファイル、JSファイル、CSSファイルなど全てUTF-8へ変更し、CGIのJcode::convertの部分もutf8に変更してください。

パーミッションの変更

CGIファイル(record.cgi)のパーミッションをレンタルサーバ事業者指定のパーミッションに変更してください。どのサーバでもおおむね 704 もしくは 705 で動作します。

データファイル(dataディレクトリ内のlisting.dat , ranking.dat , config.dat)のパーミッションを 600 もしくは 606 に変更してください。

動作順序

クイズモード

クッキーを読み込み→名前の入力→

  一覧表示をクリック→一覧表示→クローズボタンをクリック→名前入力画面に戻る
  ランキング表示をクリック→ランキング表示→クローズボタンをクリック→名前入力画面に戻る
  (一覧・ランキングともデータがなければアラートで返される。)

STARTをクリック→名前をクッキーに保存→クイズ本体スタート→クイズ終了→

設定点数以上ならCGIへアクセス→
(ランキングクリアチェック[月が変わったらクリア実行など]・listingへ登録・rankingから順位取得)

 ランクインの場合コメントフォームオープン→ランキング登録→ランキング表示

 設定点数未満またはランク外の場合、エンディングメッセージ

   一覧表示をクリック→一覧表示→クローズボタンをクリック→エンディングに戻る
   ランキング表示をクリック→ランキング表示→クローズボタンをクリック→エンディングに戻る
   (一覧・ランキングともデータがなければアラートで返される。)

管理モード

名前の入力→パスワードを入力しSTARTをクリック→管理モード画面→各ファイルクリア(CGIへアクセス、メッセージが返される)→クローズボタンをクリック→名前入力画面に戻る

サンプル

サンプルの問題文などは全て同じ。出題数は変えてあります。
サンプルではソートキー・追加キーの違い、匿名の可・不可、ランキングと一覧表示を比較してご覧下さい。
それぞれ実行またはクリアしてランキングの登録などをご確認ください。

サンプル1

一覧に登録する点数:0、パスワード:00000、匿名:可、ランキング:クリアしない
ソートキー:得点、追加キー:正解数、匿名での登録(一覧:する、ランキング:する)
重複登録(一覧:する、ランキング:する)
設定ファイルはこちら。(右クリックで保存)
パスワードは00000です。管理モードに入ってクリアしても構いません。

サンプル2

一覧に登録する点数:30 (この点数以上の場合のみ一覧に登録・ランキングも登録、未満の場合はCGIへアクセスしない。)
匿名:可、ランキング:月が変わったらクリア
ソートキー:正解数、追加キー:正解率、匿名での登録(一覧:する、ランキング:する)
重複登録(一覧:しない、ランキング:しない)
設定ファイルはこちら。(右クリックで保存)

サンプル3

一覧に登録する点数:50(この点数以上の場合のみ一覧に登録・ランキングも登録、未満の場合はCGIへアクセスしない。)
パスワード:00000、匿名:不可、ランキング:年が変わったらクリア
ソートキー:正解点数、追加キー:得点、匿名での登録(匿名:不可なので無効)
重複登録(一覧:する、ランキング:しない)
設定ファイルはこちら。(右クリックで保存)
パスワードは00000です。管理モードに入ってクリアしても構いません。

複数のクイズを作成する場合は、ディレクトリ(フォルダ)を分けて設置してください。

動作確認

Windows7環境/ IE9 Safari Chromaで動作確認しています。
IE 6.0では動作しますが一部透過されません。

色々な設定での検証は行いましたが、まだ不具合が出るかも知れません。何かありましたらお問い合わせまたは掲示板から連絡お願いいたします。

CGIへアクセスする際、サーバーの負荷状況によっては表示に時間がかかる場合があります。私の環境では長くても1秒程度でしたので、ローディング表示は付けませんでした。

ライセンス

個人利用(非営利)の場合、無償でご利用いただけます。クレジットは削除禁止です。
商用利用・法人使用は有償(1500円)になります。クレジットを削除したい場合も有償(1000円)です。詳しくはこちらをご覧下さい。
再配布・改造しての再配布は禁止させて頂きます。ご自身で改造して使用する場合、クレジットを削除しなければOKです。

このスクリプトを使用した、いかなる損害に対しても開発者は一切の責任を負いません。

このスクリプトを利用した方は、使用報告掲示板に利用報告をして頂けると幸いです。

カスタマイズ

有償にてカスタマイズもお受けいたします。
お問い合わせから詳しいカスタマイズ方法など送信してください。

更新履歴

2012年 4月 7日 公開