Embedded Components and Tools Blog Center

Ron Fredericks writes: In my last two posts:

• I discovered Dean Lee’s Code Highlighter plugin for WordPress as the blogging solution for my source code display needs.
• I fixed a word wrap problem in Dean’s plugin.

During my research to solve the word wrap problem, I discovered a few more issues leading me to update Dean’s plugin with the latest version of GeSHI (an open-source project: Generic Syntax Highlighter for php. Highlight many languages, including PHP, CSS, HTML, SQL, Java, Assembler, and C for XHTML compliant output) and removal of unused files. I thought other WordPress bloggers might like to take advantage of the latest code too, so I document the steps needed to build a clean plugin with the latest components.

Flow Chart / Swim Lanes Widget
Below is a Flash widget I built to document the steps needed so you can roll your own up-to-date plugin. Follow these steps and you won’t have to be a programmer to get the benefits from the latest versions of these program components. The widget actively links to the latest PHP files and CSS classes:

[flash https://www.embeddedcomponents.com/wp-content/uploads/2007/05/how2installplugin.swf w=450 h=583]

(more…)

Technorati Tags: Ron Fredericks, Dean Lee, Code Highlighter, WordPress, plugin, component, Flow Chart, Swim Lanes, Flash, widget, PHP, CSS

Ron Fredericks writes: In my previous post, I discuss Dean Lee’s source code syntax highlighting plugin for WordPress. It delivers all the great features of the GeSHi open-source highlight project for Wordress bloggers.

Yet some source code displayed badly – turning a developer’s nice clean style into a chaotic and messy format. I demonstrated the display problem using a perl sendmail script I plan to discuss in a future blog post. The problem had to do with some kind of whitespace word wrap issue.

I tested various features of CSS and DIV tag attributes created by Dean’s plugin and the GeSHi php code. I am happy to say, I found a simple one-line solution. My solution is in updating Dean’s CSS container class to force white space not to wrap.

Here is my solution:
Add this property to Dean’s “ch_code_container” CSS class:

white-space: nowrap;

(more…)

Technorati Tags: Ron Fredericks, Dean Lee, source code, syntax highlighting, plugin, WordPress, GeSHi, open-source

Ron Fredericks writes: I have a problem in common with many software engineers and technical managers – “How can I display source code within my blog?”

See, the problem starts when the source code to be displayed interacts with the blogging software itself and then corrupts the blog’s own loop-and-display engine. Thus, the blog page becomes corrupt or at the very least, becomes mis-formatted and hard to read. Of course it would also be nice to color code a software snippet similar to a source code editor to make the posted source code easier to read.

I tried several techniques during my Internet search for “WordPress source code formatting”. I discovered a common theme – there are source code display and highlighting methods available – in fact too many are available. So the search became a “needle in the haystack” time sink. And the sad fact, most choices have some severe limitations.

But at last, I found Dean Lee’s blog post: Source Code syntax highlighting plugin for WordPress (V1.1)

Dan’s pluglin for WordPress has all the features I was looking for:

• installs as a simple plugin for WordPress
• usage within a blog post is easy through the use of the pre tag
• source code displays in its own container with line numbers for reference
• a reader should be able to easily select a range of displayed source code and copy it for their own use (without also selecting the displayed line numbers)
• source code display should not break my WordPress blogging software

(more…)