BUAT QUIZ GOOGLE SITE MENGGUNAKAN TIMER GOOGLE FORM

Diposting oleh Wisnurat 3:37 AM 5 comments

Tutor.Okeguru.Com - Buat quiz google site menggunakan timer google form.

Pa Wisnu. Post tetang "Timer Google Form Tanpa Add On" kan utk digunakan diblog. Nah, bisa gak kalau diimplementasikan di Google Site ?

Pertanyaan diatas yang mendorong saya utk membahas Timer Google Form yang diimplementasikan di dalam Google Site. Pada prisnipnya bisa saja. Tapi perlu ada beberapa penyesuaian kode.

Contoh Timer Google Form di Google Site

Ini hasilnya. Google form yang diberikan timer. Kemudian ditampilkan di Google site. Teman - teman bisa klik tombol "Lihat Contoh" untuk mencoba quiz dengan timer yang saya simpan di Google site.

Lihat Contoh

Cara Membuat Timer Google Form Untuk Google Site

Bagaimana cara mengimplementasikannya ?

Yuk, kita simah aja di video ini !

Timer Google Form Code Generator

Judul Tes

Link Google Form

Waktu Tes (menit)

Batas Waktu Klik Submit Sebelum Soal Hilang (menit)

Pesan Setelah Waktu Habis

Tampilan Border

Warna Background

Warna Teks

KETERANGAN
Generate Quiz Code : untuk menampilkan kode.
Reset Code : untuk me-reset isi data kode.
Copy Code : meng-copy code yang sudah dihasilkan.


<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">

<body> 

  <div id="timer" align="center"><a class="fa fa-book"></a> okeganti || Waktu Tersisa  <a class="fa fa-clock-o"></a> <span id="time"></span></div>

<span id="form">
<iframe src="okeganti">Tunggu yaa</iframe><br />
</span>
</body>

<script>

function startTimer(duration, display) {
    var timer = duration, minutes, seconds;
    var batas = timer + 60*okeganti ;
    setInterval(function () {
        minutes = parseInt(timer / 60, 10);
        seconds = parseInt(timer % 60, 10);

        minutes = minutes < 10 ? "0" + minutes : minutes;
        seconds = seconds < 10 ? "0" + seconds : seconds;

        display.textContent = minutes + ":" + seconds + " Menit";

        if (--timer < 0) {

           document.getElementById("timer").innerHTML = "okeganti";
        }
    if (--batas < 0) {

           document.getElementById("form").style.visibility = "hidden";
           document.getElementById("timer").style.visibility = "hidden";
        }

    }, 1000);
}

window.onload = function () {
    var fiveMinutes = 60 * okeganti,
        display = document.querySelector('#time');
    startTimer(fiveMinutes, display);

};

</script>

<style type="text/css">
  
body {
    overflow: visible;
}

iframe {

height: 600px;
width: 100%;
border: 0px;
padding-top: 8px;
margin: 0px
}

#timer {
background-color: okeganti;
color: okeganti;
font-family: arial;
font-weight: bold;
padding: 10px 30px;
border-radius: okegantipx;
}

</style>

Seperti itulah cara membuat quiz google site menggunakan timer google form. Mudah kan. Silahkan di coba yaa.

Jika ada penjelasan yang kurang jelas atau ada kesalahan, silahkan tulis di kolom komentar.

Karena berbagi itu indah, bagikan artikel ini untuk saling berbagi informasi.
Salam inovasi, Salam implementasi.
~☺~

Wisnurat Teacher, Public Speaker, Writer, Blogger, Education Content Creator and Enterpreneur.

5 comments for "BUAT QUIZ GOOGLE SITE MENGGUNAKAN TIMER GOOGLE FORM"

Anonymous January 2, 2023 at 9:42 AM

izin bertanya, ini codenya dicopy kemana ya? terima kasih

Wisnurat January 3, 2023 at 4:29 AM

code-nya bisa di paste pada laman posting blogger. Seperti ditunjukkan di dalam video.
Atau paste di google sites, dengan menggunakan menu embed/sematkan --> pilih mode sematkan code.

Delete

Reply Delete

winersiregar March 15, 2023 at 10:13 PM

Selamat malam, izin bertanya : Saya sudah coba buat timer digoogle site, google form, tapi ketika saya sematkan dan publisakan yang terlihat di HP/android hanya timer saja sedangkan soal google formnya tidak muncul sama sekali, mohon bantuan penjelasan dan solusinya, terima kasih

Wisnurat March 16, 2023 at 5:56 AM

ada 2 hal yg bisa dilakukan.
1. Coba buka google site nya menggunakan laptop. Jika tidak tampil, artinya ada kesalahan kode yang disematkan.
2. Jika saat buka dilaptop, timer dan quiz nya tampil. Sedangkan saat menggunakan Smartphone tidak tampil. Hal ini bisa dikarenakan adanya delay tarik data ke perangkat Smartphone.

Delete

Reply Delete

Anonymous January 8, 2024 at 2:12 PM

kak mau bertanya, kan saya ada setting setelah submit ada pemberitahuan yang dimana di notes itu ada link WA nya ( atau link url lainnya ) nah pas di klik itu gak bisa kak linknya pasti eror, tapi kalau saya mencoba gform tanpa timer, link itu berfungsi, kira kira gimana ya kak biar link itu bisa diklik disaat saya memakai kode timer ini

Reply Delete

Komentar anda sangat membantu dalam menyempurnakan konten web ini. Silahkan isi kotak komentar dengan bijaksana.