Skip navigation

WordPress Plugins That Help You Write Code

WordPress PluginsIf you write about WordPress, Javascript, CSS, HTML/XHTML, mathematics, calculus, science, research, and a lot of other code, programming, and calculations, you are going to need to be able to write code in your blog. I can tell you from personal experience, this is a painful and…extraordinarily frustrating process, to be nice about it.

Since writing code in my own WordPress blogs is a part of my day-to-day blogging, I thought I’d share with you some of the WordPress Plugins that help you write code and equations in your blogs during my month long series on WordPress Plugins

Have you ever posted this:

< the_content(); ?>

And ended up with this:

&lt; the_content(): ?&gt;

Or ended up with nothing or screwing up your entire post page?

That’s just a few of the headaches and problems that come from trying to put code inside a blog post.

When you put code in a WordPress blog, it will do one of two things. It will try to use the code as code, something you do not want it to do, or more likely turn it into the last example, converting various elements of the code to HTML character entities.

You have three options for displaying code on your WordPress blog.

  1. You can write it manually.
  2. Use a code converter online program.
  3. Use a WordPress Plugin to help you convert the code as you write or when you save and publish your post.

To learn how to do it manually, you will need a text editor and to read Writing Code in Your Posts in the WordPress Codex for full version blogs or Signatures and Writing Code and Math for the Masses for WordPress.com blogs.

To use an online converter program, you could use any of the following:

To use a WordPress Plugin, well, since this is month long series on WordPress PluginsWordPress Plugin Month, I found a lot of options for you.

WordPress Plugins To Help You Write Code

There are a variety of WordPress Plugins which help you write code on your WordPress with ease. I’ve broken them down into three different types.

  • Code Converter WordPress Plugins: These simply convert the code you write into code that will display in your browser. Nothing more.
  • Syntax Highlighters: These will convert your code but they will also highlight different code elements with color such as <?php the_content(); ?> to make it easier to read.
  • Specialized Language Code Converter WordPress Plugins: These will convert code on your blog to match the typical format of your programming code language. You use a code language like CSS, you would use <pre lang="css"> to designate the language type. Examples of other languages include actionscript-french, actionscript, apache, applescript, asp, acadlisp, cfm, c_mac, c, delphi, diff, div, dos, d, eiffel, freebasic, gml, html4strict, ini, java5, java, javascript, matlab, mysql, oracle8, pascal, perl, php-brief, php, python, qbasic, robots, ruby, smarty, sql, vb, visualfoxpro, xml and many more.

All of these will convert your code into something the web browser can interpret and display as code on your page. Some Plugins offer more features than others. You need to choose the one that will best meet your own blog’s needs.

The Plugins will typically convert whatever is in your blog post wrapped in the <code> or <pre> tags.

Code Converter WordPress Plugins

The following WordPress Plugins will only help you convert programming languages and codes into something that can be displayed on your blog’s post in WordPress. Most of these will convert anything in a <code> or <pre>, and/or will add a button to the quicktags button bar to allow one button adding of code that is automatically converted.

In general, these will only help you convert HTML, XHMTL, CSS, Javascript, and other web-based programming languages. They are not for mathematical equations.

Snytax Highlighter WordPress Plugins

These WordPress Plugins will convert code into something the browser can read, and offer the ability to color different areas of your code to help it be more readable. These are excellent for bloggers who publish large chunks of code as they tend to make the code more readable. Many of the Plugins listed under Specialized Language Code below also include syntax highlighting, however, these only convert simple HTML/CSS code, not various programming languages.

Some allow a lot of customization, others only a little.

Specialized Language Code Converter WordPress Plugins

Example of LaTex equation in WordPressAll of these will convert code, but the conversion code isn’t as simple as turning &lt; into <. These deal with specialized programming or mathematical equations and formulas. Many also feature syntax highlighting.

If you specialize in a specific programming language, check the different Plugins to find the one that will meet your needs.

More WordPress Plugins and Tips for Writing Code in Your Blog

Writing code in your WordPress blogs isn’t easy, but I’ve collected some tips to help you write code in your blog.

Bibtex, Latex, XML, HTML, RDF, Eclipse and WordPress offers an indepth look at the various methods of using various code producing Plugins in WordPress and other documents.

LaTeX in WordPress is a blog dedicated to Latex Render WordPress Plugin as well as all things mathematical, and offers great tips, Plugins, information, and resources for using LaTeX in WordPress.

The guide for IllustRender features some amazing mathematical illusions that are possible using the Plugin and similar LaTeX Plugins.

Tyler’s Wrapping Text Inside PRE Tags is a great article with tips on how to use CSS to style your <pre> tag to do some line wrapping. I reviewed this technique in Wrapping Text Inside PRE HTML Tags.

Other helpful articles include:

Are you using a mathematical, syntax highlighting, or code converter Plugin I haven’t mentioned? Please share which one you use. And if you have used any of these, some tips and insights would be nice, too, to help people choose which one works best for you.

Related Articles


