Quiz

Hello Virendra,

I will assume that you are using the Boost theme, but it's not important if you're using another theme because we can make adjustments.

As I mentioned earlier, you can place the script in either Site Administration / etc. or within a block. Let's first place the script in a quiz Text block, i.e. a text block that appears on the various pages of a given quiz. We can explore other placement options later.

1. In the quiz settings and under 'Appearance / Show more...', set 'Show blocks during quiz attempts' to 'Yes'.
2. In your Preferences, set the editor to 'Plain text area' (recommended).
3. Click on the quiz icon to get to the 'Quiz' tab page.
4. Add a text block. Place the code below in the 'Content' field of the block. There is no need to give a 'Text block title'. Save changes.
5. Click on the cog icon of the block and select 'Configure text block'.
6. Under 'Where this block appears', set 'Display on page types' to 'Any quiz module page'. Save changes.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.1/jquery.min.js"></script>
<script>
$(document).ready(function() {

  $("#page-mod-quiz-attempt #usernavigation").prepend('<div style="position: relative; padding-top: 5px; left: -30px;"><button class="btn-danger" id="DCen">English</button><button class="btn-danger" id="DChi">हिंदी</button></div>');

  $("#DCen, #DChi").css({"display":"inline-block", "cursor":"pointer", "padding":"5px 16px 8px", "background-color":"red", "color":"#FFF", "border-radius":"20px", "margin-left":"20px", "box-shadow":"-8px 15px 15px #aaa"});

  $("#DCen").mousedown(function(){
    // Format the button.
    $(this).css({"box-shadow":"-3px 3px 6px #aaa", "padding":"6px 16px 7px"});
    $("#DChi").css({"position":"relative", "top":"-1px"});
  });
  $("#DCen").mouseup(function(){
    // Format the button.
    $(this).css({"box-shadow":"-8px 15px 15px #aaa", "padding":"5px 16px 8px"});
    $("#DChi").css({"position":"relative", "top":"0px"});
  });

  $("#DChi").mousedown(function(){
    $(this).css({"box-shadow":"-3px 3px 6px #aaa", "padding":"6px 16px 7px"});
    $("#DCen").css({"position":"relative", "top":"-1px"});
  });
  $("#DChi").mouseup(function(){
    $(this).css({"box-shadow":"-5px 10px 10px #aaa", "padding":"5px 16px 8px"});
    $("#DCen").css({"position":"relative", "top":"0px"});
  });

  $("#DCen").click(function(){
    // Get the current URL.
    let url = window.location.href;
    // Remove any occurrence of &lang=en and &lang=hi in the current URL.
    url = url.replaceAll("&lang=en","");
    url = url.replaceAll("&lang=hi","");
    // Add &lang=en to the current URL.
    window.location.href = url + "&lang=en"
  });

  $("#DChi").click(function(){
    let url = window.location.href;
    url = url.replaceAll("&lang=en","");
    url = url.replaceAll("&lang=hi","");
    window.location.href = url + "&lang=hi"
  });
});
</script>

You should get something like this: