CODEWITHSUNDEEP
wordpresscontact-form-7
Nenad Vracar
Nenad Vracar

Reputation: 122087

Contact Form 7 auto added p tags

I have next code inside contact form 7 editor 

<div class="row">
    <div class="col-sm-8 col-sm-offset-2">
        <div class="row">
            <div class="col-sm-4">
                [text* name class:border-field placeholder "Name"]
            </div><!-- End of col -->
            <div class="col-sm-4">
                [email* email class:border-field placeholder "Email"]
            </div><!-- End of col -->
            <div class="col-sm-4">
                [text subject class:border-field placeholder "Subject"]
            </div><!-- End of col -->
        </div><!-- ENd of row -->
    </div><!-- End of col -->
</div><!-- ENd of row -->

<div class="row">
    <div class="col-sm-8 col-sm-offset-2">
        [textarea message class:border-field placeholder "Message"]
    </div>
</div><!-- End of row -->

<div class="row text-center">
    <div clas s="col-sm-12">    
        [submit class:btn class:btn-black-fill class:btn-small "Submit"]  
    </div><!-- End of col -->
</div><!-- End of row -->

The problem is that it adds random p tags almost after each element and also that first text field is for some reason little bit above other two fields when they should all be inline. And i think this is not css problem because previously i had this coded in plane HTML and all fields were inline so i think it must be something with contact form 7.

Upvotes: 46

Views: 60325

Answers (6)

drdogbot7
drdogbot7

Reputation: 58

This works too. Tested with WordPress 5.7, PHP 7.4, Contact Form 7 v5.4.

<?php
add_filter('wpcf7_autop_or_not', false);

Potentially there are situations (old versions of WP, PHP?) where using the __return_false utility function is necessary.

Upvotes: 0

skip405
skip405

Reputation: 6279

If editing wp-config.php is not the solution for you, there's a handy filter. Put it in your functions.php:

// Remove <p> and <br/> from Contact Form 7
add_filter('wpcf7_autop_or_not', '__return_false');

Upvotes: 97

Sagive
Sagive

Reputation: 1827

I tried many answers but nothing worked so...
I ended up using simple CSS to specifically target empty P tags
in the form itself like this: 

.wpcf7-form p:empty { display: none; }

This worked for me and, its a simple solution.

Upvotes: 6

Hitesh Prajapati
Hitesh Prajapati

Reputation: 85

I would like to say something about this, when we want reduce auto P tag form the we should go with below filter and just write blow code in function.php.

add_filter('wpcf7_autop_or_not', '__return_false');

Upvotes: 9

rnevius
rnevius

Reputation: 27112

According to the Contact Form 7 Docs, you can disable "wpautop" for the plugin by placing the following constant in wp-config.php:

define( 'WPCF7_AUTOP', false );

Upvotes: 92

silver
silver

Reputation: 5311

Add this in your functions.php file

function reformat_auto_p_tags($content) {
    $new_content = '';
    $pattern_full = '{(\[raw\].*?\[/raw\])}is';
    $pattern_contents = '{\[raw\](.*?)\[/raw\]}is';
    $pieces = preg_split($pattern_full, $content, -1, PREG_SPLIT_DELIM_CAPTURE);
    foreach ($pieces as $piece) {
        if (preg_match($pattern_contents, $piece, $matches)) {
            $new_content .= $matches[1];
        } else {
            $new_content .= wptexturize(wpautop($piece));
        }
    }

    return $new_content;
}

remove_filter('the_content', 'wpautop');
remove_filter('the_content', 'wptexturize');

add_filter('the_content', 'reformat_auto_p_tags', 99);
add_filter('widget_text', 'reformat_auto_p_tags', 99);

Then on your post editor wrap your contact form 7 shortcode with raw shortcode

e.g.

[raw][contact-form-7 id="1" title="Contact Us"][/raw]

Upvotes: 1

Related Questions