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.

Gravity Forms and Thesis

Gravity Support Forums » Plugin Support » Gravity Forms

  1. John Preston
    Member

    Looking to put GF into Thesis. Do I pull out the css file from GF and then place .custom in front of everything in the Thesis custom css file?

    John

    Posted 12 years ago on Thursday June 9, 2011 | Permalink

  2. Kevin Flahaut
    Administrator

    You shouldn't need to do that. When a form is added to the page, it will automatically load the default stylesheet. You can place custom styles wherever your theme allows so you may want to consult the DIY themes support team about their recommendations for that.

    Posted 12 years ago on Thursday June 9, 2011 | Permalink

  3. John Preston
    Member

    Hi Kevin,

    I've added about 150 custom GF css entries so far with no results. It appears that I'll have to add ALL of them to figure out which ones will work. Thesis is really annoying.

    .custom .custom .custom everything...

    Posted 12 years ago on Friday June 10, 2011 | Permalink

  4. John Preston
    Member

    Kevin, I've .customed the whole dang thing. It still doesn't work. What's interesting are things that are showing up on my form like "gform_fields top_label" but I can't seem to find in the forms.css file. How many css files are there in GF? Where do I find the other ones?

    Posted 12 years ago on Friday June 10, 2011 | Permalink

  5. Kevin Flahaut
    Administrator

    John, you shouldn't have to change any of the css files that come with Gravity Forms, you simply need to add the styles to your theme properly. A lot of people use GF + Thesis without issue. I think we've got some sort of disconnect here.

    Can you post a URL to your form page so I can take a look? If I can see what's going on I can help to get you on track.

    Posted 12 years ago on Saturday June 11, 2011 | Permalink

  6. John Preston
    Member

    Thanks Kevin,

    http://www.k9toronto.com/contact/

    Specifically, to start, the First and Last labels should appear under the input boxes and in smaller fonts in the forms preview, but they now appear to the right of their boxes and in the same font as the rest of the form.

    But more generally, what do you suggest to approach further adjustments? I'm using Firebug to see the classes on my form(s) and then looking into the css files that came with GF to see how I might try to code them in Thesis's custom css file, but it's a tad overwhelming.

    Posted 12 years ago on Saturday June 11, 2011 | Permalink

  7. Kevin Flahaut
    Administrator

    John,

    I can see the big issue here is that the default Gravity Forms styles aren't being loaded at all. That's why the label positions and other things look strange.

    Did you embed your code in the content area with a shortcode, or did you use the php function to manually add the form? If you did use the shortcode method, go to the form settings page and confirm that the "output CSS" option is set to yes.

    Let me know and we'll debug it from there.

    Posted 12 years ago on Saturday June 11, 2011 | Permalink

  8. John Preston
    Member

    Thanks Kevin,

    I'm now outputting to css and the form looks like it should. How do I go about customizing it from here? Do I make changes to forms.css v1.5.2.3? And I guess this gets overwritten with the next upgrade to GF or is there a custom css file that can be linked to it?

    Posted 12 years ago on Saturday June 11, 2011 | Permalink

  9. Kevin Flahaut
    Administrator

    You would add your new CSS rules to the custom.css thesis file ( http://grab.by/akNL ). That way you never have to worry about your changes being overwritten when Gravity Forms updates.

    Posted 12 years ago on Saturday June 11, 2011 | Permalink

  10. findtim
    Member

    i have a similar problem but in the studiopress corporate theme. in the form.css i need this value changed to 92% to fit properly in my sidebar.

    .gform_wrapper .top_label input.large,
    .gform_wrapper .top_label select.large,
    .gform_wrapper .top_label textarea.textarea {
    width: 99.2%
    }

    i tried adding it to my themes style.css but it didn't work, as you said above the problem is that any change to the form.css will get overwritten in the future.

    what should i do?

    Posted 12 years ago on Tuesday November 8, 2011 | Permalink

  11. Rob Harrell
    Member

    Hey Tim, since you didn't provide a link to your form in question, I'm flying kind of blind, but try this instead:

    [css]
.gform_wrapper .top_label input.large,
.gform_wrapper .top_label select.large,
.gform_wrapper .top_label textarea.textarea {
width: 99.2% !important;
}

    If this doesn't do the trick could you provide me a link to your form, be glad to help you out!

    Posted 12 years ago on Tuesday November 8, 2011 | Permalink

  12. findtim
    Member

    that worked, after i changed it to 92%
    .gform_wrapper .top_label input.large,
    .gform_wrapper .top_label select.large,
    .gform_wrapper .top_label textarea.textarea {
    width: 92% !important;
    }
    i can't believe it was just the !important that changed it?

    THANKS so much, it was affecting 18 websites ! so it is a mountain of work

    tim

    Posted 12 years ago on Wednesday November 9, 2011 | Permalink

  13. Rob Harrell
    Member

    No problem at all Tim, glad to help! Generally, !important is used when you need to overwrite a style from another stylesheet and that stylesheet you don't want to change.

    Posted 12 years ago on Wednesday November 9, 2011 | Permalink

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