Jonas Grønås Drange

The plugin adds one js-file which searches through your blog and adds extra HTML markup to <code>.key-shortcut</code> elements.
A stylesheet is added that applies styling to the extra HTML markup.
This results in <code>.key-shortcut</code> elements looking somewhat like keyboard buttons.

Key Shortcut Formatter

Key Shortcut Formatter enhances the presentation of keyboard shortcuts with simple CSS and JavaScript

MondoKode-Zoomer was created for blogs that have a narrow reading column but will 
be embedding code using the wp_syntax plugin. A narrow column is a pleasure to read 
and there is a reason for this.
<blockquote>
“That’s why newspapers have narrow columns: It makes them faster to read.”
</blockquote>
<ul>
<li>Amar Sagoo <a href="http://amarsagoo.info/tofu/" rel="nofollow ugc">Tofu web page</a></li>
</ul>
However, it is a nuissance to have a narrow width constraint when presenting kode. I’ve caught myself 
reformatting kode on numerous occasions in hope of eliminating the horizontal scrollbar. 
With this plugin you can spend more time sharing kode and less time formatting it for a skinny column.
<h3>Basic Usage</h3>
Add a zoom attribute to a pre block that wp_syntax formats. Valid values for the 
attribute are “yes” and “no”.
<pre><code> <pre lang="LANGUAGE" zoom="yes"> 
</code></pre>
The attribute is not required. When it is not present zoom is not enabled.
<h3>Wp-syntax Changes</h3>
To allow wp_syntax and MondoKode-zoomer to play nicely you need to use the version of wp-syntax.php 
provided with this plugin. The changes to the file are listed here, do a diff comparison with the 
original to see the changes in detail.
<ol>
<li>zoom is added as a supported attribute in $allowedposttags and $allowedtags.</li>
<li>The regular expression in the wp_syntax_before_filter function has been modified to allow the zoom attributed. </li>
<li>In the wp_syntax_highlight function some logic was added to add the wp_syntax_zoom css class to 
a div block if zoom was enabled.</li>
</ol>
<h3>Usage</h3>
Use regular wp-syntax formatting commands but add the zoom attribute if you want the kode to zoom. 
It’s that simple.
Example 1: Enabling zoom
<pre><code><pre lang="php" zoom="yes">
<div id="foo">
<?php
 function foo() {
 echo "Hello World!\\n";
 }
?>
</div>
</pre>
</code></pre>
Example 2: Explicitly disabling zoom
<pre><code><pre lang="java" zoom="no" >
public class Hello {
 public static void main(String[] args) {
 System.out.println("Hello World!");
 }
}
</pre>
</code></pre>
Example 3: Zoom is implicity disabled because the attribute does not exist
<pre><code><pre lang="ruby" line="18">
class Example
 def example(arg1)
 return "Hello: " + arg1.to_s
 end
end
</pre>
</code></pre>

MondoKode-Zoomer

MondoKode-Zoomer provides an overlay window for kode formatted with the wp_syntax plugin.

Key Shortcut Formatter vs MondoKode-Zoomer