Viewing 4 replies - 1 through 4 (of 4 total)
  • Hi studentit16
    you try insert the code into any your pages
    <?php echo do_shortcode(‘[Shortcode]’); ?>

    I use Ordered List elements to display multiple fields on single line.

    HTML:

    <ol class="singleline">
    <li> <label for="your-name">Your Name (required) </label> [text* your-name] </li>
    <li> <label for="your-email">Your Email (required) </label> [email* your-email] </li>
    </ol>

    Added to Form section of CF7 interface. <label> tags are added for improved accessability.

    CSS:

    .wpcf7-form .singleline ol {
    list-style: none;
    margin: 0;
    }
    
    .wpcf7-form .singleline li{
    display: inline-block;
    margin-right: 10px;
    }

    Added to Child Theme style.css

    MAIL:
    From: [your-name] [your-email]

    Added to Mail section of CF7 interface.

    Thread Starter studentit16

    (@studentit16)

    In fact I am trying something similar to
    http://www.huntmigration.com/visa-assessment/ but mine looks horrible
    http://www.testing.migrationdownunder.com/assessment-for-australia-or-new-zealand-visas/

    Is there any change to receive some help on how to format this form?

    Many thanks

    See Styling Contact Form for a general explanation of styling CF7 forms using CSS.

    There is a link at the bottom of the page to a comprehensive and detailed article on Styling Contact Form 7 Forms. The article shows people, with suitable HTML & CSS skills, how to change the appearance of their Contact Form 7 Forms to meet their particular requirements.

    Use Firebug or Chrome Dev Tools to examine the HTML and CSS of your CF7 form in detail. Once you understand how the HTML and CSS is configured in your CF7 form, you should be able to see the CSS changes you need to change the appearance of the form to suit your requirements.

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘format Form’ is closed to new replies.