-
rebecca1spAsked on September 19, 2018 at 5:03 PM
I really like the flat look shown in the demo of the Form Tabs widget, and the long, flat style of the next/back buttons in the Line Radio Button demo. How did you get that look? I added the Form Tabs, but it doesn't look the same. I tried the Line Radio Button, but it didn't seem to work. I also tried making the Next/Back buttons wider in the Advanced Designer, but the app wouldn't let me change the width. Is all this because I started with a theme, and don't know how to use CSS?
Page URL: https://form.jotform.com/82616763729165 -
Welvin Support Team LeadReplied on September 19, 2018 at 7:00 PM
It's the Amber Orange theme of the Form Tabs widget. You can select that in the settings:
As for the next/back buttons, inject the following custom CSS codes in your form:
.form-all .form-pagebreak-back, .form-all .form-pagebreak-next {
color: #ffffff !important;
background: #f4ad04 !important;
box-shadow: none !important;
text-shadow: none;
border: none !important;
}
Please follow the steps here to inject the codes: https://www.jotform.com/help/117-How-to-Inject-Custom-CSS-Codes.
As for the line radio button, you mean the demo form, right? That is still in the widget settings. It is the Blue Color scheme.
-
rebecca1spReplied on September 20, 2018 at 3:43 PM
I followed the instructions and changed the theme in the Form Tabs
settings, and injected the code given. The tabs look good, but the Next
button still isn't what I was looking for. I've attached screen shots of
the demo whose look I was trying to achieve, and my form.
Thank you,
Rebecca Pitts
1SimplePhone
DFW 469-320-1111
MO 660-299-1111
MA 774-307-1111
IVR Recording Line 469-998-9144
3620 N Josey Ln, Ste 110
Carrollton, TX 75007
For immediate technical support
Please e-mail support@1simplephone.com
... -
AshtonPReplied on September 20, 2018 at 4:17 PM
We did not receive you screenshot please attach them as guided in this article so we can see what you are trying to achieve. How-to-Post-Screenshots-to-Our-Support-Forum
If you have the sample, we should be able to suggest the custom CSS code for the Next button.
-
rebecca1spReplied on September 20, 2018 at 8:27 PM
-
John_BensonReplied on September 20, 2018 at 11:44 PM
You can clone the demo form and edit the fields by following this guide: https://www.jotform.com/help/42-How-to-Clone-an-Existing-Form-from-a-URL
Also, I noticed on the screenshot you provided, I can see that the other image is a Card Form. Unfortunately, you cannot add custom CSS code to Card Form.
I hope this information helps.