Solved: Change Color of "INDICATES REQUIRED FIELD" Label

jacks2 · ‎02-09-2018

I know that the label above forms can't be removed right now, but does anyone know of a way to at least change the color of it in the code? Mine shows up as white on my white background because of the theme I'm using (had to use the dark high contrast theme to get the header and buttons to look how I wanted) which makes it an unreadable and useless feature of a form. I've tried tweaking the code myself, but I'm not a programmer and it's been no use. If anyone has any idea what to do to change the color of those words to black, please let me know.

Site is: https://testingkerri123.weebly.com

CP31 · ‎02-12-2018

I had someone who writes code help me with this, and if you use the html code below in the footer of your website, it will hide that stupid "Indicates required field" label that Weebly deployed. It's so annoying and I asked for help from Weebly and they just told me to remove the required field option on all my fields. THAT is not the work-around. You shouldn't have to see that label. Especially when you have fields lined up horizontally and it throws the first field down in alignment. Sorry, for the rant, but here is the code to put in your footer to hide the label. Just used the html widget to add it to your footer. As for changing the color, they've changed where that is in the html editor, can't help you with that one.

View Best Answer >

Adam7 · ‎02-12-2018

If you want to keep the label but make it visible, you can also use this (added to the Header Code field for the page):

<style>
.wsite-form-label.wsite-form-fields-required-label { color: red !important; }
</style>

View Best Answer >

Bernadette3 · ‎02-09-2018

I'm not sure of the code you would use to change the text, but you could use the Color Block app from the App Center! This way you can change the background color of just the contact form element.

https://www.weebly.com/app-center/color-block?ref=ac-search

bobafett · ‎02-09-2018

Neat....another way to skin a cat.

CP31 · ‎02-12-2018

I had someone who writes code help me with this, and if you use the html code below in the footer of your website, it will hide that stupid "Indicates required field" label that Weebly deployed. It's so annoying and I asked for help from Weebly and they just told me to remove the required field option on all my fields. THAT is not the work-around. You shouldn't have to see that label. Especially when you have fields lined up horizontally and it throws the first field down in alignment. Sorry, for the rant, but here is the code to put in your footer to hide the label. Just used the html widget to add it to your footer. As for changing the color, they've changed where that is in the html editor, can't help you with that one.

Adam7 · ‎02-12-2018

If you want to keep the label but make it visible, you can also use this (added to the Header Code field for the page):

<style>
.wsite-form-label.wsite-form-fields-required-label { color: red !important; }
</style>

wallen · ‎02-12-2019

Being a programmer by profession, I'm completely comfortable patching code. However, I know next to nothing about HTML. Can you be more specific about where to put these three lines of code:

<style>
.wsite-form-label.wsite-form-fields-required-label { color: red !important; }
</style>

I don't know what "the Header Code field for the page" is. Thanks.

Adam7 · ‎02-13-2019

The header code field can be found in Settings > SEO > Header Code. It would also work if added to the Footer Code field in the same place, although it usually makes more sense to keep any CSS rules in the <head> area of a site.

Markinaus · ‎02-14-2018

Markinaus · ‎02-14-2018

Perfect, works as described, thanks CP3.

CP31 · ‎02-14-2018

Happy to help!

silverlinker · ‎02-14-2018

This is the correct answer! Thanks for helping me remove it CP3!

CP31 · ‎02-14-2018

My pleasure!

DressScorecom · ‎07-28-2018

You're a lifesaver!

Or at least a website saver.

https://dressscore.weebly.com/

jbh · ‎08-19-2018

Worked fo rme too! Super great! Thank you!

mitzlafftrader · ‎06-09-2019

awesome! worked perfect

joysmanel · ‎06-15-2019

Gnial !!
Gracias