<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>Webstractions Web Development &#187; sample code formatting</title>
	<atom:link href="http://webstractions.com/tag/sample-code-formatting/feed/" rel="self" type="application/rss+xml" />
	<link>http://webstractions.com</link>
	<description>Abstract thoughts in web design and development.</description>
	<lastBuildDate>Wed, 02 Mar 2011 12:22:28 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.1</generator>
		<item>
		<title>Formatting Sample Code Snippets in WordPress</title>
		<link>http://webstractions.com/wordpress/formatting-sample-code-snippets-in-wordpress/</link>
		<comments>http://webstractions.com/wordpress/formatting-sample-code-snippets-in-wordpress/#comments</comments>
		<pubDate>Sat, 28 Feb 2009 18:34:49 +0000</pubDate>
		<dc:creator>Ronnie T. Dodger</dc:creator>
				<category><![CDATA[Wordpress]]></category>
		<category><![CDATA[sample code formatting]]></category>
		<category><![CDATA[wordpress plugins]]></category>

		<guid isPermaLink="false">http://webstractions.com/?p=74</guid>
		<description><![CDATA[Displaying code snippets in Wordpress can be a chore. Fortunately there are several plugins to choose from. My plugin of choice is Scott Reilly's <b>Preserve Code Formatting</b> which prevents modification by WordPress and other plugins while retaining original whitespace and characters.]]></description>
			<content:encoded><![CDATA[<p class="note">Update: With the new theme on this website, I have not actually styled this sucker and all of the formatting I did prior is now lost. I may bag this plugin for another. If anyone has any suggestions, drop me a line.</p>
<p>Displaying code snippets in WordPress can be a chore. Fortunately there are several plugins to choose from that will help you maintain the original formatting. </p>
<p>My plugin of choice right now is Scott Reilly&#8217;s <a href="http://coffee2code.com/wp-plugins/preserve-code-formatting/">Preserve Code Formatting</a>. Scott&#8217;s plugin prevents modification by WordPress and other plugins while retaining original whitespace and characters.</p>
<p>I looked at other plugins that included syntax highlighting, but quickly dismissed them. Syntax highlighting produces a ton of inline style spans wrapping the code fragments, and frankly, my choice of styling choices may not agree with your choices. </p>
<p>Now I can just paste code into <kbd>&lt;code&gt;</kbd>, <kbd>&lt;pre&gt;</kbd>, and/or other tags I can additionally specify and this plugin will:</p>
<pre name="code" class="html">
<ul>
<li>Prevent WordPress from HTML-encoding text (i.e. single- and double-quotes will not become curly; <code>--</code> and <code>---</code> will not become en dash and em dash, respectively; <code>...</code> will not become a horizontal ellipsis, etc)</li>
<li>Prevent most other plugins from modifying preserved code</li>
<li>Optionally preserve whitespace (in a variety of methods)</li>
<li>Optionally preserve code added in comments</li>
</ul>
</pre>
<p>One caveat with the plugin is that you turn off the Visual Editor in your WordPress settings. No biggy, I do this anyway. </p>
<p>Another quirk to the plugin is that it appears that the code block seems to get double wrapped with the <kbd>&lt;pre&gt;</kbd> tag. Why it does this, I do not know. But I took advantage of the quirk in my style sheet to apply a border effect.</p>
<pre name="code" class="html">
<pre>     /* additional &lt;pre&gt; element added to Html output */
<pre>  /* start of my post's code snippet */
         ... my code snippet sample here
      </pre>
</pre>
</pre>
<p>The option to preserve code in comments (on by default) was left on. This will come in handy for any commenters who wish to leave sample code snippets if they wish. So give it a try, that will be kewl to do.</p>
<p>Leave a comment if you are using this plugin and tell me about it. Or another plugin that you are using. Will be interested in seeing some samples in action.</p>


<div class="shr-bookmarks shr-bookmarks-expand shr-bookmarks-center shr-bookmarks-bg-knowledge">
<ul class="socials">
		<li class="shr-delicious">
			<a href="http://www.shareaholic.com/api/share/?title=Formatting+Sample+Code+Snippets+in+Wordpress&amp;link=http://webstractions.com/wordpress/formatting-sample-code-snippets-in-wordpress/&amp;notes=Displaying%20code%20snippets%20in%20Wordpress%20can%20be%20a%20chore.%20Fortunately%20there%20are%20several%20plugins%20to%20choose%20from.%20My%20plugin%20of%20choice%20is%20Scott%20Reilly%27s%20Preserve%20Code%20Formatting%20which%20prevents%20modification%20by%20WordPress%20and%20other%20plugins%20while%20retaining%20original%20whitespace%20and%20characters.&amp;short_link=http://b2l.me/ap3wng&amp;v=1&amp;apitype=1&amp;apikey=8afa39428933be41f8afdb8ea21a495c&amp;source=Shareaholic&amp;template=&amp;service=2&amp;tags=&amp;ctype=" rel="nofollow" class="external" title="Share this on del.icio.us">Share this on del.icio.us</a>
		</li>
		<li class="shr-digg">
			<a href="http://www.shareaholic.com/api/share/?title=Formatting+Sample+Code+Snippets+in+Wordpress&amp;link=http://webstractions.com/wordpress/formatting-sample-code-snippets-in-wordpress/&amp;notes=Displaying%20code%20snippets%20in%20Wordpress%20can%20be%20a%20chore.%20Fortunately%20there%20are%20several%20plugins%20to%20choose%20from.%20My%20plugin%20of%20choice%20is%20Scott%20Reilly%27s%20Preserve%20Code%20Formatting%20which%20prevents%20modification%20by%20WordPress%20and%20other%20plugins%20while%20retaining%20original%20whitespace%20and%20characters.&amp;short_link=http://b2l.me/ap3wng&amp;v=1&amp;apitype=1&amp;apikey=8afa39428933be41f8afdb8ea21a495c&amp;source=Shareaholic&amp;template=&amp;service=3&amp;tags=&amp;ctype=" rel="nofollow" class="external" title="Digg this!">Digg this!</a>
		</li>
		<li class="shr-facebook">
			<a href="http://www.shareaholic.com/api/share/?title=Formatting+Sample+Code+Snippets+in+Wordpress&amp;link=http://webstractions.com/wordpress/formatting-sample-code-snippets-in-wordpress/&amp;notes=Displaying%20code%20snippets%20in%20Wordpress%20can%20be%20a%20chore.%20Fortunately%20there%20are%20several%20plugins%20to%20choose%20from.%20My%20plugin%20of%20choice%20is%20Scott%20Reilly%27s%20Preserve%20Code%20Formatting%20which%20prevents%20modification%20by%20WordPress%20and%20other%20plugins%20while%20retaining%20original%20whitespace%20and%20characters.&amp;short_link=http://b2l.me/ap3wng&amp;v=1&amp;apitype=1&amp;apikey=8afa39428933be41f8afdb8ea21a495c&amp;source=Shareaholic&amp;template=&amp;service=5&amp;tags=&amp;ctype=" rel="nofollow" title="Share this on Facebook">Share this on Facebook</a>
		</li>
		<li class="shr-gmail">
			<a href="http://www.shareaholic.com/api/share/?title=Formatting+Sample+Code+Snippets+in+Wordpress&amp;link=http://webstractions.com/wordpress/formatting-sample-code-snippets-in-wordpress/&amp;notes=Displaying%20code%20snippets%20in%20Wordpress%20can%20be%20a%20chore.%20Fortunately%20there%20are%20several%20plugins%20to%20choose%20from.%20My%20plugin%20of%20choice%20is%20Scott%20Reilly%27s%20Preserve%20Code%20Formatting%20which%20prevents%20modification%20by%20WordPress%20and%20other%20plugins%20while%20retaining%20original%20whitespace%20and%20characters.&amp;short_link=http://b2l.me/ap3wng&amp;v=1&amp;apitype=1&amp;apikey=8afa39428933be41f8afdb8ea21a495c&amp;source=Shareaholic&amp;template=&amp;service=52&amp;tags=&amp;ctype=" rel="nofollow" class="external" title="Email this via Gmail">Email this via Gmail</a>
		</li>
		<li class="shr-googlebuzz">
			<a href="http://www.shareaholic.com/api/share/?title=Formatting+Sample+Code+Snippets+in+Wordpress&amp;link=http://webstractions.com/wordpress/formatting-sample-code-snippets-in-wordpress/&amp;notes=Displaying%20code%20snippets%20in%20Wordpress%20can%20be%20a%20chore.%20Fortunately%20there%20are%20several%20plugins%20to%20choose%20from.%20My%20plugin%20of%20choice%20is%20Scott%20Reilly%27s%20Preserve%20Code%20Formatting%20which%20prevents%20modification%20by%20WordPress%20and%20other%20plugins%20while%20retaining%20original%20whitespace%20and%20characters.&amp;short_link=http://b2l.me/ap3wng&amp;v=1&amp;apitype=1&amp;apikey=8afa39428933be41f8afdb8ea21a495c&amp;source=Shareaholic&amp;template=&amp;service=257&amp;tags=&amp;ctype=" rel="nofollow" class="external" title="Post on Google Buzz">Post on Google Buzz</a>
		</li>
		<li class="shr-stumbleupon">
			<a href="http://www.shareaholic.com/api/share/?title=Formatting+Sample+Code+Snippets+in+Wordpress&amp;link=http://webstractions.com/wordpress/formatting-sample-code-snippets-in-wordpress/&amp;notes=Displaying%20code%20snippets%20in%20Wordpress%20can%20be%20a%20chore.%20Fortunately%20there%20are%20several%20plugins%20to%20choose%20from.%20My%20plugin%20of%20choice%20is%20Scott%20Reilly%27s%20Preserve%20Code%20Formatting%20which%20prevents%20modification%20by%20WordPress%20and%20other%20plugins%20while%20retaining%20original%20whitespace%20and%20characters.&amp;short_link=http://b2l.me/ap3wng&amp;v=1&amp;apitype=1&amp;apikey=8afa39428933be41f8afdb8ea21a495c&amp;source=Shareaholic&amp;template=&amp;service=38&amp;tags=&amp;ctype=" rel="nofollow" class="external" title="Stumble upon something good? Share it on StumbleUpon">Stumble upon something good? Share it on StumbleUpon</a>
		</li>
		<li class="shr-twitter">
			<a href="http://www.shareaholic.com/api/share/?title=Formatting+Sample+Code+Snippets+in+Wordpress&amp;link=http://webstractions.com/wordpress/formatting-sample-code-snippets-in-wordpress/&amp;notes=Displaying%20code%20snippets%20in%20Wordpress%20can%20be%20a%20chore.%20Fortunately%20there%20are%20several%20plugins%20to%20choose%20from.%20My%20plugin%20of%20choice%20is%20Scott%20Reilly%27s%20Preserve%20Code%20Formatting%20which%20prevents%20modification%20by%20WordPress%20and%20other%20plugins%20while%20retaining%20original%20whitespace%20and%20characters.&amp;short_link=http://b2l.me/ap3wng&amp;v=1&amp;apitype=1&amp;apikey=8afa39428933be41f8afdb8ea21a495c&amp;source=Shareaholic&amp;template=%24%7Btitle%7D+-+%24%7Bshort_link%7D&amp;service=7&amp;tags=&amp;ctype=" rel="nofollow" class="external" title="Tweet This!">Tweet This!</a>
		</li>
		<li class="shr-printfriendly">
			<a href="http://www.shareaholic.com/api/share/?title=Formatting+Sample+Code+Snippets+in+Wordpress&amp;link=http://webstractions.com/wordpress/formatting-sample-code-snippets-in-wordpress/&amp;notes=Displaying%20code%20snippets%20in%20Wordpress%20can%20be%20a%20chore.%20Fortunately%20there%20are%20several%20plugins%20to%20choose%20from.%20My%20plugin%20of%20choice%20is%20Scott%20Reilly%27s%20Preserve%20Code%20Formatting%20which%20prevents%20modification%20by%20WordPress%20and%20other%20plugins%20while%20retaining%20original%20whitespace%20and%20characters.&amp;short_link=http://b2l.me/ap3wng&amp;v=1&amp;apitype=1&amp;apikey=8afa39428933be41f8afdb8ea21a495c&amp;source=Shareaholic&amp;template=&amp;service=236&amp;tags=&amp;ctype=" rel="nofollow" class="external" title="Send this page to Print Friendly">Send this page to Print Friendly</a>
		</li>
</ul><div style="clear: both;"></div><div class="shr-getshr" style="visibility:hidden;font-size:10px !important"><a target="_blank" href="http://www.shareaholic.com/?src=pub">Get Shareaholic</a></div><div style="clear: both;"></div></div>

]]></content:encoded>
			<wfw:commentRss>http://webstractions.com/wordpress/formatting-sample-code-snippets-in-wordpress/feed/</wfw:commentRss>
		<slash:comments>9</slash:comments>
		</item>
	</channel>
</rss>

