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.

Create a new field to Match my Mail Chimp Fields

  1. I'd like to create a first name field only, not the First Name, Last Name field that comes standard with Gravity Forms to match my MailChimp list fields.

    Here's a link to the form page on the site -- http://lifeinzd.com/. The Gravity Form is on the bottom of the sidebar. I put it there using the Gravity Forms Widget.

    (BTW, The Red subscription box on top was created in MailChimp, not Gravity Forms)

    As you can see, it doesn't fit. Plus, my Mailchip list does not include a Last Name field and I want to get rid of it altogether. Another problem, even though I've specified top alignment on the form, in the sidebar the form is left aligned.

    Once I am able to create a First Name field in Gravity Forms (which is the field that the Mail Chimp list uses) how in the world do I style the text and create a background. I seriously wish this was an option in Gravity Forms. Do I have to add CSS code to the custom CSS in my theme? Or is there a place where I can edit the code from the Gravity Forms Widget directly?

    If the Gravity Forms Widget plugin isn't a good idea -- in that it won't translate the proper form settings to the sidebar -- how the heck does one get a form in a sidebar widget? I can cut and paste code but where do I find that code?

    Thanks for your help.

    Posted 12 years ago on Friday July 15, 2011 | Permalink
  2. > As you can see, it doesn't fit. Plus, my Mailchip list
    > does not include a Last Name field and I want to get
    > rid of it altogether.

    To match the "name" in your form to the "name" you have set up in Mailchimp, don't use the "Advanced field" of "name" (which asks for first & last name.) Remove that field from your form and use a Standard field (single line text) and give it a Title of "Name". Then map that to your Mailchimp name field.

    > Another problem, even though I've specified top alignment
    > on the form, in the sidebar the form is left aligned.

    The top alignment setting you used is for label placement, not the layout of the form. You can leave that set to "top alignment" and your form will be laid out like this once all the formatting is done (top placement is the default):

    Name*
    [                      ]

    The fields in the widget are laid out differently when I view in Chrome and Firefox.

    The problem with the alignment in the widget is due to styles being set for all form elements in your site's style.css.

    > Once I am able to create a First Name field in Gravity
    > Forms (which is the field that the Mail Chimp list uses)
    > how in the world do I style the text and create a
    > background. I seriously wish this was an option in
    > Gravity Forms. Do I have to add CSS code to the custom
    > CSS in my theme? Or is there a place where I can edit
    > the code from the Gravity Forms Widget directly?

    Add this to your site's custom.css to remove the bullets, which should allow the fields to align properly.

    .gravityformswidget .gform_wrapper .gform_body ul li {
    	list-style-type:none;
    }

    To style the text and create a background, you will need to add additional CSS to your site's custom.css. You can read about targetting the specific elements here.

    > If the Gravity Forms Widget plugin isn't a good idea --
    > in that it won't translate the proper form settings to
    > the sidebar -- how the heck does one get a form in a
    > sidebar widget? I can cut and paste code but where do
    > I find that code? Thanks for your help.

    The Gravity Forms widget will work fine once you override the styles that are being added by your theme. Adding a form in a different sidebar widget won't be any better as your Canvas theme will override the layout there too. Start by making a few small additions to your custom.css to override the Canvas CSS.

    Posted 12 years ago on Friday July 15, 2011 | Permalink
  3. I think I have it working now. http://lifeinzd.com/ it's the form right under the bio box in the sidebar.

    2 more problems, though...

    1) How do you turn off the confirmation message? Can't find where that is an option. This form is a subscription box on my website. I want it to stay up there not go away and be replaced by a message "We'll get back to you"! If the entries in the fields go away after the form is submitted, that would be ideal. How do I do that?

    2) How do I style the appearance of the form -- Background colors etc., font colors, button colors etc. That was the primary reason I bought Gravity Forms. If I have to do it all by writing CSS code in my customCSS file can you at least tell me what #name to put it under? Any help on this would be greatly appreciated.

    Thank you!

    Posted 12 years ago on Thursday July 21, 2011 | Permalink
  4. 1) Confirmation messages can't be turned off. The only thing you could do is edit that form, edit the Form Settings and then choose Confirmation and configure it to use a Redirect for the confirmation and enter the URL you want to redirect to. But this would only work if the form only appears on one page, and it wouldn't show a "We'll get back to you." message.

    What exactly is the problem with the Confirmation message? If the user already filled out the form, they have already subscribed so seeing the form isn't critical at that point because they can't subscribe again as they've already done so.

    2) Gravity Forms leaves the heavy lifting of the form styles to your Theme because your Theme should determine the overall look and feel of your site. Typically this works fine and forms look good out of the box. But we can't guarantee perfection with thousands of themes in existence and we have no control over any of them. SO the solution is to write custom CSS that you would place in your themes stylesheet to target and style form elements.

    Because forms are made up of so many elements I couldn't give you one ID or Class you would target with your CSS. It would depend entirely on what you are trying to style. Here is a tutorial that outlines how to target and style form elements:

    http://www.gravityhelp.com/documentation/page/CSS_Targeting_Samples

    Posted 12 years ago on Thursday July 21, 2011 | Permalink