Page 1 of 1
Re: CSS form styling question for Formbuilder
Posted: Sun Mar 23, 2008 12:02 am
by Dr.CSS
If you are looking at the form at see a CSS field then render the page the CSS is actually in the page HTML above the form, you may want to look at copy/pasting it into a new style sheet and take it out of the field...
Most fields have the ability to take a CSS class in the advanced tab of the field, you name the class then use it in your styling...
Re: CSS form styling question for Formbuilder
Posted: Wed Apr 09, 2008 8:39 pm
by Caesonia
mark wrote:
If you are looking at the form at see a CSS field then render the page the CSS is actually in the page HTML above the form, you may want to look at copy/pasting it into a new style sheet and take it out of the field...
Most fields have the ability to take a CSS class in the advanced tab of the field, you name the class then use it in your styling...
What?
See, I see the CSS, but where is that file? I've looked down in the source, I have looked down in the database. Where is the bloody file?
Why is this stuff hidden?
Re: CSS form styling question for Formbuilder
Posted: Wed Apr 09, 2008 9:05 pm
by Dr.CSS
It is not a file it is a "Static Text" field type, meaning it is like all the other field types just in static text form, when I opened it I couldn't see it until I turned off the WYSIWYG...
You can either use/change it or copy/paste it into a style sheet to attach to the template and delete that field....
Re: CSS form styling question for Formbuilder
Posted: Tue Oct 14, 2008 7:09 am
by Dr.CSS
When you go to Extensions » Form Builder and click the name of the form say Sample form you will see a Field Name css click this and you will see a blank Static text to display: edit box, if not using tiny editor I have no idea how to see the code as I stopped using it years ago but yes try using html source view, if tiny click the Turn WYSIWYG on/off check box to see CSS code, should look like this...
This is what I say should be in a separate style sheet attached to the page template as it will throw warnings in validation and are just sample styles...
Render means open page with form in it, view the page in browser, and then right click to view source, there you should see the ID or class assigned to the divs with the fields in them, like input or textareas...
There is a field in formbuilder called "CSS" that is there when I am building a form - is this what you are talking about?
This is where the CSS code is not where you build form...
When you say static text field type do you mean this is in the advanced tab for each field that I create? If that is blank, what then? Does it default to no style in this case?
This the field that the CSS uses, somewhere to put some static text...
In other fields like clicking "Modules you'll be using together" you will find the Advanced tab, here you can assign a class to this field that can be used to style this field...
The amount of ppl. looking at this post may only relate to the amount of ppl. that may want to try to help, if they are having the same problem they would most times add to the post or start another...
If you just add the sample form to a page using {cms_module module='FormBuilder' form='sample_form'} then in the page source view you will see the CSS call at the top with the code I pasted above...
Re: CSS form styling question for Formbuilder
Posted: Fri Feb 13, 2009 9:49 pm
by Dr.CSS
"With reference to the CSS field where the class .forbuilderform is located. I assume that this is the same field where I define the classes for the rest of the fields if I wish?"
To give the other fields a class you need to open/edit the field and go to the advanced tab where you find a edit earea to add the class to the field...
The CSS field that comes with the default sample form is just a sample of css you can/could use...
Putting all the css in it's own style sheet or into an existing one is best, and to get it to effect the form you just attach it to the page template like all the other style sheets...
Go to Layout > Templates and click the CSS icon on the right, then you see all attached style sheets, with a drop down that has all the style sheets you have, you will/can hilite one and hit the Attach Stylesheet button to attach it...
Re: CSS form styling question for Formbuilder
Posted: Sat Mar 14, 2009 5:28 pm
by jayPjay
Thx for the explanation on this, I got that far also and made a pretty good contactform by filling in the new css in the "FormBuilder Default Style" Stylesheet. The CSS Class is called "contactform"
Now I´m building another form but I cant attach another stylesheet to it.
I made a new one, "newformstyle", connected it to my template -> and used it in the Formbuilder as CSS Class for the new form.
The new style doesnt load, the form shows without any style using the "Default form template" - Why?
If I change the CSS class to "contactform" it shows with the styling from my first form and that is, as mentioned connected to the "Formbuilder Default Style" stylesheet.
Seems like there is no way I can sort this out, or do one of you pro´s know what to do?... I need 4 forms on my page
