How to blog code at wordpress.com

BlogsCode Formattingwordpress.com

Blogs Problem Overview


got a new blog at wordpress few days ago (http://ghads.wordpress.com) and I want to post some code snippets now or then. Is there anyway to make it look like code without paying for extra plugins?

Blogs Solutions


Solution 1 - Blogs

See here: <http://en.support.wordpress.com/code/posting-source-code/>

Wrap your code in these tags: [sourcecode language='css'] .. [/sourcecode]

(or shorter [code lang='css'] .. [/code] )

Note that Visual Editor doesn't interpret the tags, you need to click Preview to see how it works.

Available language codes:

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

Hope that helps.

Solution 2 - Blogs

You can also use hilite.me. It doesn't require installation of plugins or JS/CSS files. It's also open-source and has an API.

Disclaimer: I'm the developer.

Solution 3 - Blogs

Crayon Syntax Highlighter is an excellent free plugin. I went with that one, but there are many others I came across that may serve the purpose:

Solution 4 - Blogs

There's a <code> html element you can use. Otherwise you could try the Textile or Markdown syntaxes (I'm not sure if WordPress.com uses them). Try it out and use the preview function in WordPress to see when you get it right.

Solution 5 - Blogs

With my Wordpress.org installation, I couldn't get the Accepted Answer here to work (not sure if that's only expected to work with Wordpress.com?)...

I ended up using the SyntaxHighlighter plugin instead.

With that plugin, at first, your code will appear escaped in 'Preview Changes' view: It will appear correctly then after publishing. I think thereafter publishing it will then appear correctly in 'Preview Changes' (not 100% about that).

Solution 6 - Blogs

If you are hosting your own wordpress blog opposed to on WP.com you can get this functionality by installing this plugin, since it is the same plugin that the WP.com code relies on.

http://wordpress.org/extend/plugins/google-syntax-highlighter/

Solution 7 - Blogs

You can also use the new web app I wrote called BlogTrog CodeWindow -- it's powered by Actipro CodeHighlighter.

http://www.blogtrog.com

It's free, should work in all modern browsers, and doesn't require you to install anything anywhere. Just paste your code and embed the results.

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestionGHadView Question on Stackoverflow
Solution 1 - BlogsAlex DugglebyView Answer on Stackoverflow
Solution 2 - BlogsAlexander KojevnikovView Answer on Stackoverflow
Solution 3 - BlogsJan KlimoView Answer on Stackoverflow
Solution 4 - BlogsChristian DavénView Answer on Stackoverflow
Solution 5 - BlogscellepoView Answer on Stackoverflow
Solution 6 - BlogsdanmayerView Answer on Stackoverflow
Solution 7 - BlogsDave HaynesView Answer on Stackoverflow