Support » Fixing WordPress » [Plugin: Contact Form 7] Formatting checkbox sets

Viewing 6 replies - 1 through 6 (of 6 total)
  • I didn’t either… I wish they’d just fix the plugin.
    Edit this plugin file here using the plugin editor:
    contact-form-7/modules/checkbox.php

    About 3/4 of the way down, you’ll see this:

    if ( $label_first ) { // put label first, input last
    			$item = '<span class="wpcf7-list-item-label">' . esc_html( $label ) . '</span>&nbsp;';
    			$item .= '<input type="' . $input_type . '" name="' . $name . ( $multiple ? '[]' : '' ) . '" value="' . esc_attr( $value ) . '"' . $checked . $onclick . ' />';
    		} else {
    			$item = '<input type="' . $input_type . '" name="' . $name . ( $multiple ? '[]' : '' ) . '" value="' . esc_attr( $value ) . '"' . $checked . $onclick . ' />';
    			$item .= '&nbsp;<span class="wpcf7-list-item-label">' . esc_html( $label ) . '</span><br />';
    		}

    The <br /> tag is what I added, after </span> and before the end quote.

    you dont need to do all of that.
    if you go into your css files for Contact 7 do this:
    go to plugins, under Contact 7, there is an edit field, click that and go to your css files.
    Click on stylesheet.css
    in the next to the last code block…shouldlook like this…
    }
    span.wpcf7-list-item {
    margin-left: 0.5em;
    }

    Change it to look like this:

    }
    span.wpcf7-list-item {
    margin-left: 0.5em;
    display: block;
    }

    thats it, save and youre done. very easy fix but they should have that already done. I think it looks like crap aligned that way
    HTH

    I am jumping into the conversation because I have a related issue. I would like to apply a style class to the input tags <input>.
    I could generate entirely new tags but that seems like extra work. i would gladly add to my style sheet but I need someway to specify c-f-7 form elements. Do you have a tip on how I can do that? I looked at the plug-in code and couldn’t find the form name. (I tried some obvious ones but they didn’t work.)

    I have a list of 10 checkboxes in a form. I am trying to format my mail so that the checked responses show up in a vertical list instead of a comma separated list in a paragraph. How do I do that? Is there an option I can set?

    theresacambria

    (@theresacambria)

    @ ljkerley – try using .wpcf7 to target the specific inputs. to target the whole form just wrap the shortcode in a <span> or <div> and apply an id or class to it. Here are some examples:

    .wpcf7 input{}
    .wpcf7-form-control-wrap textarea{}
    p.contactBtn input[type=”submit”]{}

    If you’re not using firebug give it a try – it can help you find classes a lot easier than by looking through the plugin.

    Good luck!

    Just add the following to your main stylesheet to fix the problem for both checkboxes and radio buttons:

    span.wpcf7-list-item {
    display:block;
    }

    Best thing is it will stay fixed even after you upgrade the contact form 7 plugin.

Viewing 6 replies - 1 through 6 (of 6 total)
  • The topic ‘[Plugin: Contact Form 7] Formatting checkbox sets’ is closed to new replies.