Take the 2-minute tour ×
WordPress Development Stack Exchange is a question and answer site for WordPress developers and administrators. It's 100% free, no registration required.

I coded a wordpress shortcode for columns that basically inserts html via a shortcode. Problem is that wpautop adds stray p elements that renders the code invalid.

To test put this into your functions.php:

function static_col_container($atts, $content) {
    extract(shortcode_atts(array(
        'foo' => 'bar'
    ), $atts));

    $content = do_shortcode($content);
    $container = '<div class="static-column-container">' . $content . '</div>';
    return $container;
}

add_shortcode('static-cont', 'static_col_container');

function static_col($atts, $content) {
    extract(shortcode_atts(array(
    'space' => '2',
    'class' => ''
    ), $atts));

    $content = do_shortcode($content);
    $column_container = '<div class="static-column static-column-' . $space . ' ' . $class . '">' . $content . '</div>';

    return $column_container;
}

add_shortcode('static-col', 'static_col');

Usage is:

[static-cont]
    [static-col]
       put some content here...
    [/static-col]
    [static-col]
       put some content here...
    [/static-col]
[/static-cont]

I know that Wordpress uses wpautop to insert p tags which can be disabled via:

remove_filter('the_content', 'wpautop');

Problem is that now you have to enter every single p element yourself, which is a pain and makes the visual editor useless. Has anybody found a better solution?

share|improve this question
add comment

3 Answers 3

up vote 7 down vote accepted

Remove the filter from the the_content and run it after the shortcode are processed.

Try:

remove_filter( 'the_content', 'wpautop' );
add_filter( 'the_content', 'wpautop' , 12);

Usually shortcodes are processed after wpautop is applied to the content. See http://core.trac.wordpress.org/browser/tags/3.1/wp-includes/shortcodes.php#L296

share|improve this answer
    
Thanks a lot! This solves the problem! –  marvinhagemeister Mar 6 '11 at 10:30
    
this helped me after hours of searching –  user9 Jun 19 at 2:59
add comment

I'm not seeing that issue on my local installation, copied your shortcode code, then put the provide sample into a post, the output was as follows.

<div class="static-column-container"><br>
<div class="static-column static-column-2 "><br>
put some content here…<br>
</div><br>
<div class="static-column static-column-2 "><br>
put some content here…<br>
</div><br>
</div>

Switching between HTML and Visual i always see.

[static-cont]
    [static-col]
       put some content here...
    [/static-col]
    [static-col]
       put some content here...
    [/static-col]
[/static-cont]

...and nothing else..

Any plugins installed, TinyMCE advanced?

share|improve this answer
    
hmm, just tested again. I always get stray p tags. No plugins installed. Anyhow, the answer above solves my problem. –  marvinhagemeister Mar 6 '11 at 10:30
add comment

I had the same problem, not from a validation point of view, but a styling point of view, where a stray opening p tag was ruining my CSS.

$retour ='<div class="testimonial-meta">'
$retour .='<h5>'.$testimonial_name.',</h5><span>'.$testimonial_details.'</span>';
$retour .='</div>';
return $retour;

Was returning:

<div class="testimonial-meta">
    <h5>John Doe,</h5>
    <p><span>Company CEO</span></div>
</div>

I fixed the styling by adding in my CSS:

.testimonial-meta p{
    display:inline;
}

Hopefully this might be useful to someone.

share|improve this answer
    
An invalid html document usually leads to weird style issues. That is to be expected. –  marvinhagemeister Mar 2 '13 at 12:07
    
display:none; But I removed <br/>, not <p> though. –  avp Sep 5 '13 at 14:39
add comment

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.