Prevent or remove p tag placed around images in CKEditor4

[mccartney]

A fellow teacher posted request for input over at Stackoverflow and has not gotten an answer. Thought I would try here and see if anyone might have solved this in past:

My issue is <p> tags are being placed around uploaded image in CKEditor4. Not a huge issue normally but starting to throw CSS off in some templates (like bootstrap).

Currently I get this after uploading an image:

<p><img src="images/example.jpg"></p>

Like to have only:

<img src="images/example.jpg">

I have tried adding (no success for images):

config.autoParagraph = false;

I have visited many threads on stackoverflow and most all refer to WordPress which I am not using. The CKEditor is in a simple CMS for school blogs on a local network.

Found many reference to WordPress plugins that some say will work (strip out all WP ref), but that has failed miserably.

Just like to remove the p tags being placed around images and not anywhere else. Is this a losing battle?

Many thanks in advance.

[AllanP]

@mccartney

Just like to remove the p tags being placed around images and not anywhere else.

This might help.
http://docs.ckeditor.com/#!/guide/dev_disallowed_content

[mccartney]

Thank you @AllanP !

All the searching we have done and you may be on to something:

 config.allowedContent = 'p; img[!src,alt]';
 config.disallowedContent = 'img[src]';
 // Input:       <p><img src="..." alt="..." /></p>
 // Filtered:    <p></p>

Just got to figure it out and do little experimenting as not totally clear, but looks promising

Thank you again.