How to highlight code in wordpress posts

well, to highlight the code in your posts in wordpress, you need to download the plugin

after you install it as in the instructions,

go to the admin panel then plugins, and activate the plugin, then go to Presentation -> Theme Editor , then choose from the menu on the right “Stylesheet” this will allow you to edit the file Style.css of your theme,

paste the following code in the end of it

pre {  font-family: Monaco, "Courier New", Courier, monospace;

font-size: 10px;

}.wp_syntax {

color: #100;

background-color: #f9f9f9;

border: 1px solid silver;

margin: 0 0 1.5em 0;

overflow: auto;


/* IE FIX */

.wp_syntax {

overflow-x: auto;

overflow-y: hidden;

padding-bottom: expression(this.scrollWidth > this.offsetWidth ? 15 : 0);

width: 100%;


.wp_syntax table {

border-collapse: collapse;


.wp_syntax div, .wp_syntax td {

vertical-align: top;

padding: 2px 4px;


.wp_syntax .line_numbers {

text-align: right;

background-color: #def;

color: gray;

overflow: visible;


/* potential overrides for other styles */

.wp_syntax pre {

margin: 0;

width: auto;

float: none;

clear: none;

overflow: visible;


then save the file, and whenever you want to write a code; write it as follow

<pre line=”1″ lang=”java”>
your code here</pre>

where java is the attribute of the code language

here is the full lists of attributes supported by this language

abap, actionscript, ada, apache, applescript, asm, asp, autoit, bash, blitzbasic, bnf, c, c_mac, caddcl, cadlisp, cfdg, cfm, cpp-qt, cpp, csharp, css, d, delphi, diff, div, dos, dot, eiffel, fortran, freebasic, genero, gml, groovy, haskell, html4strict, idl, ini, inno, io, java, java5, javascript, latex, lisp, lua, m68k, matlab, mirc, mpasm, mysql, nsis, objc, ocaml-brief, ocaml, oobas, oracle8, pascal, per, perl, php-brief, php, plsql, python, qbasic, rails, reg, robots, ruby, sas, scheme, sdlbasic, smalltalk, smarty, sql, tcl, text, thinbasic, tsql, vb, vbnet, vhdl, visualfoxpro, winbatch, xml, xpp, z80

and enjoy the colors 😉

Leave a Reply

Notify of