I have 2 forms, 1 in the main section of my web, and other in a slidebar. (Wordpress 2.7 and latest cformsII)

For the first form I need this CSS:

.cform {
    margin:10px auto 0 auto;
    width: 410px;
}

AND FOR THE SECOND this other CSS:

.cform {
    margin:5px auto 0 auto;
    width: 270px;
}

Anybody have the solution / same problem?

Thank you!

The FAQ is not clear.  I should be able to pick a style per form.  So for sidebar forms I can pick the sidebar css.

Hello,

I did like it says here to create to forms. But I can't put it in my side bar. The cfrom widget display the wrong form.

Does anybody can help me on this.

Thanks.

Please give the name of the thread that covers this.  I have been looking to find out why my widgetized sidebar is only displaying the default form and this forum is sending me in circles. Thanks

Oliver, I tried this solution. It doesn't work for forms that use completely different layout — like the sidebar form and the "contact us page" wide form. Even though all css definitions are marked for the FORM#2 with #cforms2form, the FORM#2 still uses the main layout for .CFORM, LABEL, and FIELDSET. And because of it the FORM#2 lookes like a disaster.

I am going to leave it as it is for a couple of days, in case you are curious to see it.

http://www.balloondecorationst…..ontact-us/

Hello. Ok to start off… I've read the FAQ section on how to implement different CSS styles for different forms… I've also read a few threads here and there.

Bottom line… I cannot seem to get the different style for form 2 to work. I am using two forms, a sidebar form and a contact form. Contact form is the default form and the sidebar form has the id="cforms2form"
(this is obtained by checking the HTML source of the page on which the form is placed.)

So I went into wordpress admin > Plug-in Editor > Selected CForms > Selected sidebary-layout.css file to edit > and modified the fields I wanted to modify as stated in the FAQ file: ex:

#cforms2form fieldset {
background:green;
}

This was placed ontop of the default value (style) in the css file.

Save (update settings)… Refresh page… nothing changes.

Is there something that I may be overlooking? Can someone who has actually managed to implement 2 different styles for 2 different forms provide us with a STEP by STEP walk through perhaps? I may have overlooked something while at the same doubting that I have… So any help would be appreciated.

It seems this question is being asked over and over again. If someone manages to help me solve this issue I will write a detailed STEP by STEP walk through for others to use in the future.

Thanks for your help.

Has anybody had any luck with this?

Anything?  Bueller, Bueller, Bueller….

Need a solution "fast"… ;(

John

hi!

quite secure.

but still any software, plugin or cms system (especially Wordpress) can be hacked it just depends on how much time you are willing to invest as an evil spirited person….

P.

sonika said:

See html code of your page (with cforms form), every form has it's own ID in tag <form

• form ID#1 <form id="cformsform"
• form  ID#2 <form id="cforms2form"
• form  ID#3 <form id="cforms3form"
• etc

Use in css file the IDs to overwrite some styles for different forms, example:

• #cformsform .cforms   { width:200px; }
• #cforms2form .cforms   { width:500px; }
• #cforms3form  textarea { background: Red; }

etc

All style rules [for all forms] are inside ONE css file.

This example might be helpful as well.  The scenario is that I have created a custom background image for 2 separate forms.  One of the forms is much longer than the other so I need the CSS to display a different background image for each of the forms. 

CSS for form 1

.cform fieldset.cf-fs1

CSS for form 2

#cforms2form.cform fieldset.cf-fs1

What the CSS for form 2 shows is that I am taking the div for form 2 and adding it in front of the class for form 1.  So now whatever background image URL I add for the #cforms2form div will only apply to the form 2 div.

The same principle would apply for all the other CSS classes / styles contained in whichever cforms CSS sheet you are modifying / adding too.

Ed

BulletProof Security Plugin

I was trying to do the same thing…two forms…one as the contact form on a page and the other a newsletter subscription on the widget sidebar.

I've worked out how to do this pretty easily…and it doesn't matter how many forms you have!

I hop these instructions make sense please let me know if not.

OK I have two forms with names: enquiry-form  and  newsletter-form

I have chosen the minimal.css style as the one I want which sets both forms to the same style.

I used the default minimal.css style for my enquiry-form and just modified it a bit to suit my needs.  So I edited sections such as…..

.cform {
        margin:10px auto 0 auto;
        width: 650px;
    }

and this….

.cform label span {
        /* width:90px; */ /* must be the same as above!*/
        display:block;
        text-align: right;
    }

So that works great for my enquiry-form on my contact page.

Now to style the newsletter subscription form on the widget.

As I mentioned I called this newsletter-form so I style this using the minimal.css settings as a guide…(all these must be inside the minimal.css styling page.

.cform.newsletter-form {
        margin: 2px auto 0 auto;
        width: 200px;
        }

.cform.newsletter-form label span {

        /* width:90px; */ /* must be the same as above!*/

        display:block;

        text-align: right;

    }

So now my widget is styled differently…here's an example of the input boxes…

.cform.newsletter-form input[type="text"] {
    padding: 3px;
    width: 26px;
    }

NOTE:  here I wanted to make sure my checkbox wasn't styled in the same way so I used the [type="text"] format.

So if you add more forms to your wordpress site eg: promotion-form….then you'd still style the minimal.css and add like this…

.cform.promotion-form {

        margin: 2px auto 0 auto;

        width: 200px;

        }

.cform.promotion-form label span {

        /* width:90px; */ /* must be the same as above!*/

        display:block;

        text-align: right;

    }

I hope this helps people out and a little contribution to thank Oliver for writing such a great plugin.

AdSkiRemote