• Resolved scottkr24

    (@scottkr24)


    Are there any forms out there where it can be displayed/laid out horizontally instead of vertically?

Viewing 15 replies - 1 through 15 (of 45 total)
  • Virtually any form. Just make sure that you don’t enter new paragraphs between the elements. In addition, you may need to override the formatting by applying: style="display: inline;" to each element.

    Thread Starter scottkr24

    (@scottkr24)

    I use Contact Form 7. Is what you say can be done in that plugin?

    Contact Form 7 inserts paragraph tags so you either need to run everything together with no line breaks or turn autop off.

    https://contactform7.com/controlling-behavior-by-setting-constants/

    1. In the form setup, you need to put all entry fields directly after each other.
    2. In CSS, you need to adjust the parameter display as display:inline; for all input types and for label. In addition, if the width of input is 100%, then you need to make that lower.

    Thread Starter scottkr24

    (@scottkr24)

    @chrispink

    I put this in the wp-config.php file immediately under the define(‘WPLANG’, ”); statement and then my site wouldn’t load up.

    define (‘WPCF7_AUTOP’ false);

    • This reply was modified 7 years, 7 months ago by scottkr24.

    You’re missing a comma…
    define (‘WPCF7_AUTOP’, false);

    You should probably also inhibit loading of CSS and supply your own.

    Thread Starter scottkr24

    (@scottkr24)

    @tobifjellner

    On the Form tab I have this: Not sure what you mean exactly. Also I looked in the CSS file for the Contact Form 7 section but don’t see it.

    <p>Your Name (required)<br />
    [text* your-name] </p>
    <p>Your Email (required)<br />
    [email* your-email] </p>
    <p>Company (required)<br />
    [text company] </p>
    <p>Phone (required)<br />
    [text phone] </p>
    <p>Subject (required)<br />
    [text* your-subject] </p>
    <p>Your Message (required)<br />
    [textarea* your-message] </p>
    <p>Enter the following: [captchac captcha-522]<br />
    [captchar captcha-522]</p>
    <p>[submit “Send”]</p>

    In the same article, about blocking auto-p, there was another parameter to stop the plugin from loading its own CSS.
    Autop means that each new paragraph (enter-key) in your form design is automatically converted into <p> </p> tag pairs.
    However, with the content you give above, you’re anyway entering manual line breaks and new paragraphs between every field. If you want your fields to be laid out horizontally, then all these tags “br /” and “p” will make sure you get a vertical layout.

    Thread Starter scottkr24

    (@scottkr24)

    @tobifjellner

    Thanks for pointing that out. Its uploaded to the server but I don’t see any changes to the form on my site. Was it supposed to do something?

    Oh and that last line <p>[submit “Send”]</p> may give you problems, if you’re using typographical quotation marks, rather than straight ones: <p>[submit "Send"]</p>

    Thread Starter scottkr24

    (@scottkr24)

    @tobifjellner

    You said I should “You should probably also inhibit loading of CSS and supply your own.” I don’t know how to do that.

    This one?
    define (‘WPCF7_LOAD_CSS’, false);

    “autop” is simply a filter that injects missing <p> tags in content text, So that new lines and empty paragraphs in your content give something similar with the end user.
    Note that html specification says that any number of spaces, tabs and/or newlines in the browser will be represented by one (1) space. The filter autop() makes these texts behave a little bit more like an ordinary content author would expect it to…

    Thread Starter scottkr24

    (@scottkr24)

    I only have one type of ” ” on the keyboard.
    <p>[submit “Send”]</p>

    Should I add this too?
    define (‘WPCF7_LOAD_CSS’, false);

    Please mark code in backticks. You can also select the code and click on the button code.
    This lowers the risk of things interacting unexpectedly with the system and/or the markup.

    Yes, I was referring to define ('WPCF7_LOAD_CSS', false);
    Point is that the standard formatting implied by the plugin also enforces some new lines. (That’s what I referred to earlier.

Viewing 15 replies - 1 through 15 (of 45 total)
  • The topic ‘Forms’ is closed to new replies.