You may want to
customize QuoTool wizards, so they blend into your landing page design seamlessly. We made it simple for anyone with text editor to
control wizards appearance.
It Helps Conversions!About 40% of people convert better if the landing page is pretty or the application process is animated with cool (but not cheesy) visual effects.
Change Background Opacity
You can change wizard background opacity with
&style=bkc: parameter.
Syntax:
your_wizard_id&style=bkc:transparent;
This makes your wizard background
transparent.
Change Background Color
You can change the wizard background color with
bkc: parameter.
Syntax:
your_wizard_id&bkc:rgb(100,100,200)
or
your_wizard_id&bkc:rgba(100,100,100,0.5)
This changes wizard's
background color.
Transition Animation
By default, all wizards "slide" to the left, when "Continue" button is clicked. It's nice, but you can make it even more fun by using
tran: parameter that controls the "next step"
transition animation.
Syntax:
your_wizard_id&style=tran:fade
Possible tran values:
fade, pop, flip, turn, flow, slidefade, slide, slideup, slidedown, none
For iPods and iPads transition animation is automatically disabled to avoid iOS screen freeze bug.Try It Live!Here is the code that uses both transparent background and flow-style transition effect.
Syntax: add ";" separator in order to combine two parameters.
<script id='quotool-widget' type='text/javascript' src='//quotool.com/apps/mtg/ widget?wid=
your_widget_id&style=bkc:transparent;tran:flow'></script>
Click to
See It Live.