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 have this in my functions.php:

The images inside the slider were added as custom post types called "Page Content." I'm not sure if the filter only applies to the main Posts.

/**
 * Remove paragraph tags around content and excerpt
 */
remove_filter( 'the_content', 'wpautop' );
remove_filter( 'the_excerpt', 'wpautop' );

The the posts in the admin look like this: enter image description here

But something still wrapping the images of my Nivo Slider with p tags:

enter image description here

enter image description here

CSS:

#slider-wrapper {
    float: left;
    height: 560px;
}
#slider {
    float: left;
    border: 1px solid #DDD;
    position:relative;
    background:url(images/loading.gif) no-repeat 50% 50%;
}
#slider img {
    top: 0px;
    left: 0px;
    display: none;
    float: left;
    position: absolute;
    width: 958px;
    height: 458px;
}
.nivo-controlNav {
    margin: 490px auto 0;
    overflow: hidden;
}
.nivo-controlNav a {
    background: url(images/bullets.png) no-repeat;
    border: 0;
    float: left;
    text-indent: -9999px;
    width: 22px;
    height: 22px;
}
.nivo-controlNav a.active {
    background-position: 0 -22px;
}
.nivo-directionNav a {
    display: block;
    width: 70px;
    height: 70px;
    background: url(images/arrows.png) no-repeat;
    text-indent: -9999px;
    border: 0;
}
a.nivo-nextNav {
    background-position: -70px 0;
    right: -20px;
}
a.nivo-prevNav {
    left: -20px;
}
.nivo-caption {
    text-shadow:none;
    font-family: Helvetica, Arial, sans-serif;
}
.nivo-caption a {
    color:#efe9d1;
    text-decoration:underline;
}

Any suggestions to remove the p tags?

share|improve this question
    
Is it possible that the Nivo slider plugin is causing this? –  tnorthcutt Jan 26 '11 at 19:07
1  
If all else fails, you might want to check the database and verify that the stored values are not already munged. I remember a painful 3am debugging session where I was looking for something stepping on the data, but it turned out the data was already corrupt before the code I was testing got its hands on it. –  Peter Rowell Jan 26 '11 at 20:35
    
Are you switching between HTML and Visual mode whilst using the editor? The editor.js file that's run alongside the editor also does string replacement(on your content) when you switch between modes, ie. Visual / HTML .. –  t31os Jan 26 '11 at 22:26

3 Answers 3

up vote 2 down vote accepted

There are various functions aside from wpautop() that filter post content, such as force_balance_tags(), which was designed to balance bad HTML coming in via the editor.

They're mostly defined in formatting.php, where you can see the various code in source.

Removal of these filters can be as simple as one line, as you point out:

remove_filter('the_content', 'wpautop');

share|improve this answer
    
Thanks for the info, so how can I solve my problem? –  janoChen Jan 26 '11 at 17:06
2  
Try removing these filters one by one, and perhaps start with force_balance_tags() by changing the use_balanceTags option to zero. –  editor Jan 26 '11 at 17:08
1  
I think is is because of this: wordpress.org/support/topic/… –  janoChen Jan 27 '11 at 7:03
    
"<div><img src='image.jpg' alt='an image' /></div>" <- Did this work for you? –  editor Jan 27 '11 at 21:30
1  
I decided to just leave the <p> tags I think is more semantically correct than wrap it with divs (isn't?). –  janoChen Jan 28 '11 at 14:12

To summarize (since I just worked through this myself):

The problem does come from WP's automatic post-processing routines. They recognize a "loose" img as invalid HTML, and automatically wrap it in "p" tags. That's probably usually helpful, but I found that wrapping it in a "p", as opposed to a generic "div", it was forcing my images to inherit a lot of my style properties that I only wanted to apply to text.

Here's the Codex page that explains it: How WordPress Processes Post Content

There are basically three or four ways to address this, from what I can tell:

  • You can suppress the auto-correction altogether, as @editor described above.
  • If you're handy with plugins, you can edit or override the default substitution of "p" with "div". I'm not that concerned or ambitious, so I haven't dug into the details, but it doesn't look like it would be too difficult, if you know what you're doing.
  • You can set up your CSS so that it assumes that at least some of your images will be wrapped in "p" tags.
  • You can manually wrap all your images in redundant "div" or "p" tags.

Personally, I've opted for the last option -- just putting them into their own little divs.

share|improve this answer

If you want a simple solution that only unwraps the p tags around your images, give this plugin a look: http://wordpress.org/extend/plugins/unwrap-images/admin/

DISCLAIMER: I developed it for my own needs, but it works quite well.

share|improve this answer

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.