How to Properly Write Code in Your Blog Posts
Web Design Blogging Useful Tips | Saturday, June 30, 2007This is a great tip if you write HTML and PHP tutorials on your blog. You know that if you try to simply show your readers the code by typing it in, it will be parsed and outputted as normal HTML, and rendered by the browser. Here’s how to fix this, and be able to display code that your viewers can read and even copy. For example, a phrase wrapped in:
<strong>Example</strong>
will become:
Example
If you want to correctly put code into your posts so your viewers can read it as code, you will need to enter it using the correct HTML entities, so:
<strong>Example</strong>
will become:
<strong>Example</strong>
You can translate regular HTML and PHP code into code with entities for the < and the > by using this online tool.
If you’re putting long lengths of code into your blog post, I suggest wrapping the code with <code> tags, because they let you style your code. For example:
code {font-size: 130%; background: #fafafa;}.
You could also wrap the code with <pre> tags. The code and pre tags differ because the code tag conforms to the columns that you place it in. The pre tag will overflow any columns and ignore paragraph formatting until you hit return.
I hope this is useful to anyone who has had trouble doing this in the past. If you have a question, hit the comments below.