BlogoSquare

Essential problogging resources and downloads

The proper way to write code in your blog posts

April 21st, 2007 by Hans

When writing a blog post,many of us write the code for a particular application directly in the post which get executed(mostly for HTML tags and PHP code), in return messing things up. For example while telling your visitors how to make text bold, you would use the <strong> tag but when publishing the post, this will get executed and making text somewhere it shouldn’t, bold. Down here, I’ll show you how to write any code for any language the proper way, that is one in which it won’t be executed but nonetheless your visitors will be able to copy and use the code without any manoeuvre.

messy code

Previously I used different techniques to write code in my post like putting a space inside the tag so that it isn’t considered a valid tag like < strong > but when people would copy the code, the space will be in there too and it wouldn’t work on their side. It’s when Lorelle gave me a post that I was enlightened into the proper way of writing code.

You would wrap the <code> tag around your code so as to dress it with the respective style to distinguish it from the rest of your text. Then the proper way is to turn your code into character entities like the following :

From :

<code><strong>example code</strong></code>

to

&lt ;code&gt ;&lt ;strong&gt ;example code&lt ;/strong>&lt ;/code&gt ;

This can be applied to any language while you’re posting code. Lorelle gave a list of different converters but I’ve found one called Postable which is quick,clean and easy to use.

putting code into postable

You put the code there and click on the make it friendly button(scroll down the page if you’re not seeing it) which will then provide you the character entities of the code. You then paste that in your post surrounded by the <code> tag to style it. When publishing your post, the code will appear like it should but without getting executed nonetheless.

postable code

I would advise you to bookmark Postable and put a link near your comment form if many of your posts and comments deal with code so that people can turn the code into proper character entities ready to be published.

If you need any help or clarification, please leave a comment or contact me and I will be glad to help you :)

related reading

Tags: 22 Comments

Leave A Comment

22 responses so far ↓