Not sure I am 100 percent sure of what you are after but if I understand correct you would like to style the rendered forms from the episerver forms module for end visitors? If so you can either just create your own css and use the classes already available in the markup from the forms-module. Another approach is to have a look in the forms.config and find out what path you have for your views. Then creat your own path and views in that exact folder in your solution. Here you can either copy the developed views from episerver and add your own or you create your own views from scratch. I prefer using the first approach, copy and add your own markup/css and then use these in your own css-files.
This link might help you: https://world.episerver.com/documentation/developer-guides/forms/configuring-episerver-forms/
"Disabling the default stylesheet
Episerver Forms has a default stylesheet (EPiServerForms.less), using BEM methodology to name CSS classes and decorate HTML element tags; it is a very fundamental, minimal .less file, and easy to modify. If you do not want this, you can turn it off by using the following configuration.
injectFormOwnStylesheet="true" .."
Also to note if you extract the forms packages to a local directory and change the formElementViewsFolder="~/Views/Shared/ElementBlocks" as described here https://world.episerver.com/documentation/developer-guides/forms/configuring-episerver-forms/ you can adjust the markup of all form components as you see fit changing any html strucutre or class names. Just make sure to leave any dynamic stuff or jquery validation.
Thank you very much Eric and scott reed for your eply and time consideration,if i apply the styles(CSS) in form.config it will be effect on through out the application(ex:Registration form and contactus form), but i want to customize with diffferent styles to different form(ex:registration and contactus form).
Thanks,
Kartheek.
If you go down my recommendation of extending the form markup you can put some logic in the FormContainerBlock.asxc markup that could dynamically set a css class for the forms. This could be specifically looking for something tha indicates the difference of form implicitly or you could look at extending the form system to add a styling option in the form settings allowing you to select the form styling when the form is creation allowing for a more reusable experience.
Hi,
You can create you own model for formcontainerblock that inherits the baseclass. If you do that you can add properties for selecting diffrent stylings. Then you can use @scotts sugestion to use that property to change classes or whatever :)
https://world.episerver.com/documentation/developer-guides/forms/creating-a-custom-form-block/
Yes as myself and Eric has stated the model would be far more reusable across multiple form instances.
Does anyone know of a way to configure the css directory that Forms looks for to apply the styling?
I wan't to apply my own stylings but don't really want to go peaking into the .Zip file in the modules/ directory as this will make it difficult to maintian going forward, e.g. I'll have to cherry pick things if I ever want to upgrade the forms module in the future. It doesn't feel like this is the best practice for applying custom forms stylings.
Edit: I know I can apply my own CSS style as an override, but it still doesn't feel like best practice as I would need to use the !important flag to override those stylings from the .less file...
EDIT2: Never mind - I've just found out how it can be switched off - https://world.episerver.com/documentation/developer-guides/forms/configuring-episerver-forms/
Hi Guys,
i want to apply my own styles to EPIServer forms field,can any one help me out of this.
Thanks,
Ramkee.G