Couple of Questions 1. CSS styling 2. Sending Emails
Hello,
New to Formulate seems like a brilliant piece of software but having a few minor struggles.
CSS styling - I am trying to fit the form to look like the rest of my website. I have had a look on codepen but don't get it. I was hoping to be able to use the bootstrap styling.
Sending Emails - does this rely on local smtp settings or do I need to setup this somewhere else? I don't have access to the config file so might have issues.
For the email, I believe it uses the smtp settings in the web.config as umbraco itself does.
This option was no good for me either, but there is a very simple inbuilt handler that you can hijack to do whatever you want with the results which would include custom mail sending etc.
I used the 'send' handler and just passed it to a local surface controller method which process the form data.
One thing I would recommend rather than using the Send Data handler to send the data to a controller would be to create your own custom form submission handler. No need to create a Rube Goldberg machine when a mechanism already exists to do it more directly.
I don't even think you really need to create an AngularJS directive.
Note: I don't recommend a custom form submission handler as a solution to the original question, but it's a workable option if need be.
BTW, one more option for utilizing the Bootstrap styles would be to use Formulate selectors in combination with the Bootstrap Sass (i.e., so the Formulate elements inherit the Bootstrap styles). The JavaScript approach you've gone with may work as well, but it may not work all that well for elements that are more dynamic (e.g., the validation errors that get added and removed from the DOM based on user input).
Thanks for reminding me, I hijacked the send data as a quick hack so I could demo to the client, have now implemented a proper custom handler, it was much easier than I expected.
I'm working on some sample styles in Formulate Pro, which currently looks like this (still a work in progress):
Once you pay for Formulate Pro, you can refer to the Sass styles and modify according to your needs. I built it with accessibility in mind, so the placeholders float up to become labels when the field is focused or contains text.
Regarding sending emails, you don't have access to the web.config? That is where you configure SMTP. Note that you don't need an SMTP server locally for this to work. I tend to use Amazon SES for this. You can also use Mailtrap for testing purposes: https://mailtrap.io/
If you really needed to, you could write some code to modify the web.config (Formulate does this, at least the one for Umbraco 7 does before we moved to a JSON config file).
Couple of Questions 1. CSS styling 2. Sending Emails
Hello,
New to Formulate seems like a brilliant piece of software but having a few minor struggles.
CSS styling - I am trying to fit the form to look like the rest of my website. I have had a look on codepen but don't get it. I was hoping to be able to use the bootstrap styling.
Any advice is appreciated.
Hi, I am not the expert, so you may get a better answer from the author, but here goes.
CSS. I have a piec of javascript in my page template that adds classes to the formulate objects
That works well for me.
For the email, I believe it uses the smtp settings in the web.config as umbraco itself does. This option was no good for me either, but there is a very simple inbuilt handler that you can hijack to do whatever you want with the results which would include custom mail sending etc.
I used the 'send' handler and just passed it to a local surface controller method which process the form data.
Thanks for replying, Huw. Good ideas.
One thing I would recommend rather than using the Send Data handler to send the data to a controller would be to create your own custom form submission handler. No need to create a Rube Goldberg machine when a mechanism already exists to do it more directly.
To do that, you'd implement the
IFormHandlerTypeinterface, as shown here: https://github.com/rhythmagency/formulate/blob/v3/master/src/formulate.app/Forms/Handlers/StoreData/StoreDataHandler.csI don't even think you really need to create an AngularJS directive.
Note: I don't recommend a custom form submission handler as a solution to the original question, but it's a workable option if need be.
BTW, one more option for utilizing the Bootstrap styles would be to use Formulate selectors in combination with the Bootstrap Sass (i.e., so the Formulate elements inherit the Bootstrap styles). The JavaScript approach you've gone with may work as well, but it may not work all that well for elements that are more dynamic (e.g., the validation errors that get added and removed from the DOM based on user input).
Thanks for reminding me, I hijacked the send data as a quick hack so I could demo to the client, have now implemented a proper custom handler, it was much easier than I expected.
The CSS has done something so will keep playing.
Thank you for your help
I'm working on some sample styles in Formulate Pro, which currently looks like this (still a work in progress):
Once you pay for Formulate Pro, you can refer to the Sass styles and modify according to your needs. I built it with accessibility in mind, so the placeholders float up to become labels when the field is focused or contains text.
Regarding sending emails, you don't have access to the web.config? That is where you configure SMTP. Note that you don't need an SMTP server locally for this to work. I tend to use Amazon SES for this. You can also use Mailtrap for testing purposes: https://mailtrap.io/
If you really needed to, you could write some code to modify the web.config (Formulate does this, at least the one for Umbraco 7 does before we moved to a JSON config file).
You could also use this package or a similar one to modify the web.config from the back office: https://our.umbraco.com/packages/backoffice-extensions/umbraco-config-editor-manager/
is working on a reply...