Vamos deixar o MySQL um pouco de lado e ver como podermos criar um quiz usando o PHP. Se você chegou direto nessa página, talvez se interesse em ver a parte 1 e a parte 2 desse tutorial. Mas se quiser seguir em frente, vamos lá:

O que vamos fazer aqui é criar um quiz que irá informar ao usuário quais perguntas ele acertou e quais errou. Nesse caso, vamos partir do script completo, que você pode baixar aqui(quiz.php) e explicar passo a passo como alterá-lo para fazer o quiz que você quer.

<?php
error_reporting(0);

// CONFIGURAÇÃO
$title = "Título do Quiz";
$address = "quiz.php";
$randomizequestions ="yes"; // coloque yes para as perguntas terem uma ordem aleatória. E no para que elas apareçam sempre na mesma ordem
// FIM DA CONFIGURAÇÃO
// #########################################

$a = array( //perguntas e respostas
1 => array(
0 => "Quem descobriu o Brasil?", // pergunta 1
1 => "Cristóvão Colombo", // respostas da pergunta 1
2 => "Pedro Álvares Cabral",
3 => "Visconde de Sabugosa",
4 => "Fernando de Magalhães",
6 => 2 //número da opção correta
),
2 => array(
0 => "Quanto é 2+2?", // pergunta 2
1 => "1", // respostas da pergunta 2
2 => "2",
3 => "3",
4 => "4",
6 => 4 //número da opção correta
),
3 => array(
0 => "Qual o valor de pi?", // pergunta 3
1 => "3,4",//respostas da pergunta 3
2 => "2,5",
3 => "5",
4 => "3,14",
6 => 4 //número da opção correta
),
//para adicionar mais uma pergunta é só copiar uma pergunta acima e mudar a numeração da pergunta para 4, 5 e assim por diante. Ficaria assim:
/*4 => array(
0 => "Qual o valor de pi?", // nova pergunta
1 => "3,4",//opções de respostas
2 => "2,5",
3 => "5",
4 => "3,14",
6 => 4 //número da opção correta
),*/
);

$max=3; // número de perguntas. Para adicionar mais perguntas, vc precisa alterar esse número para o novo total de questões

$question=$_POST["question"] ;

if ($_POST["Randon"]==0){ // esse script verifica se você quer que as questões apareçam em ordem aleatória
if($randomizequestions =="yes"){$randval = mt_rand(1,$max);}else{$randval=1;}
$randval2 = $randval;
}else{
$randval=$_POST["Randon"];
$randval2=$_POST["Randon"] + $question;
if ($randval2>$max){
$randval2=$randval2-$max;
}
}

$ok=$_POST["ok"] ;

if ($question==0){
$question=0;
$ok=0;
$percentaje=0;
}else{
$percentaje= Round(100*$ok / $question);
}
?>

<HTML><HEAD><TITLE>Responda as perguntas de múltipla escolha: <?php print $title; ?></TITLE>

<SCRIPT LANGUAGE='JavaScript'>
<!--
function Goahead (number){
if (document.percentaje.response.value==0){
if (number==<?php print $a[$randval2][6] ; ?>){
document.percentaje.response.value=1
document.percentaje.question.value++
document.percentaje.ok.value++
}else{
document.percentaje.response.value=1
document.percentaje.question.value++
}
}
if (number==<?php print $a[$randval2][6] ; ?>){
document.question.response.value="Acertou!"
}else{
document.question.response.value="Errou!"
}
}
// -->
</SCRIPT>

</HEAD>
<BODY BGCOLOR=FFFFFF>

<CENTER>
<H1><?php print "$title"; ?></H1>
<TABLE BORDER=0 CELLSPACING=5 WIDTH=500>