Site Search Tags: , , , , , , , , , , , , , , , , , , , , , , , , , ,
Copyright Lorelle VanFossen, member of the 9Rules Network Feed on Lorelle on WordPress Subscribe

Member of the 9Rules Blogging Network

14 Comments

  1. Fylliper
    Posted February 23, 2007 at 8:28 pm | Permalink

    Thankyou

  2. Posted February 24, 2007 at 8:49 pm | Permalink

    I wish a post like this existed back when I needed it ;)
    Well done,
    George

  3. Posted February 25, 2007 at 2:22 pm | Permalink

    For some reason I was expecting this thread to be about plugins that allow you to run PHP code in posts and pages. Perhaps that’s something else you could write about?

  4. Posted February 25, 2007 at 3:28 pm | Permalink

    Writing code in a blog in order for it to display and using code in order to make the code actually generate content and information are very different.

    runPHP, Text Control, and PHP Exec WordPress Plugin will work to allow you to use PHP code within your WordPress posts. However, it is not recommended, nor is anyone encouraged to do this unless they really know what they are doing and why. Some of these are very restricted in what you can and cannot do. Others are more flexible, but check to make sure they have been updated to work in the latest version of WordPress.

  5. Posted March 11, 2007 at 4:37 am | Permalink

    Thanks a lot for writing this article! I tried two or three code converter plugins in Jan 2007 but ended up generating serious errors.

    I’m gonna try Code Highlighter plugin this time…

  6. Posted August 27, 2007 at 7:49 am | Permalink

    Character entities don’t work in WordPress blogs. I’ve tried them a million times. If you insert them directly, they get displayed as text, i.e., >. If you insert them using the ‘Edit HTML source’ option in the rich text editor, they get converted to code that gets parsed instead of displayed. I’ve also tried using character entities in <code> tags and they still don’t work. I already know how to use character entities. What I need is some way to make WordPress behave and treat them properly.

  7. Posted August 27, 2007 at 10:32 am | Permalink

    I don’t know what you are talking about. Character entities work. I use them almost every day on my various WordPress blogs. See Writing Code in Your Posts and Signatures and Writing Code in WordPress.com Blogs, as well as my article on the Blog Herald, Writing and Publishing Code in Your WordPress Blog Posts, all examples of how to write and publish code in your WordPress blog posts.

    First, let me explain better what a character entity is. The symbol, <, which starts off most PHP and HTML code, is not a character entity. It is a symbol, a character. The character entity which is used to convert the symbol into something the browser can “read” as a symbol, not code, is a character entity. It is &lt; which converts to < in the browser. I explain more on this in the above listed articles.

    Just because you use the <code> html tag doesn’t mean it will automatically convert anything in the tags to “code”. It wouldn’t know where to begin. It takes a sophisticated program to automatically detect which is code and which is text and convert it to something the browser can interpret as “not-code”, when the purpose of the browser is to convert everything to code.

    To make this more convenient, you can use a WordPress Plugin, like one of these in the article above. Some of these will automatically detect the use of the <code> HTML tag and convert it into something the browser can read as text.

    However, I don’t. I just do this manually and it works every time. <?php happy_code_publishing(); ?> ;-)

  8. Posted January 3, 2008 at 11:14 am | Permalink

    Thank you, I’m glad I found this page as it may just be the answer to what I need for adding code to my blogs.

  9. Posted March 23, 2008 at 12:35 pm | Permalink

    I just figured out the problem many users have with this and other code highlighting plugins while writing code in visual/WYSIWYG mode (e.g.problem of “>” turning into “& gt;” “<” turning into “& lt;”, weird ” and “” tags appering etc). I made a simple hack for the same thing. Take a look

  10. Posted April 17, 2008 at 8:23 pm | Permalink

    Thank you for carrying my plug in “Un-Formating”.

  11. ROW
    Posted January 29, 2009 at 12:35 pm | Permalink

    Thanks. That was some great info. Finally I managed to get a plugin suitable for my needs.

    Thanks again!

  12. Posted July 7, 2009 at 6:26 am | Permalink

    @ Lorel

    I never imagined there were plugins for writing codes and never even dared searching until today. I thought everything had to be manual. Thanks very much. I have carefull reviewd the huge list and chosen the simplest for me.

    @ shantanu goel

    Thanks very much for the hack. It rocks and works like magic.

  13. Posted May 3, 2010 at 12:54 am | Permalink

    Any idea how to display full shortcodes without WordPress trying to process them? I am trying to put together a tutorial for plugins and I can’t seem to get any of these sourcecode options to work when the contents inside is also a shortcode.

    • Posted May 3, 2010 at 7:52 pm | Permalink

      Yes, convert them into HTML character entities. I’ve included resources in this article to help if you are unfamiliar with those. Thanks.


