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.

Form to fit Sidebar

  1. I want to put a smaller contact form to fit the narrow sidebar. To make it compact, I would like to do the following:

    1. Put the field names inside the field boxes
    2. Decrease the distance between the field boxes
    3. Reduce the font size of field names
    4. Reduce the distance between the name of the contact form and first field box

    The website is http://www.stephengoldenlaw.com. There's a form in the Contact Us page. There is no form yet in the sidebar but you will have an idea how narrow it is.

    Will appreciate your help.

    Posted 7 years ago on Friday February 22, 2013 | Permalink
  2. More than 24 hours and no reply?

    Help please.

    Posted 7 years ago on Saturday February 23, 2013 | Permalink
  3. We strive for a response within 48 hours, and there is no support on the weekend during non-business hours. Please see this: http://www.gravityhelp.com/support-times/

    1. To put the field labels inside the boxes, you want to use placeholder text. There are a couple 3rd party add-ons available which will do this for you:

    http://wordpress.org/extend/plugins/gravity-forms-placeholders/
    http://wordpress.org/extend/plugins/gravity-forms-auto-placeholders/

    For 2, 3 and 4, please insert a form into your sidebar so we can see which fields we are talking about.

    Posted 7 years ago on Sunday February 24, 2013 | Permalink
  4. Thank you for the add-on. The field labels are now inside the boxes.

    The form is live at http://www.stephengoldenlaw.com.

    Referring to my first post, will appreciate your help on the following:

    1. Decrease the distance between the field boxes
    2. Reduce the font size of field names
    3. Reduce the distance between the description and first field box
    4. Reduce the distance between the last field box (Message) and the Send button.

    Thanks.

    Posted 7 years ago on Tuesday February 26, 2013 | Permalink
  5. Please add this to one of your theme's stylesheets:

    [css]
    /* #1 */
    body .gform_wrapper li,
    body .gform_wrapper form li {
            padding: 2px 0;
    }
    /* #2 */
    body .gform_wrapper input[type="text"],
    body .gform_wrapper input[type="url"],
    body .gform_wrapper input[type="email"],
    body .gform_wrapper input[type="tel"],
    body .gform_wrapper input[type="number"],
    body .gform_wrapper textarea,
    body .gform_wrapper input[type="password"] {
             font-size: 8px;
    }
    /* #3 */
    body .gform_wrapper .gform_heading {
            margin-bottom: 0px;
    }
    /* #4 */
    body .gform_wrapper .gform_footer {
            margin-top: 0px;
            padding-top: 0px;
    }

    Screenshot: http://minus.com/lbkZPTOIECvt5p

    You can adjust all those values as you see fit. I just wanted to show you how to target everything properly.

    Posted 7 years ago on Tuesday February 26, 2013 | Permalink
  6. That worked smoothly. Thank you so much!

    Posted 7 years ago on Friday March 8, 2013 | Permalink

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