WordPress.org

Ready to get started?Download WordPress

Forums

Jetpack by WordPress.com
contact form (9 posts)

  1. plant123
    Member
    Posted 1 year ago #

    Hello

    I have a question about how to change how the contact form actually displays on a page. Right now the spacing between the title of a field and its box is very large while the spacing between the text box and the following title (of the next box) is very small. This is a little awkward to explain.
    here is the url:
    http://www.virtuesofhealing.com/application-6-month-foundations-course/

    Is there a way to change this?
    (I would like to minimize the space between the title and its box, as well as, increase the space in-between a box and the following title.)

    Thanks for helping!!

    http://wordpress.org/extend/plugins/jetpack/

  2. Jeremy Herve
    Happiness Engineer
    Plugin Author

    Posted 1 year ago #

    I had a look at your site, and it seems that you have inserted <br> tags in the form.

    I would recommend that you remove them, and use CSS to change the appearance of the form.
    Try to add the following to your theme stylesheet, or to your custom CSS editor under Appearance > Edit CSS in your dashboard:

    .contact-form div {
        margin-top: 20px;
    }

    It will add a margin before each field title.

    I hope this helps.

  3. plant123
    Member
    Posted 1 year ago #

    thanks for the response. I added that to my css editor and it did create a space which I like.

    But I am not sure what you meant by the
    tags. I did not add anything to the form.

    So now the only thing I would like to fix on the form is to minimize the space between the title its field box.

    http://www.virtuesofhealing.com/application-6-month-foundations-course/

    thanks for your help

  4. Jeremy Herve
    Happiness Engineer
    Plugin Author

    Posted 1 year ago #

    Could you copy the contact form shortcode that was inserted into that page, and paste it here so I can have a look?

    Thank you.

  5. plant123
    Member
    Posted 1 year ago #

    [contact-form to='info@virtuesofhealing.com' subject='Completed Application'][contact-field label='Name' type='name' required='1'/][contact-field label='Email' type='email' required='1'/][contact-field label='Program' type='select' required='1' options='6-month Foundations Course,3-month Plant Intensive'/][contact-field label='Mailing Address' type='text' required='1'/][contact-field label='city%26#x002c; state%26#x002c; zip' type='text'/][contact-field label='New Field' type='textarea'/][/contact-form]

    is this the 'shortcode'? thanks for your help!!

  6. lucaslem
    Member
    Posted 1 year ago #

    I have also had <br> tags which get rendered automatically and definitely not my doing. I've tweaked my CSS to compensate accordingly, but definitely strange...

  7. Jeremy Herve
    Happiness Engineer
    Plugin Author

    Posted 1 year ago #

    Thank you both!

    Do you use any plugin that may alter the Visual Editor, or add extra <br> tags to your post content?

    If the problem is not caused by a plugin, could you try to switch to a different theme for a few minutes, and check if the extra <br> tags disappear?

  8. plant123
    Member
    Posted 1 year ago #

    thanks for the help

    I previewed the form in another theme and it did look fine. So I guess it has something to do with my theme.

    Is there a way to change the css to counter what my theme is doing?

    thanks!!

  9. Jeremy Herve
    Happiness Engineer
    Plugin Author

    Posted 1 year ago #

    I would recommend that you search for the function adding extra <br> to all forms in your theme; once you remove this function, the form should be displayed properly.

Topic Closed

This topic has been closed to new replies.

About this Plugin

About this Topic

Tags

No tags yet.