Form Markup Customization

Jim Piller asked on July 26, 2021 20:15

I have a client project where the client wants to use the form builder to build out their forms, but the markup that Kentico produces does not line up w/ the design / markup that we have already created. I found this answer that talks about customizing the markup for a given form field. Is there any other way to customize the form markup and still allow the content creator to use the form builder?

I know I can also create custom form components for the form builder, but it seems like a huge waste of time to re-create textbox components when this already exists. Plus, if the content creator wants to add a control I don't have customized, then I have to go in and make a new component anyway. Doesn't seem like a good long-term solution. Just looking for best practice on how to handle this?

Recent Answers


Sean Wright answered on July 27, 2021 03:34

Jim,

If you have access to the source code, you can override the Razor views of the built-in Form Components by placing custom Razor view files at the right paths.

Or you can use the option presented in the answer you linked to, which is the recommended solution for custom markup and classes.

Finally, you can use the approach you mentioned - creating custom Form Components.

I also know of some teams that have used the Form Builder, but created their own custom rendering logic from the Form Builder XML.

0 votesVote for this answer Mark as a Correct answer

Jim Piller answered on July 27, 2021 13:34

Sean,

thanks for the answer. I do have access to the CMS project source code, but where would I find the markup for the individual controls? I don't necessarily want to change all that b/c then upgrades would break those changes, but I'd like to at least know where they are rendered from. Also, what is the Form Builder XML?

Thanks

0 votesVote for this answer Mark as a Correct answer

Sean Wright answered on July 27, 2021 19:36

Jim,

In the source solution look for MVC -> Kentico.Content.Web.Mvc.Views -> Views -> Shared -> Kentico -> FormBuilder | FormComponents.

I believe if you re-create Views under the same path (~/Views/Shared/Kentico/...) with the same name in your application, MVC will use your files instead of the ones included in the Razor class library.

For the Form Builder configuration, there are 2 parts.

In the CMS_Form table there is the FormBuilderLayout column that defines how the Form Builder UI is structured for a given form. This is serialized JSON.

In the CMS_Class table there is the ClassFormDefinition column which is all the configuration for the Form that gets rendered on the live site, which you can find for all your forms with this query:

select * from CMS_Class where ClassTableName like 'Form_%'

This column is serialized XML.

0 votesVote for this answer Mark as a Correct answer

   Please, sign in to be able to submit a new answer.