<?php if ($question<$max){ ?>

<TR><TD ALIGN=RIGHT>
<FORM METHOD=POST NAME="percentaje" ACTION="<?php print $URL; ?>">

<BR>Percentual de respostas corretas: <?php print $percentaje; ?> %
<BR><input type=submit value="Next >>">
<input type=hidden name=response value=0>
<input type=hidden name=question value=<?php print $question; ?>>
<input type=hidden name=ok value=<?php print $ok; ?>>
<input type=hidden name=Randon value=<?php print $randval; ?>>
<br><?php print $question+1; ?> / <?php print $max; ?>
</FORM>
<HR>
</TD></TR>

<TR><TD>
<FORM METHOD=POST NAME="question" ACTION="">
<?php print "<b>".$a[$randval2][0]."</b>"; ?>

<BR>     <INPUT TYPE=radio NAME="option" VALUE="1" onClick=" Goahead (1);"><?php print $a[$randval2][1] ; ?>
<BR>     <INPUT TYPE=radio NAME="option" VALUE="2" onClick=" Goahead (2);"><?php print $a[$randval2][2] ; ?>
<?php if ($a[$randval2][3]!=""){ ?>
<BR>     <INPUT TYPE=radio NAME="option" VALUE="3" onClick=" Goahead (3);"><?php print $a[$randval2][3] ; } ?>
<?php if ($a[$randval2][4]!=""){ ?>
<BR>     <INPUT TYPE=radio NAME="option" VALUE="4" onClick=" Goahead (4);"><?php print $a[$randval2][4] ; } ?>
<?php if ($a[$randval2][5]!=""){ ?>
<BR>     <INPUT TYPE=radio NAME="option" VALUE="5" onClick=" Goahead (5);"><?php print $a[$randval2][5] ; } ?>
<BR>     <input type=text name=response size=8>

</FORM>

<?php
}else{
?>
<TR><TD ALIGN=Center>
Quiz encerrado
<BR>Percentual de respostas corretas: <?php print $percentaje ; ?> %
<p><A HREF="<?php print $address; ?>">Volte para o início</a>

<?php } ?>

</TD></TR>
</TABLE>

</CENTER>
</BODY>
</HTML>

Baixe o arquivo, descompacte e abra num editor de códigos (eu sugiro o Sublime Text, que é muito bom e gratuito). A primeira parte do código a ser alterada é a que contém as configurações do quiz:

// CONFIGURAÇÃO
$title = "Título do Quiz"; //insira aqui o título do quiz
$address = "quiz.php"; // esse é o arquivo pro qual o usuário poderá voltar no fim do quiz
$randomizequestions ="yes"; // coloque yes para as perguntas terem uma ordem aleatória. E no para que elas apareçam sempre na mesma ordem
// FIM DA CONFIGURAÇÃO
// #########################################

Agora é hora de inserir as perguntas e respostas do quiz. Esse modelo de quiz só permite uma resposta certa, que é indicada no último item da pergunta.

$a = array( //perguntas e respostas
1 => array(
0 => "Quem descobriu o Brasil?", // pergunta 1
1 => "Cristóvão Colombo", // respostas da pergunta 1
2 => "Pedro Álvares Cabral",
3 => "Visconde de Sabugosa",
4 => "Fernando de Magalhães",
6 => 2 //número da opção correta
),
2 => array(
0 => "Quanto é 2+2?", // pergunta 2
1 => "1", // respostas da pergunta 2
2 => "2",
3 => "3",
4 => "4",
6 => 4 //número da opção correta
),
3 => array(
0 => "Qual o valor de pi?", // pergunta 3
1 => "3,4",//respostas da pergunta 3
2 => "2,5",
3 => "5",
4 => "3,14",
6 => 4 //número da opção correta
),
//para adicionar mais uma pergunta é só copiar uma pergunta acima e mudar a numeração da pergunta para 4, 5 e assim por diante. Ficaria assim:
/*4 => array(
0 => "Qual o valor de pi?", // nova pergunta
1 => "3,4",//opções de respostas
2 => "2,5",
3 => "5",
4 => "3,14",
6 => 4 //número da opção correta
),*/
);

$max=3; // número de perguntas. Para adicionar mais perguntas, vc precisa alterar esse número para o novo total de questões. Você também pode inserir mais perguntas, mas manter o número aqui menor para que o quiz mostre apenas 3 (ou mais) perguntas do total cadastrado. Assim você terá, por exemplo, 10 perguntas, mas só mostrar aleatoriamente 3 de cada vez.

Pronto. Feitas as alterações, é só salvar o arquivo quiz.php e salvá-lo no servidor que você criou no tutorial 1. O quiz estará disponível no endereço SUAURL.com/quiz.php. A tela inicial do quiz ficará assim:

Página inicial do quiz.

Pronto, mais uma pequena amostra de interação numa página web pronta. Parabéns!

Tags:
Categories: programação