We build stellar websites!
by aidan
Sometimes I find stray p or br tags appearing inside a block of content that I’ve enclosed in shortcodes and this can mess up the layout by adding extra spacing where I don’t want it. It occurs because of the default order in which WordPress processes your content – wpautop (the function which converts line breaks to p or br tags) is run before the shortcodes are processed.
remove_filter( 'the_content', 'wpautop' );
add_filter( 'the_content', 'wpautop' , 12);
Now there will be no extra p or br tags added inside your shortcode block. In fact there will not be any automatic conversion of line breaks to p and/or br tags at all. So if you want the legitimate line breaks to convert to p and br tags, you will need to run wpautop from inside your shortcode function, e.g.:
function bio_shortcode($atts, $content = null) {
$content = wpautop(trim($content));
return '<div class="bio">' . $content . '</div>';
}
add_shortcode('bio', 'bio_shortcode');
March 21st, 2012 at 4:09 am
Thanks so much! :-)
March 29th, 2012 at 11:27 am
This fixed so many of my issues. If only my therapist was so effective! Thank you sincerely.
May 16th, 2012 at 2:21 am
Perfect – this was such a better solution than others I’ve been finding – thanks heaps!!
May 30th, 2012 at 10:59 am
For some reason, this isn’t working for me at all. If I just do the remove_filter line, then it fixes the issue around the shortcode, but removes the other paragraph tags. If I add the add_filter line, it fixes the other paragraph tags, but my shortcode is still wrapped in p tags again. Here’s my site: http://www.ebs-consulting.com/Wordpress/consulting-services/human-resources/wage-and-salary-administration/
Do you have any idea what’s going on???
May 30th, 2012 at 12:07 pm
Hi Christina,
This solution is for the extra p gags inside the shortcode block, but it sounds like your issue is with p tags outside the shortcode block as you say ‘my shortcode is still wrapped in p tags’. Try removing the whitespace & line breaks before and after the shortcode tag – that should get rid of the paragraph wrapping arond the outside of it.
May 31st, 2012 at 7:46 am
What I have in WordPress editor on that page:
In order to develop a [PopUp id="1"]corporate compensation philosophy[/PopUp], total compensation must be
This is my function:
//Custom PopUp Shortcode for Modal Dialog hottness
function PopUp($atts, $ShortcodeContent = null) {
extract(shortcode_atts(array("id" => '5'), $atts));
$content = parse_shortcode_content( $content );
global $post;
$post = get_post($id);
$postSlug = the_slug($id);
$myPostContent = $post->post_content;
return '
' . $ShortcodeContent . '
' . $ShortcodeContent . ''. $myPostContent . '
';
}
add_shortcode('PopUp', 'PopUp');
And then you can see what gets generated by all that on this page:
http://www.ebs-consulting.com/Wordpress/consulting-services/human-resources/wage-and-salary-administration/
May 31st, 2012 at 7:48 am
urg… wrong code, this is what’s in my fuctions.php file:
//Custom PopUp Shortcode for Modal Dialog hottness
function PopUp($atts, $ShortcodeContent = null) {
extract(shortcode_atts(array("id" => '5'), $atts));
global $post;
$post = get_post($id);
$postSlug = the_slug($id);
$myPostContent = $post->post_content;
return '
' . $ShortcodeContent . '
' . $ShortcodeContent . ''. $myPostContent . '
';
}
add_shortcode('PopUp', 'PopUp');
remove_filter( 'the_content', 'wpautop' );
add_filter( 'the_content', 'wpautop' , 12);
I’m not sure what exactly is happening to be honest.
May 31st, 2012 at 8:50 am
Hi Christina, I think your functions.php might be ok. What I was referring to in my previous comment wan not the functions file but in the actual WordPress page/post editor itself.
e.g. This would cause <p> tags around the outside of the shortcode content:
whereas this wouldn’t:
or at least this wouldn’t:
May 31st, 2012 at 8:52 am
That’s why I put the code that’s in my WordPress editor too… it doesn’t have any spaces or line breaks:
In order to develop a [PopUp id="1"]corporate compensation philosophy[/PopUp], total compensation must be
I’m really not sure what’s causing the tags.
February 12th, 2013 at 8:15 am
Hi! Thank You so much!!!! After five days of seeking solution of this problem I’ve finally found the right code that works for me… and because of You. Again…Thank You!
April 28th, 2013 at 2:17 am
Thanks a lot! it helped me with the “Group” plugin for wordpress… the was killing my layout! Thanks again.