I provide consulting and custom development for Natural Language Processing, Information Extraction and Search solutions.

Mar 28
2009

Hacking wp-syntax plugin to show header

I was recently asked how I got the wp-syntax plugin to show a header like so:

test.cpp

1
2
3

int main() {
	return 0;
}

To show the test.cpp file name, I modified the wp-syntax.php file (present in /wp-content/plugins/wp-syntax/) like so:

Changed the regular expression in the wp_syntax_before_filter function from:

wp-syntax.php

function wp_syntax_before_filter($content)
{
    return preg_replace_callback(
        "/\s*<pre(?:lang=[\"']([\w-]*)[\"']|line=[\"'](\d*)[\"']|escaped=[\"'](true|false)?[\"']|\s)+>(.*)<\/pre>\s*/siU",
        "wp_syntax_substitute",
        $content
    );
}

to

wp-syntax.php

function wp_syntax_before_filter($content)
{
    return preg_replace_callback(
        "/\s*<pre(?:lang=[\"']([\w-]*)[\"']|line=[\"'](\d*)[\"']|escaped=[\"'](true|false)?[\"']|header=[\"']([\w-\. ]*)[\"']|\s)+>(.*)<\/pre>\s*/siU",
        "wp_syntax_substitute",
        $content
    );
}

And the wp_syntax_highlight function to:

function wp_syntax_highlight($match)
{
    global $wp_syntax_matches;
 
    $i = intval($match[1]);
    $match = $wp_syntax_matches[$i];
 
    $language = strtolower(trim($match[1]));
    $line = trim($match[2]);
    $escaped = trim($match[3]);
    $header = trim($match[4]);
    $code = wp_syntax_code_trim($match[5]);
    if ($escaped == "true") $code = htmlspecialchars_decode($code);
 
    $geshi = new GeSHi($code, $language);
    $geshi->enable_keyword_links(false);
    do_action_ref_array('wp_syntax_init_geshi', array(&$geshi));
 
    $output = "\n<div class=\"wp_syntax\">";
 
    if($header) {
        $output .= "<div class=\"wp_syn_hdr\">" . $header . "</div>";
    }

Node the addition of lines 104 and 114-116

All you have to do is add another attribute header="header-text" in your pre tag. ex. <pre lang="php" line="1" header="wp-syntax.php">

3 Responses (rss) (trackback)

#1

vikram

March 28th, 2009 at 7:28 am

i had heard…and now i see

#2

namran

June 18th, 2009 at 9:03 pm

I think you forgot to mention ..
additional css component to be added as below :

/* — Code Highlighting –*/
.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:540px;
}

.wp_syntax table {
border-collapse: collapse;
}

.wp_syntax .wp_syn_hdr {
background-color:#def;
color:#666;
text-align:center;
border-bottom:1px dotted silver;
}

.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;
}

.right-me {
text-align:right;
}

Else it will not spit the same as above also..

Thanks anyway..

p/s : I also copied from yours.

#3

Things to do after a series of upgrade in wordpress | :: HawkEYE Expression ::

August 9th, 2009 at 4:19 am

[...] : 1. http://pravin.insanitybegins.com/ 2. [...]

Palindromic sub-sequences in python

This bit of python code returns all palindromic subsequences in the input string.

[Read More]

Feb
19

Join a list of integers in Python

How do you run a string join on a list of integers in Python? After googling for about 10 mins, I gave up and did this. I am sure there is a better way of doing it!

[Read More]