Support » Plugin: Contact Form 7 » [Plugin: Contact Form 7] designing the form

Viewing 14 replies - 1 through 14 (of 14 total)
  • Plugin Author Takayuki Miyoshi


    You don’t need to edit any files of the plugin. Instead, simply put tags on a line without line breaks. Like this:

    [text text-1] [text text-2] [text text-3] ...

    great, thanks

    one more point,
    how can i add label above each field? (name, email etc.)


    i see i can add <table> ….. </table>.
    it solves everything. i can play with the table.
    is it ok?

    HI thereā€”I was hoping to find info on what file to use to change the visual design of the form (move the Message text field next to the other fields so it’s not one long vertical form; change background colors). Can you let me know? Thank you!!
    (password protected: vibrancy0104)

    P.S. I assume I should use a child theme?

    Moderator Jan Dembowski


    Brute Squad and Volunteer Moderator

    @renessac Instead of bringing back this 8 month old thread, please start your own.


    you can easily design the form using html.

    see this code:

    [ Moderator Note: Please post code or markup snippets between backticks or use the code button. ]

    <td>[text your-name 12/]</td>
    <td>[email your-email 12/]</td>
    <td>[textarea your-message 12x3]</td>

    and have a look at the result:

    the site is not ready and the form is not complete.
    just to demonstrate.

    by the way, the 12/ means the input field will be 12 characters wide.
    the 12×3 means it will be 12 charcters wide and 3 lines high.

    hth. it’s really an amazing plugin.



    Thanks Lenny, where do I put this code, which file in the editor?

    Thank you!



    it’s not in the editor.
    this is the way you build the form in the “setting” of the plugin.

    when in general admin of your site, you click on “plugins” and see list of plugins.

    Under “contact form 7” you have acivate | deactivate | settings.
    click on settings.

    here you build the form using what i showed you.

    When you finish, (click save), at the top of the page you’ll see the shortcode of this form, it looks something like this: [contact-form-7 id=”136″ title=”Contact form 1″].

    copy it and then paste it where you want it to appear on your page.
    you can also add it as a widget to the sidebar.

    if it is a little bit too much for you, you might spend hours to understand how it works. don’t do it.

    if you really want to learn it – search the support, this plugin has amazing support, or look at youtube, or hire a wordpress programmer. for him it will be a joke, he will do it in half a minute.

    any how have fun


    by the way, i now notice that 8 months ago i started this thread and asked how to do it.

    8 months later i explain how to do it …

    circle of life, i learned, now i help others




    I have an issue with titles not aligning to the input area. I have created a table with title on the left and input area on the right. It all looks good, except where text area or multiple drop-down selections menu are, the title is on the bottom of a cell and not on the center like I intend. How do I go about fixing it? I tried inserting div tage with align center, but nothing seem to be working. I would absolutely appreciate your help!

    i can’t be sure but it seems as if your theme has css settings that conflicts with your settings, and it wins …

    for exsample, if the css is align to right and you try to do align to left, it won’t work, you have to find the way to override the css settings



    Thanks for your help Lenny!

    you’re welcome

Viewing 14 replies - 1 through 14 (of 14 total)
  • The topic ‘[Plugin: Contact Form 7] designing the form’ is closed to new replies.