CodePeople2

Hello @saralanda

Thank you very much for providing the link. The margin is applied by the style definition:

.form-item, form {
    margin-bottom: 2rem;
}

Located in the https://tulumcharters.com/wp-content/themes/mesmerize-pro/style.min.css file belonging to the theme active on your website.

If you want the styles in the theme not to affect the forms created with our plugin, instead of editing each form separately, you can enter the style definition below through the “Appearance > Customize > Additional CSS” WordPress menu option:

form.cff-form{margin:0;}

Best regards.

Hello @jazura

I’m sorry, it is difficult to answer your question without checking the structure of your form. If you want to preserve the columns’ structure, even on mobiles, you can configure your form as follows:

To create a layout with columns, even on mobiles, follow these steps:

1. Insert the Parent DIV Field:
   Begin by adding a DIV field that will act as the container for the columns.
2. Insert Three Nested DIV Fields:
   Inside the parent DIV, insert three additional DIV fields, one for each column.
3. Assign the CSS Class:
   For each of the three nested DIV fields (corresponding to the columns), add the col-xs-4 class to the “Add CSS Layout Keywords” attribute. This ensures that each column occupies an equal portion of the layout.
4. Include the Definitive Fields:
   Finally, place the desired content or fields inside the corresponding DIV for each column.

Best regards.

Hello @jesus-1

Yes, of course. But I will need more details about your specific case.

I’ll try to describe the process with a hypothetical example.

Assuming you have a field that makes a calculation, the calculation you prefer. Continuing with a similar example fieldname1+fieldname2+fieldname3 and you want to decide the colors with the following rules, if the three fields’ values are less than 10, assign the red color, if at least one field is over 10, assign the color orange, if two of three have values over 10, assign the yellow color, and finally, if the three fields values are over 10, assign the green color. It is a hypothetical example, but you can apply this logic to any other equation.

In this case, the equation would be similar to:

(function(){
let result = fieldname1+fieldname2+fieldname3,
color = 'red',
n = 0;

if(10<fieldname1) n = n+1;
if(10<fieldname2) n = n+1;
if(10<fieldname3) n = n+1;

if(n == 1) color = 'orange';
else if(n == 2) color = 'yellow';
else if(n == 3) color = 'green';

getField(fieldname3|n).jQueryRef().find('input').css('color', color);

return result;
})()

Now the same code, but optimized:

(function(){
let colors = ['red', 'orange', 'yellow', 'green'],
values = [fieldname1,fieldname2,fieldname3],
n = values.filter(element => element > 10).length;

getField(fieldname3|n).jQueryRef().find('input').css('color', colors[n]);

return SUM(values);
})()

Best regards.

Hello @kjou06

You are describing a different situation. The code I recommended previously is based on your initial question, where is feasible to compare them alphabetically. But if you change the date format, you cannot compare them as texts and must convert them into date objects. In this case, the equation would be:

(function(){
let d = DATEOBJ(fieldname123, 'dd/mm/yyyy');
if (d<=DATEOBJ('30/04/2025', 'dd/mm/yyyy')) return 200;
if (d<=DATEOBJ('30/06/2025', 'dd/mm/yyyy')) return 140;
return 110;
})()

Best regards.

Hello @kjou06

I’m sorry, but what you say is incorrect. The use of return instruction stops the evaluation of the equation returning a result, the other lines in the equation are not evaluated.

If the following condition is satisfied

if (d<='2025/04/30') return 200; 

The equation returns 200 and the second condition is never reached.

Have you tested the equation?

Best regards.

Hello @rforcadell

Thank you very much for providing the version number of your plugin copy.

You have installed the free plugin distribution. It allows you to configure the notification email to receive the information collected by the form via email to the email address you enter in the “Destination” attribute:

However, the free plugin distribution does not include the “Copy email to user” section. It allows you to configure the confirmation emails the plugin sends to the users after submitting the form, to the email address entered by the users:

To send the confirmation email to the users you will need to upgrade your plugin copy to the Professional version.

Best regards.

Hello @breakingnewground123

Are you referring to the form in the “Original Creepers – Round Toe” accordion option?

The form will take the area of its container. If you inert the form shortcode into a div with 400px width, the form width will be 400px too (this applies for other container sizes).

However, if you want to apply a max-width to the form directly. You can enter it the “Form Settings > Advanced Settings” tab:

Best regards.