Required fields: how to remove (or change) red Asterix*?

Hi,

with Chronoforms v5 I would like to remove the red Asterix at required fields but keep the "required validation".

Q1: Is there a way to simply add some lines to the "Load CSS" -> "CSS Code" section?

I tried - for a start - to change the color to blue, and added ".chronoform .fa-asterisk{color:blue !important;}" or ".fa {color: blue !important;}" but it didn't work.

Q2: I have Multiple Pages. Will the Load CSS work for all pages?

Thanks
Carsten

Hi Carsten,

It looks as though you have seen this FAQ?

That should work provided that you have the Load CSS action before the HTML (Render form) action and in the same form event.

You would need to repeat the Load CSS action with each HTML (Render form) action - or you could add the code to a template file if you prefer.

Bob

Hi bob,

this doesn't work. I added the Load CSS with ".chronoform .fa-asterisk{color:blue !important;}" as shown in the images, but the asterixes are still red.

And what would be the line to not show them at all?

Any suggestion?
Carsten

Hi Carsten,

Please post a link to the form so I can take a quick look.

Probably

.chronoform .fa-asterisk{display: none !important;}

will hide it.

Bob

like this?

https://www.burfeind-beratung.de/index.php?option=com_chronoforms5&chronoform=test-form-chronoforms-for-bob

thanks!
Carsten

Thanks! Now it works.

Have no idea thy I don't have this fa-asterisk (not asterix :-) class (I am only half into programming language).

For me it is solved, though.

Carsten

Got it!

Searched for the phrase "fa-asterisk" in the Joomla folder, and found the html.php file "… administrator/components/com_chronoforms5/chronoforms/actions/html/html.php"

if($config->get('required_labels_identify', 1)){
if(strpos($form->params->get('theme', 'bootstrap3'), 'bootstrap3') !== false){
$required_icon = '<i class=\'fa fa-asterisk\' style=\'color:#ff0000; font-size:9px; vertical-align:top;\'></i>';
}else{
$required_icon = '<span style=\'color:#ff0000; font-size:12px; vertical-align:top;\'>*</span>';
}

The "fa-asterisk" only works with form theme "bootstrap3" (in the form editor under "Styles"), and not with "GCoreUI" which I use for style reasons.

Solved 😀

Best
Carsten

Hi burf,

thanks for your last post!
I had the same request and your post gives the answer.

best regards,
kareh