PLEASE NOTE: These forums are no longer utilized and are provided as an archive for informational purposes only. All support issues will be handled via email using our support ticket system. For more detailed information on this change, please see this blog post.

Trying To Set CSS Class Name To Match The Look Of The Site

  1. Rishel
    Member

    Ok, I will try to explain this as clearly as possible.

    We are building a site currently, and are using Gravity Forms. The appearance of the forms we created are located here:

    http://www.netdisciples.com/contact-us/
    http://www.netdisciples.com/membership/

    The default look (the look that was built into the template we are using) is this (which is not gravity forms, but an internal contact form that came with the skin):

    http://www.elegantthemes.com/preview/MyCuisine/contact-us/

    We very much like the look of the larger input boxes etc, it just looks cleaner.

    When we go into form editor (for our Contact Us form which was built by Gravity Forms) there is a section called Form Settings, in that section under the Advanced Tab there is a setting called "CSS Class Name". We can not seem to figure out what to put in there to try to match our new Gravity Forms look to the default skins contact form.

    Essentially, we want the form here: http://www.netdisciples.com/contact-us/ to look (appearance wise) like the form here: http://www.elegantthemes.com/preview/MyCuisine/contact-us/ and we thought the "CSS Class Name" setting did that.

    Even more so, what class name should I put there. If anyone has FireBug and can help you, we would GREATLY appreciate your assistance. We tried to figure this out, for 2 weeks (off and on), and just can't seem to figure it out.

    Anyone help?

    Posted 14 years ago on Saturday August 20, 2011 | Permalink
  2. The CSS Class name option doesn't do anything magical. It simply adds whatever class name you define to the markup for the form or the field element. If you don't define rules in your stylesheet that are associated with that name, nothing is going to happen.

    I'm assuming you want to change the look of all the forms on your site. If so, the easiest way to do this is to add some new style rules to the end of your theme stylesheet. This should get you close. I copied most of these style properties from the form you referenced as your target look.

    CSS Sample : http://pastie.org/pastes/2401792/text

    Give that a shot and see how it goes. ( you may have to update your background image paths ) You can tweak everything from there to suit your preference.

    Test Screenshot: http://bit.ly/oab5Jp

    Posted 14 years ago on Saturday August 20, 2011 | Permalink
  3. Rishel
    Member

    WOW! That was fast response, and it worked awesome. I am completely impressed with the support here.

    Posted 14 years ago on Saturday August 20, 2011 | Permalink
  4. Wonderful. I'm glad I could help out.

    Posted 14 years ago on Saturday August 20, 2011 | Permalink
  5. Rishel
    Member

    Weird, I cant locate the background image on the submit button etc. Definitely looking though. But no match in the images directory.

    Posted 14 years ago on Saturday August 20, 2011 | Permalink
  6. Rishel
    Member

    Roger that, done. Thank you very much Kevin.

    Posted 14 years ago on Saturday August 20, 2011 | Permalink
  7. You're very welcome.

    Posted 14 years ago on Saturday August 20, 2011 | Permalink

This topic has been resolved and has been closed to new replies.