Adding form ID and name

Resolved tikoim
(@tikoim)

2 years, 1 month ago

Hi,

currently Ninja Forms only displays <form> in source code.

Some plugins such as Matomo need a form “name” and “ID” for identifying the form. (see Matomo setup)

Is there a way to add name and/or ID? e.g.

<form name=”cloud_login”>…</form>

<form id=”cloud_login”>…</form>

Would be thank you

Viewing 4 replies - 1 through 4 (of 4 total)

Faisal Ahammad
(@faisalahammad)

2 years, 1 month ago
Hi,

I have not set up Matomo before. You can try the following JavaScript code in the child theme’s JS file or use the “Simple Custom CSS and JS” plugin as shown in the screenshot below. This code will add the “cloud_login” CSS ID to every form on your website.

Code:
```
jQuery(document).ready(function($) {
    $('.nf-form-cont').each(function() {
        $('.nf-form-cont form').attr('id', 'cloud_login');
    });
});
```
Code integration using plugin:

https://ww.wp.xz.cn/plugins/custom-css-js/

Final result:

Give it a try, and let me know how that goes! 😄
Shaylee
(@shayleehansen30)

2 years, 1 month ago
Hello,

Thank you for reaching out and for providing this information. I also want to acknowledge and appreciate @faisalahammad efforts in assisting with troubleshooting on this issue.

Currently, Ninja Forms does not automatically add specific name or ID attributes to the form tag, which might be required by some analytics plugins like Matomo. However, you can customize your forms to include these attributes by adding a custom code snippet.

You can add a custom ID or name to your form by using Ninja Forms’ hooks and filters. Here is a basic example of how you can do this:
```
add_filter( 'ninja_forms_render_form_attrs', function( $attrs ) {
    $attrs['id'] = 'cloud_login'; // Set your desired ID here
    $attrs['name'] = 'cloud_login'; // Set your desired name here
    return $attrs;
});
```
Please add this code to your theme’s functions.php file or a custom plugin. If you need detailed guidance on implementing this, or if there are other aspects of form customization you’d like to discuss, don’t hesitate to contact our Customer Success team.
Thread Starter tikoim
(@tikoim)

2 years, 1 month ago

Hello,

thank you very much for help! This works.

One more point: I got several forms and it would be great to separate e.g. contact forms vs application forms by a specific name or ID. With the method above all forms got the same name or ID.

Maybe this could be implemented in future versions of Ninja Forms.

Viktor Nagornyy
(@viktorix)

1 year, 12 months ago

@shayleehansen30 I checked the latest version of NF and it doesn’t have “ninja_forms_render_form_attrs” filter. Is this a correct filter to use?

Viewing 4 replies - 1 through 4 (of 4 total)

The topic ‘Adding form ID and name’ is closed to new replies.