Home News Contact Us Forum About Us Demos Products F.A.Q.
Shopping Cart
You currently have 0 items in your cart.


Recent Events
  • 31/12/2023 New Year SALE

    We are glad to announce New Year SALE. 25% discount for all our extensions. Use NY24 coupon code. Hurry up the discount is valid till 7 January.

  • 21/11/2023 BLACK FRIDAY 23 is coming

    BIG SALE, 35% discount for all our extensions. Use BF23 coupon code. Hurry up the discount is valid till 27 November.


2Checkout.com, Inc. is an authorized retailer of goods and services provided by ARI Soft. 2CheckOut




Follow us on twitter



Welcome, Guest
Please Login or Register.    Lost Password?

Custom CSS on 'Start Quiz' and 'Continue' buttons
(1 viewing) (1) Guest
"ARI Stream Quiz" WordPress plugin
Go to bottomPage: 12
TOPIC: Custom CSS on 'Start Quiz' and 'Continue' buttons
#64993
Custom CSS on 'Start Quiz' and 'Continue' buttons 4 Years, 11 Months ago Karma: 0
Can you please provide the targeting for the 'Start Quiz' button - I want to change it to 'Begin Assessment'
I would also like to change the color on the 'Continue' button for multi page quizes, if you can provide that target as well.

Thanks!
The administrator has disabled public write access.
 
#65010
Re:Custom CSS on 'Start Quiz' and 'Continue' buttons 4 Years, 11 Months ago Karma: 748
Hello,

You can read here how to edit an existing translation.

Open "Advanced" tab on "ARI Stream Quiz -> Settings" page and populate "Custom CSS Styles" parameter with the following code to change button background:

Code:


body .asq-theme.asq-theme-buzzfeed .button.button-green {
 background-color: red;
}



Regards,
ARI Soft
The administrator has disabled public write access.
 
#66019
Re:Custom CSS on 'Start Quiz' and 'Continue' buttons 4 Years, 3 Months ago Karma: 0
I also wanted to change the color of all the buttons. I tried putting in that code but it didn't change anything.

I actually want to change button colors to purple #800080 and hover color to #9932CC.
The administrator has disabled public write access.
 
#66021
Re:Custom CSS on 'Start Quiz' and 'Continue' buttons 4 Years, 3 Months ago Karma: 0
I got it sorted.
The administrator has disabled public write access.
 
#66022
Re:Custom CSS on 'Start Quiz' and 'Continue' buttons 4 Years, 3 Months ago Karma: 748
If you still need any help, let us know.

Regards,
ARI Soft
The administrator has disabled public write access.
 
#66030
Re:Custom CSS on 'Start Quiz' and 'Continue' buttons 4 Years, 3 Months ago Karma: 0
I've changed all the buttons successfully, thanks.

However, I'm having trouble changing the color of the progress bar. I found the CSS for it with the inspect tool (I think) ---

body .asq-theme .quiz-progress-bar {
display: none;
position: relative;
height: 16px;
line-height: 16px;
font-size: 12px;
overflow: hidden;
margin-top: 30px;
text-align: center;
padding-right: 90%;
background-color: #f5f5f5;
-webkit-transition: padding 0.6s linear;
-moz-transition: padding 0.6s linear;
-o-transition: padding 0.6s linear;
transition: padding 0.6s linear;
}

However, the "background-color: #f5f5f5;" parameter is of the 'unfinished' part of the progress bar. I can't see/find the code for the green 'finished' part of the progress bar. I want to change it to purple (#800080).

I tried this but it didn't do anything...

body asq.theme.asq-theme-standard .quiz-progress-bar {
color: #f5f5f5;
background-color: #800080;
}

then these 2 variations (just experimenting with inspect tool - I don't actually understand CSS too well!)...

body asq.theme.asq-theme-standard .quiz-progress-bar .data-content {
color: #f5f5f5;
background-color: #800080;
}


body asq.theme.asq-theme-standard .quiz-progress-bar .data-content-init {
color: #f5f5f5;
background-color: #800080;
}

Any help is greatly appreciated.
The administrator has disabled public write access.
 
Go to topPage: 12