WordPress.org

Support

Support » Plugins and Hacks » [Resolved] [Plugin: Contact Form 7] Make fields shorter

[Resolved] [Plugin: Contact Form 7] Make fields shorter

Viewing 12 replies - 1 through 12 (of 12 total)
  • Can you please try the below in the respective contact form from the wp-admin and let me know if this works?

    <p> Your Email:<br/>[email* your-email] *</p>
    <p>Your Question?<br/>[textarea textarea-1]</p>
    <p>[submit "Submit"]</p>

    Thanks for your reply. There are loads of files associated with this plugin. Do you which of the files below I should be editing?

    contact-form-7/wp-contact-form-7.php
    contact-form-7/readme.txt
    contact-form-7/styles-rtl.css
    contact-form-7/uninstall.php
    contact-form-7/admin/taggenerator.js
    contact-form-7/admin/admin.php
    contact-form-7/admin/styles-rtl.css
    contact-form-7/admin/scripts.js
    contact-form-7/admin/edit.php
    contact-form-7/admin/styles.css
    contact-form-7/includes/shortcodes.php
    contact-form-7/includes/functions.php
    contact-form-7/includes/taggenerator.php
    contact-form-7/includes/pipe.php
    contact-form-7/includes/formatting.php
    contact-form-7/includes/controller.php
    contact-form-7/includes/classes.php
    contact-form-7/languages/readme.txt
    contact-form-7/settings.php
    contact-form-7/license.txt
    contact-form-7/scripts.js
    contact-form-7/jquery.form.js
    contact-form-7/styles.css
    contact-form-7/modules/captcha.php
    contact-form-7/modules/submit.php
    contact-form-7/modules/select.php
    contact-form-7/modules/text.php
    contact-form-7/modules/acceptance.php
    contact-form-7/modules/checkbox.php
    contact-form-7/modules/file.php
    contact-form-7/modules/response.php
    contact-form-7/modules/special-mail-tags.php
    contact-form-7/modules/akismet.php
    contact-form-7/modules/quiz.php
    contact-form-7/modules/textarea.php

    Thanks

    James

    esmi

    @esmi

    Forum Moderator

    Try editing your theme’s stylesheet.

    Thanks, Esmi. Since this is a plug-in, it is not using styles from my themes .css.

    The php generated mark-up looks like this:

    <span class="wpcf7-form-control-wrap your-email">
    <input class="wpcf7-form-control wpcf7-text wpcf7-email wpcf7-validates-as-required wpcf7-validates-as-email" type="text" size="40" value="" name="your-email">
    </span>

    and it’s the “size” attribute I need to change but I don’t know where as I can’t read PHP.

    Thanks

    James

    esmi

    @esmi

    Forum Moderator

    Since this is a plug-in, it is not using styles from my themes .css.

    Oh yes it is. If necessary, you need to add CF7 specific CSS to your theme’s stylesheet. Try using Firefox with the Firebug add-on for this kind of CSS work.
    http://getfirebug.com/

    Hi Esmi

    That was the first thing I tried. It seems that the width attribute is hardcoded into the code using the ‘size’ attribute I mentioned above. I have been unable to override this using CSS.

    Thanks

    James

    esmi

    @esmi

    Forum Moderator

    Now try adding:

    #sidebar textarea {
        width: 260px;
    }

    😉

    Hi Esmi

    That didn’t work but when I tweaked it to:

    #wpcf7-f886-w1-o1 textarea {
    width: 260px;
    }

    it did 🙂

    So thank you. Do you know how I would target the email field to make it shorter also?

    Thanks

    James

    esmi

    @esmi

    Forum Moderator

    Try #wpcf7-f886-w1-o1 input[type="text"]

    Wow. That did it. Thanks so much.

    James

    esmi

    @esmi

    Forum Moderator

    You’re welcome 🙂

    I am having a similar problem with the form on my wordpress site as well. I would like to restrict all of the fields to 190px but I don’t really know how to adapt the code snippets here to apply to my particular situation. I am a more of a beginner so I might need some more specific instructions on how to make the changes. The site is here if you need to look:

    Homepage

    Thanks.

Viewing 12 replies - 1 through 12 (of 12 total)
  • The topic ‘[Resolved] [Plugin: Contact Form 7] Make fields shorter’ is closed to new replies.