You just need to add a reference to the stylesheet (or add <style> tags) in the head of the template that the form is being used in. View the source of the page with the form to figure out the html/class/id structure of the form and then go from there as far as styling it.
The default template resides at ~/umbraco/plugins/umbracoContour/css/defaultform.css. But don't edit it. Do as Tim suggests and disable it in the actual form settings (check "Disable default stylesheet') and then create/modify your own stylesheet. I provide the path for it here so that you can see how the form is styled by default as a reference.
I have found the CSS, made a copy of it and had a look through it, seems a bit confusing. Am used to CSS, but defining where the different textfields go is confusing me.
Issues with form design
Hey,
I need to make a basic form, where there are just 4 input text fields, each with a label next to them, and a submit button underneath.
Sort of like this:
Name ........... Telephone .............
Email ............ Company ..............
SUBMIT
I have no idea how to though! The basic form is just all under each other, and looks quite nasty.
Comment author was deleted
Hey,
You should be able to get the result you want by styling the form with css, so simply disable the default stylesheet and take full control
Hi Tim,
I thought that'd be what I would have to do, but I can't seem to locate a CSS file for it.
You just need to add a reference to the stylesheet (or add <style> tags) in the head of the template that the form is being used in. View the source of the page with the form to figure out the html/class/id structure of the form and then go from there as far as styling it.
The default template resides at ~/umbraco/plugins/umbracoContour/css/defaultform.css. But don't edit it. Do as Tim suggests and disable it in the actual form settings (check "Disable default stylesheet') and then create/modify your own stylesheet. I provide the path for it here so that you can see how the form is styled by default as a reference.
Go to your contour form, hit Setting tab, put a check in the "Disable default stylesheet" checkbox.
Then in your template, create a css file that would style those form fields.
Hi, I have disabled the default one.
I have found the CSS, made a copy of it and had a look through it, seems a bit confusing. Am used to CSS, but defining where the different textfields go is confusing me.
Any hints etc would be appreciated.
You'd probably want to do something with floats or absolute positioning.
For floats, have a look at http://css.maxdesign.com.au/floatutorial/. Take a look at tutorial 4.
is working on a reply...