Good day, dear blog reader, Wellcome to the weblog bracket. Nowadays I present you a user-pleasant and responsive blogger template for your new internet site. Fast QnA is an unfastened and top-class blogger template. you could download it very easily, by simply clicking on the download button given under. in case you want to test this template earlier than downloading, then click on on the demo button given beneath. in case you are facing any problem in whatever you may contact me on telegram, telegram link is given below.
Description
Fast QnA is designed with the UI dashboard idea, Fast QnA is a sincerely top rate looking blogger template, this template is uploaded through Blog Bracket. Fast QnA is the most well-known blogger template of all time. Fast QnA is the single theme that offers you 100% surety of AdSense. if you are running tough for AdSense then Fast QnA is the one and simplest template for you.
How To Install Blogger Template
Installing a blogger template could be very clean, simply comply with the simple steps to discover ways to deploy a blogger template.
- Open blogger.com
- Then go to Themes
- After that click on edit HTML and delete all the codes
- Now copy all of the codes inside the subject XML document
- Then paste all of the coped codes in blogger edit HTML
- Click on the Save button (Icon)
- Done! Your new theme is ready to customize
Template Features |
---|
Question Answer Feature |
Multiple Choice Feature |
Bangla Font Added |
Sidebar Post Widgets by (Recent, Label, or Comments) |
One-Click Fixed Sidebar |
Footer Ads |
AdSense (In-Feed ADS) on Homepage |
Post ADS 1 and 2 on Post Page |
Exclusive Download Button |
100% Responsive Design |
Auto Translated |
One-Click Dark Mode |
One-Click Boxed Layout |
Mega Menu by Shortcodes |
One-Click Fixed Menu |
Advanced Hero Section |
Responsive YouTube Videos |
Content Table Support |
Advanced Post Share Buttons |
Fully Customizable Background, Widths, Colors, and Fonts |
Big Featured Post Section |
Header Ads |
Custom Copyrights |
Fast Loaded |
SEO Optimized |
MCQ Code
<h2 style="text-align: left;"> Your Question Here </h2> <div class="mcqwarp"> <div class="mcqop"> <div> <span class="op">A</span> </div> <div class="opt">Option A Here</div> </div> <div class="mcqop"> <div> <span class="op">B</span> </div> <div class="opt">Option B Here</div> </div> <div class="mcqop"> <div> <span class="op">C</span> </div> <div class="opt">Option C Here</div> </div> <div class="mcqop"> <div> <span class="op">D</span> </div> <div class="opt">Option D Here</div> </div> </div> <details class="sp notranslate"> <summary data-hide="Hide">Answer:</summary> <p>The correct option is B. <u>CORRECT OPTION</u></p> <p class="note"> <b>Note</b><br /> NOTE HERE </p> </details>
Quiz Code
<div class="quizContainer container-fluid well well-lg">
<div class="text-center" id="quiz1"></div>
<div class="quiz-container">
<div class="question-number">
<h3>
Question <span class="question-num-value"></span> of
<span class="total-question"></span>
</h3>
</div>
<div class="question"></div>
<div class="options">
<div class="option1" id="1" onclick="check(this)"></div>
<div class="option2" id="2" onclick="check(this)"></div>
<div class="option3" id="3" onclick="check(this)"></div>
<div class="option4" id="4" onclick="check(this)"></div>
</div>
<a class="button" style="width: 30% !important; padding-left: 10% !important;" onclick="next()">Next</a>
<div class="answers-tracker"></div>
</div>
<div class="quiz-over">
<div class="box">
<h3>
Good Try!<br />
You Got <span class="correct-answers"></span> out of
<span class="total-question2"></span> answers correct! That's
<span class="percentage"></span>
</h3>
<button onclick="tryAgain()" type="button">TryAgain</button>
</div>
</div>
</div>
<script src="script.js"></script>
<script>
const options=document.querySelector(".options").children;
const answerTrackerContainer=document.querySelector(".answers-tracker");
const questionNumberSpan=document.querySelector(".question-num-value");
const totalQuestionSpan=document.querySelector(".total-question");
const correctAnswerSpan=document.querySelector(".correct-answers");
const totalQuestionSpan2=document.querySelector(".total-question2");
const percentage=document.querySelector(".percentage");
const question=document.querySelector(".question");
const op1=document.querySelector(".option1");
const op2=document.querySelector(".option2");
const op3=document.querySelector(".option3");
const op4=document.querySelector(".option4");
let questionIndex;
let index=0;
let myArray=[];
let myArr=[];
let score=0;
// questions and options and answers
const questions=[
{
q:' বিশ্বের বৃহত্তম মরুভূমি ',
options:['থর মরুভুমি','সাহারা মরুভুমি','গোবি মরুভুমি','সোনোরান মরুভুমি'],
answer:1
},
{
q:'Who is the Prime Minister of India',
options:['Amit Shah','Narendra Modi','Rahul Gandhi','None of the above'],
answer:2
},
{
q:'Where is the capital of India',
options:['New Delhi','Kolkatta','Varanashi','Agra'],
answer:1
}
]
// set questions and options and question number
totalQuestionSpan.innerHTML=questions.length;
function load(){
questionNumberSpan.innerHTML=index+1;
question.innerHTML=questions[questionIndex].q;
op1.innerHTML=questions[questionIndex].options[0];
op2.innerHTML=questions[questionIndex].options[1];
op3.innerHTML=questions[questionIndex].options[2];
op4.innerHTML=questions[questionIndex].options[3];
index++;
}
function check(element){
if(element.id==questions[questionIndex].answer){
element.classList.add("correct");
updateAnswerTracker("correct")
score++;
console.log("score:"+score)
}
else{
element.classList.add("wrong");
updateAnswerTracker("wrong")
}
disabledOptions()
}
function disabledOptions(){
for(let i=0; i<options.length; i++) {
options[i].classList.add("disabled");
if(options[i].id==questions[questionIndex].answer){
options[i].classList.add("correct");
}
}
}
function enableOptions(){
for(let i=0; i<options.length; i++) {
options[i].classList.remove("disabled","correct","wrong");
}
}
function validate(){
if(!options[0].classList.contains("disabled")){
alert("Please Selecto one option")
}
else{
enableOptions();
randomQuestion();
}
}
function next(){
validate();
}
function randomQuestion(){
let randomNumber=Math.floor(Math.random()*questions.length);
let hitDuplicate=0;
if(index==questions.length){
quizOver();
}
else{
if(myArray.length>0){
for(let i=0; i<myArray.length; i++){
if(myArray[i]==randomNumber){
hitDuplicate=1;
break;
}
}
if(hitDuplicate==1){
randomQuestion();
}
else{
questionIndex=randomNumber;
load();
myArr.push(questionIndex);
}
}
if(myArray.length==0){
questionIndex=randomNumber;
load();
myArr.push(questionIndex);
}
myArray.push(randomNumber);
}
}
function answerTrakcer(){
for(let i=0; i<questions.length; i++){
const div=document.createElement("div")
answerTrackerContainer.appendChild(div);
}
}
function updateAnswerTracker(classNam){
answerTrackerContainer.children[index-1].classList.add(classNam);
}
function quizOver(){
document.querySelector(".quiz-over").classList.add("show");
correctAnswerSpan.innerHTML=score;
totalQuestionSpan2.innerHTML=questions.length;
percentage.innerHTML=(score/questions.length)*100 + "%";
}
function tryAgain(){
window.location.reload();
}
window.onload=function(){
randomQuestion();
answerTrakcer();
}
</script>
Download Theme
Note: If you can not download it from Telegram Channel. Please contact me on WhatsApp. I will give you this file.
Video Tutorial
Final Word
Bookmark This Blogger: Blog Brackets
Post a Comment