[ad_1]
Hi Jim,
to be honest, I doubt that this is something that I will build into HD Quiz directly, simply because I do not think that this is a feature that is necessary for the vast majority of users.
As you said, you can place any content you want above the quiz, and I personally do not think that having it stay there during a quiz is in any way an issue.
HOWEVER
HD Quiz is used by more people than just me, which is why I designed and coded it to be very extendable so that even situations like this can be covered.
The following code needs to be added to your theme’s functions.php
file. Make sure to back up the file before modifying. A mistake could crash your site, so have a backup ready!
The code does the following.
- Adds a new content editor to quiz settings under the Advanced Tab “Before Quiz Content”
- Automatically adds that content before the quiz
- Detects when “start quiz” and hides that content
// add new quiz meta for new content
function hdq_merrydown_quiz_settings($meta)
{
$field = array(
"type" => "editor",
"name" => "hdq_before_quiz_content",
"label" => "Before Quiz Content",
"tooltip" => "This content will autohide once quiz starts.",
"value" => ""
);
array_push($meta["advanced"], $field);
return $meta;
}
add_filter("hdq_add_quiz_meta", "hdq_merrydown_quiz_settings", 10, 1);
// add content to the page
function hdq_merrydown_before_quiz($quiz_ID)
{
$quiz_settings = get_hdq_quiz($quiz_ID);
$content = $quiz_settings["hdq_before_quiz_content"]["value"];
echo '<div class = "hdq_before_merrydown_content" style = "margin-bottom: 2rem">';
echo apply_filters("the_content", $content);
echo '</div>';
}
add_action("hdq_before", "hdq_merrydown_before_quiz");
// hide content once Quiz Start button selected
function hdq_merrydown_after_quiz($quiz_ID)
{
?>
<script>
function hdq_merrydown_hide_content_on_start(){
const content = document.getElementsByClassName("hdq_before_merrydown_content");
const start_button = document.getElementsByClassName("hdq_quiz_start");
if(content.length > 0 && start_button.length > 0){
start_button[0].addEventListener("click", function(){
content[0].style.display = "none";
HDQ.scroll();
})
}
}
hdq_merrydown_hide_content_on_start();
</script>
<?php
}
add_action("hdq_after", "hdq_merrydown_after_quiz");