Since your initial question was specifically about the Form Build application, I do not think the Styles field is the right way to go. Whatever is specified in the Styles field, all the content is going to be loaded not only in the Form Builder application but also in your live website.
Adding styles through the Styles field to your live website creates some disadvantages. They are probably not critical and most of us usually ignore them. However you have to be aware of them:
- Your custom styles will not be rendered till you also create a custom layout for your pages and add
@Html.RenderFormScripts() there. In my SXA based solutions I am usually go with the default SXA layout and the requirements to customize it always create many issues for me;
- the Styles field render a css link for each file which is specified in the field. That increases the number of HTTP requests to your website and degrade performance. One of top recommendations is always combining all your styles, for forms and other website elements, together and deliver them through the only css file call;
- Style files have to be kept in the specific folder
\sitecore modules\Web\ExperienceForms\css\. It is natural that we organize our solution structure according to our or business needs and best practices. It is sometimes a problem to see something conflicting with our conventions.
- You have to register your custom styles on each form item or you have to customize available out of the box
__Standard Values item of the
Form template. Such the customization adds additional complexity during Sitecore upgrades.
So if it is not
Styles, then what is it?
As an alternative you can quite easily register a new css file in your Form Builder speak application. The steps are very simple:
- Switch to the core database in Sitecore backend
- go to item
- duplicate it and give a meaningful name
- specify your css script in the
- Check the Form Builder application, the script will be loaded too.
As a bonus, you can also minify and bundle all the styles for any speak application. This setting is disabled by default. However you can create a config patch file to enable minification and bundling