How do you format forms?

  • 1
  • Question
  • Updated 4 years ago
  • Answered

I've just tried using the forms widget on my free yola site for the first time. It works well except that the resultant text is a light grey colour so not very visible. Is it possible to change the text colour at all? The formatting buttons do not seem to work with forms.

If the only answer is to use a third party forms creator, can anyone please recommend a good one?

Thanks.

Photo of Victor

Victor

  • 7 Posts
  • 0 Reply Likes
  • puzzled!

Posted 4 years ago

  • 1
Photo of Peter

Peter

  • 14 Posts
  • 2 Reply Likes
Yola Form: Change the color of the text that is entered

You can change the color of the text being entered into the form by adding an HTML Code Widget to your page and pasting in some code.

Here is the code:

<style type="text/css">
div.sys_yola_form input.text{
color: #000000;
}
</style>

You'll want to change the color hex code (e.g. #000000) to something other than white. For different color hex codes, please visit: http://www.color-hex.com/.



 

0


Form Widget: Change the submit button font color

If you would like to alter the Form Widget's font color, size, or font-family on the Submit button, you will need to do a bit of HTML coding. 

Please add an HTML Code Widget to the same page as the Form Widget. Then add the following code:

<style type="text/css">
div.sys_yola_form input.submit{
font-family: Comic Sans MS !important;
font-size: 25px; !important;
color: #5dc4d3;
}
</style>

You can adjust the color and size as needed. Refer to the HTML Color Code Chart for additional color codes. If you do not wish to change the font-family, color or size, simply remove the line(s) from the code.

0


How do I edit and change the format of text?

The Style Designer allows you to select a font family, font size, color and more for your body of text and it will apply to all Text Widgets added to your site! Please see How do I add text to my site? for information on how to use the Style Designer to format your text.


You may also like:

Photo of Victor

Victor

  • 7 Posts
  • 0 Reply Likes

Peter

Many thanks for your reply. I did as you said using an HTML code widget but all I get is this line of text at the top of the page and no colour change:

<style type="text/css"> div.sys_yola_form input.text{ color: #000066; } </style>

Any ideas?

Photo of Peter

Peter

  • 14 Posts
  • 2 Reply Likes
Hi Victor
you are right, I tried it on my site.I got this code from the yola forum site, clearly it doesn't work.Sorry
If you want to change the text colour on your form page do the following.
Open your site builder select page > select the page your form is on> Click Style > then click style designer > Advanced >Mouse over the text you want to change and click on the text >Then select colours from the left hand side bar menu > save and publish.
I have just gone through this exercise on my site to make sure this works.
Good luck
Peter
Photo of Victor

Victor

  • 7 Posts
  • 0 Reply Likes
Success! Many thanks.
Photo of Peter

Peter

  • 14 Posts
  • 2 Reply Likes
My pleasure