Toggle button background color and related queries

Hi Abhi,
all of this can be done 🙂

The styler addon as a section called Custom CSS where you can add custom styles to the addon that there are not dedicated options for.

To change the selected toggle background track colour to black:

.hdq_quiz_wrapper .hdq_quiz .hdq_row .hdq-options-check input[type="checkbox"]:checked + .hdq_toggle::before {
  background: #000000 !important;
}

Replace #000000 with the hex value you need.

Different background image per-quiz

This is totally doable with CSS edits as well, but I recommend waiting. I’m releasing an update to the addon later this week, and I’ll add this in as a dedicated feature. The way it will work is that you setup everything with the styler addon as you are currently doing, but then on each individual quiz settings, advanced tab, there will be a new setting to set a custom background image. If you don’t want to wait for this, then you can still do it with CSS. All you need to know is your quiz ID (can be found in the quiz shortcodes).

#hdq_40 .hdq_quiz .hdq_question {background-image: url(###########)}

Replacing 40 with the quiz ID, and ########### with the URL of the image you want.

Words sit under toggle buttons if answers are 5-6 words long. 

I would need to see this on your site to help you. Your theme probably styles labels a certain way, but it should be an easy fix if I can see the interaction with your theme.

Remove hashtags for question numbers, but I want to show the numbers on the quiz slides

.hdq_question_number {display: none !important}

There is also a filter available if you want to replace the # with something else, such as the letter Q, or an emoji, anything!