27 Trackbacks/Pingbacks

  1. [...] post by George P. and software by [...]

  2. [...] post by Lorelle VanFossen and powered by Img [...]

  3. [...] WordPress Plugins That Help You Write Code « Lorelle on WordPress (tags: wordpress plugin code plugins) [...]

  4. [...] that the code will automatically look and act like content in a code format. Unless you are using a WordPress Plugin that automatically converts anything in those tags to a text code format, all you are doing is changing the font not the [...]

  5. [...] WordPress Plugins That Help You Write Code « Lorelle on WordPress – Feb 2007 (tags: wordpress plugin) [...]

  6. [...] WordPress Plugins That Help You Write Code [...]

  7. [...] Vi segnalo questa interessantissima pagina (purtroppo per alcuni in inglese) dove vengono spiegati i diversi modi per inserire codice nei post del vostro WordPress. Link: Inserire codice nei post di WordPress [...]

  8. [...] Topic: Sialan nih wordpress, susah banget nulis code spt di atas. Sptnya harus install plugin nih. Tapi [...]

  9. [...] used in HTML/XHTML, PHP, and other programming languages. Also you need to check her other post “WordPress Plugins That Help You Write Code” sharing some of the WordPress Plugins that help you write code and equations in your [...]

  10. [...] recommending different methods. From using plugins and custom fields, to manually editing, and to online converters. I tried them all, but they either didn’t display the code correctly, or messed up my [...]

  11. [...] punto de partida puede ser este útil post de Lorelle, donde nos presenta varios plugins que facilitan la inclusión de código en los posts, además de [...]

  12. [...] https://lorelle.wordpress.com/2007/02/23/wordpress-plugins-that-help-you-write-code/ [...]

  13. [...] Here is an article which lists plugins that can be used for writing code and syntax highlighting. [...]

  14. [...] anglais sur le sujet de Lorelle VanFossen, qui fait autorité sur tout ce qui touche à WordPress. https://lorelle.wordpress.com/2007/02/23/wordpress-plugins-that-help-you-write-code/ « Filtrer les publicités et annonces Google [...]

  15. [...] for it. In this case there are many from simpler decoders to complex code formatting frameworks.  Lorelle compiled a very good list of tools, services and plugins to help us, bloggers. Here is a few of [...]

  16. [...] shareware, or freeware code converter program. Or if you use code regularly in your WordPress blog, get a WordPress Plugin that make the job much easier from within your Write Post [...]

  17. [...] WordPress Plugins That Help You Write Code @Lorelle on WordPress [...]

  18. [...] Lorelle hat dazu eine tolle Liste zusammengestellt (ist allerdings schon älteren Datums), die werde ich wohl durchackern müssen… Das könnte Dich auch interessieren:Thumbnails in ElegantthemesShadowbox PluginPosts zwischen Datum X und Datum YTimThumb – automatische ThumbnailsGeschützten Memberbereich einrichten Diesen Artikel via Bookmark-Service empfehlen Kommentare ausblenden [...]

  19. [...] let the finicky filters have the last word, and we didn’t want to have to rely on an externally written plug-in. Besides, most of the plug-ins we saw, despite all of their author’s hard work, were either [...]

  20. [...] A detailed discussion with links to both online converters and downloadable software can be found here. [...]

  21. [...] 1)Signatures and Writing Code/签名和书写代码- Lorelle写了这篇非常有用的日志,告诉你如何在Wordpress博客中书写代码, 如何在HTML/XHTML,PHP或是其它编程语言中书写字符实体。你也可能想要看一下其它的文章 “WordPress Plugins That Help You Write Code/帮助你书写代码的Wordpress插件” [...]

  22. [...] 1)Signatures and Writing Code/签名和书写代码- Lorelle写了这篇非常有用的日志,告诉你如何在Wordpress博客中书写代码, 如何在HTML/XHTML,PHP或是其它编程语言中书写字符实体。你也可能想要看一下其它的文章 “WordPress Plugins That Help You Write Code/帮助你书写代码的Wordpress插件” [...]

  23. [...] “WordPress Plugins That Help You Write Code/帮助你书写代码的WordPress插件” 2)在线代码转换器- [...]

  24. […] WordPress Plugins That Help You Write Code […]

  25. […] I did write a lot about writing codes in your blog posts with WordPress Plugins, I also found Chemical Formula Formatter WordPress Plugin. It automatically format chemical […]

  26. […] 1)Signatures and Writing Code/签名和书写代码- Lorelle写了这篇非常有用的日志,告诉你如何在Wordpress博客中书写代码, 如何在HTML/XHTML,PHP或是其它编程语言中书写字符实体。你也可能想要看一下其它的文章 “WordPress Plugins That Help You Write Code/帮助你书写代码的Wordpress插件” […]

  27. […] 1)Signatures and Writing Code/签名和书写代码- Lorelle写了这篇非常有用的日志,告诉你如何在Wordpress博客中书写代码, 如何在HTML/XHTML,PHP或是其它编程语言中书写字符实体。你也可能想要看一下其它的文章 “WordPress Plugins That Help You Write Code/帮助你书写代码的Wordpress插件” […]

Post a Comment

Follow

Get every new post delivered to your Inbox.

Join 19,717 other followers

%d bloggers like this: