I’ve been burned a few times in WordPress when posting something like:
This is how you make text italic:
This is italic.
when I actually wanted:
This is how you make text italic:
<em>This is italic.</em>
Of course it’s not too hard to remember to encode the special characters but this is WordPress and things are supposed to be easy. So I thought I would throw together a simple WordPress plugin to convert HTML special characters inside <code></code> tags. That was a few months ago and I got the plugin most of the way done and then got distracted with other things. But after reading about another person having the same annoyance, I decided I should finish the plugin.
So here is WP_CodeShield. It simply looks for <code></code> tags in posts and comments and makes sure the contents are encoded properly. You just type the code you want inside <code></code> tags and it should appear correctly. So you can type <code><em>This is italic.</em></code> instead of <code><em>This is italic.</em></code>.
If you have any questions, suggestions or requests, please leave them in the comments below. You can also test WP_CodeShield out in the comments if you are curious.
Current Version:
Installation instructions:
Unzip wp_codeshield.zip. Upload wp_codeshield.php to wp-content/plugins/ and active in the Plugin Control Panel. That’s it. Anything inside <code></code> tags will now automatically be converted to proper HTML.
Technical Details
Most people should be OK just using WP_CodeShield naturally but for especially fancy users here are the more technical details:
Nested code tags are ok (I’ve been using them in this post) but unequal numbers of <code> and </code> will cause the plugin to leave the entire post or comment alone. WP_CodeShield will leave any string which already contains HTML special characters alone. For example <em> will be left alone. This is in case you have previously hand entered the special characters or want to describe something more complex than the plugin can handle. To keep track of these special occurrences, WP_CodeShield adds a small invisible comment tag (<!--formatted-->). WP_CodeShield only looks for <code></code> tags. <code ></code > or <code class="fancy"></code> will not be filtered. One small gotcha is that if a post contains <code class="fancy"></code> no filtering will occur on that post (WP_CodeShield will think that the tags are unbalanced). You can get around this by making sure both the opening and closing tags do not match WP_CodeShield’s target like <code class="fancy"></code > (the extra space keeps WP_CodeShield from seeing the tags but are still valid HTML).
ScottS-M | 14-May-07 at 6:22 pm | Permalink
Code in the comments test:
<?php echo "<i>Test</i>";?>and a second which is also nested:<code>?><em>Test2</em> <?php</code>.Jonathan | 16-May-07 at 5:30 pm | Permalink
Ah, Scott answered my question already, whether or not it would handle more than just HTML.
ScottS-M | 16-May-07 at 5:41 pm | Permalink
@Jonathan
Yeah I probably should have mentioned that it should handle any programming language. It’s just looking for the special HTML characters that would cause trouble (
&,<,>,",') and making sure they’re encoded properly so they don’t cause trouble. I think WordPress does a bit of this on it’s own but not quite enough for me.Aaron Saray | 05-Jul-07 at 9:28 pm | Permalink
Hey man – thanks very much for this plugin – it actually does everything I was looking for.
+2 kudos man.
erwrwrwrwe | 28-Feb-08 at 2:23 pm | Permalink
Code in the comments test: <?php echo “Test“;?> and a second which is also nested:
?><em>Test2</em> <?php.Jason | 12-Mar-08 at 3:50 am | Permalink
The only problem that we’re having is making it work on our own form that our visitors use to make new posts (not the one in the admin panel). Other than that, it’s a good plugin!
ScottS-M | 12-Mar-08 at 8:31 am | Permalink
@Jason
Right now I’ve only got it hooked into standard WordPress comment/post filters. If you want to add it to something else you could add filters
add_filter('pre_XXXX_save','wp_codeshield');add_filter('XXXX_edit_pre','wp_codeshield_anti');
The anti is to convert the &’s back to & when you reedit a post but maybe that would not be necessary for your visitors if they don’t get to edit. If you don’t have filter hooks, you could just call it manually when your form submits like:
wp_codeshield($_POST['code_form']).Jason | 12-Mar-08 at 2:10 pm | Permalink
@ ScottS-M
You’re amazing! It finally works. Now I can go to sleep. :)
(what plugin are you using that lets users who aren’t logged in edit their posts?)
ScottS-M | 12-Mar-08 at 3:55 pm | Permalink
I’m using “Edit Comments” by Andrew Sutherland but it looks like his site is down. It’s been quite a while since I messed with it. Probably should update to one that is being actively developed.
darkpollo | 07-May-08 at 4:20 am | Permalink
Is this working on 2.5.1?
Thanks
ScottS-M | 07-May-08 at 11:24 am | Permalink
@darkpollo
Yeah. I’m using WP 2.5.1 here. Let me just test to make sure:
if ($x && $y){echo "<i>brackets</i>";}Yep it’s till working.
viv | 09-Mar-09 at 3:52 am | Permalink
Is it working?
viv | 09-Mar-09 at 3:53 am | Permalink
Testing
comment_status) ) {do_action('comment_id_not_found', $comment_post_ID);
exit;
} elseif ( !comments_open($comment_post_ID) ) {
do_action('comment_closed', $comment_post_ID);
wp_die( __('Sorry, comments are closed for this item.') );
} elseif ( in_array($status->post_status, array('draft', 'pending') ) ) {
do_action('comment_on_draft', $comment_post_ID);
exit;
}?>
<?php the_content('Read the rest of this entry »'); ?>
Tom | 19-Jul-09 at 6:28 pm | Permalink
Thanks!
This little gizmo makes my life quite a bit easier. I feel like the ‘code’ tags should have done this in the first place…
Paul | 25-Feb-11 at 8:39 am | Permalink
Thank you very much!