CMS Development

NBraden
参加者

Need help changing the color of "please complete this required field" text in GDPR section of forms

解決

Hi everyone,

 

Newbie to HubSpot here. The color of the asterisk for required fields and the "Please complete this required field" error message that shows up when you don't fill out a required box in a form clashed with the background of some of webpages. I was able to change the color of those things from red to blue by changing our CSS stylesheet and adding HTML snippets to the individual webpage. But I can't figure out how to change the color of the "Please complete this required field" text for the GDPR section where they opt-in to different email subscriptions. Does anyone know how to change this? (The red text in the attached picture is the text I want to change the color of)

 

Screenshot (20).png

0 いいね!
1件の承認済みベストアンサー
Anton
解決策
名誉エキスパート | Diamond Partner
名誉エキスパート | Diamond Partner

Need help changing the color of "please complete this required field" text in GDPR section of forms

解決

Hi @NBraden

 

this is most likelly because the "head HTML" is getting loaded into the {{ standard_header_include}}-hubl in your template. And since it's - in most cases - before your theme-override.css(or similar) the theme-override.css overrides the "head HTML" settings.

 

Things you can do:

1. Try the sledgehammer method

It should look like this:

.legal-consent-container label.hs-error-msg{
color:#0000ff !important;{# blue color #}
}

 

if this works - open your theme css folder and search for the theme-override.css(might be named theme.css or similiar) and place the code(first without !important) at the very bottom. Save it and this should work. 

 

best, 

Anton

Anton Bujanowski Signature

元の投稿で解決策を見る

5件の返信
Anton
解決策
名誉エキスパート | Diamond Partner
名誉エキスパート | Diamond Partner

Need help changing the color of "please complete this required field" text in GDPR section of forms

解決

Hi @NBraden

 

this is most likelly because the "head HTML" is getting loaded into the {{ standard_header_include}}-hubl in your template. And since it's - in most cases - before your theme-override.css(or similar) the theme-override.css overrides the "head HTML" settings.

 

Things you can do:

1. Try the sledgehammer method

It should look like this:

.legal-consent-container label.hs-error-msg{
color:#0000ff !important;{# blue color #}
}

 

if this works - open your theme css folder and search for the theme-override.css(might be named theme.css or similiar) and place the code(first without !important) at the very bottom. Save it and this should work. 

 

best, 

Anton

Anton Bujanowski Signature
NBraden
参加者

Need help changing the color of "please complete this required field" text in GDPR section of forms

解決

Hi, just putting that new code in "head html" section was enough to change it. I guess the "!important" made the difference. Thank you so much!

0 いいね!
Anton
名誉エキスパート | Diamond Partner
名誉エキスパート | Diamond Partner

Need help changing the color of "please complete this required field" text in GDPR section of forms

解決

Hi @NBraden

 

you can modify the color of the error message with the class 

hs-error-msg

So if you want to modify the text of the legal container(GDPR stuff) it's

.legal-consent-container label.hs-error-msg{
color:#ff0000;{# red color #}
}

 

best, 

Anton

Anton Bujanowski Signature
NBraden
参加者

Need help changing the color of "please complete this required field" text in GDPR section of forms

解決

I changed the hex code to blue and inserted the code into the webpage but it didn't work. Any ideas on what I'm doing wrong?Screenshot (22).png

0 いいね!
CMcGahan
メンバー

Need help changing the color of "please complete this required field" text in GDPR section of forms

解決

I assume this has been resolved but adding !important should get it to work

 

Here is some css i added to the landing page in our Hubspot CMS to change the colour and font size of the error messages appearing:

errorColorChange.PNG