How to post syntax highlighted code or program snippet on your wordpress.com blog


I had been on the lookout for a solution to post highlighted program code on my blog. Finally I found a good solution, which might have been there for a long time, but since I found it only, I have decided to share it with you all. :)
To post higlighted code in a wordpress.com blog, use the

[sourcecode language=”TYPE”]
  Your code goes here.
[/sourcecode]

The TYPE specifies which language your code is in, the languages now supported by wordpress.com blogs are(just replace the TYPE with the name of the language as shown in the list below)-

  • actionscript3
  • bash
  • coldfusion
  • cpp
  • csharp
  • css
  • delphi
  • erlang
  • fsharp
  • diff
  • groovy
  • javascript
  • java
  • javafx
  • matlab (keywords only)
  • objc
  • perl
  • php
  • text
  • powershell
  • python
  • ruby
  • scala
  • sql
  • vb
  • xml

For displaying a PHP page, which contains both html and PHP entities, we have to set to the PHP language with “htmlscript” configuration parameter set to “true”.
An Example

What we have to type –

[sourcecode language=”php” htmlscript=”true”]
  Your code goes here.
[/sourcecode]

The Output:
I have put some code in the “Your code goes here” section and tada, you get a cool syntax-highlighted code section.

<html>
<head>
<title>PHP Test</title>
</head>
<body>
 This is an HTML line
<?php
echo “This is a PHP line”;
phpinfo();
?>
</body>
</html>


Many other configuration parameters are also available, please visit the following post to read more about it-
http://en.support.wordpress.com/code/posting-source-code/
Courtesy: The above link ^

About these ads

3 thoughts on “How to post syntax highlighted code or program snippet on your wordpress.com blog

  1. Thanks for the great help. Posting code on wordpress.org isn’t that difficult because of plugins. But I was having a horrible time with my wordpress.com blog trying to write a php tutorial. Code would automatically get deleted or html code “executed”. Thanks again!

  2. Pingback: How to type New Indian Rupee Symbol(the right way) | Bayrees's Blog

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s