WordPress has an amazing community of developers, constantly building additional functionality to ensure you can focus on content, not presentation. As a programmer, it can be easy to dismiss the value of these tools. “I’m a coder, I can do it myself”. But why recreate the wheel when others have already built it… and built it better.
1. AddQuicktag
The plugin is simple and effective. Its also really helpful when you start to add a lot of additional plugins and find it hard to remember the code you need to add. For example, when I want to wrap a snippet of C++ code, it can be hard to remember all the necessary keywords:
<pre class="prettyprint"><code class="lang-cpp">But with AddQuickTag, I can add the commonly used tag with a click of the button.
2. Prettify Code Syntax
Pretty Code Syntax is the plugin mentioned above that will automatically format your code correctly using the Google Code Prettify project as a base. Its a great little syntax highlighter (chromacoder) for your blog. It covers the most common languages and has a variety of available styles (including line numbers and dark themes).
Since the tags necessary to get it to work are a little cumbersome, the AddQuickTag is a nice add on tool. Combining the two, copying and pasting code from your favorite IDE into your blog post is just a "CTRL-C, CTRL-V, and a click of a button" away.
#include <math.h>
#include <iostream>
int main(int argc)
{
float gravitationalConstant = 6.67384E-11; //m3/kg*s2
gravitationalConstant *= 5.97219E24; //kgs to Earth Mass
gravitationalConstant /= pow(149.6E9,3); //meters to AUs
std::cout << "Gravitational Constant: " << gravitationalConstant << "AU^3 / Earth Mass * seconds^2 \n";
system ("PAUSE");
}The above code snippet was a demonstration to students on unit conversion.
For me, I've added shortcut buttons for C++, C#, and XML. These paired plugins allow me to focus on blogging about code instead of fussing with presentation.
3. Graceful Pull-Quotes
When writing about programming, its easy to end up with paragraph after paragraph of full text. The trouble is that those pages get pretty dull if they aren't broken up with images or something to keep the reader from getting bored. That's where Graceful Pull-Quotes comes in.
A pull-quote (http://en.wikipedia.org/wiki/Pull-quote) is a "quotation or excerpt from an article that is typically placed in a larger or distinctive typeface on the same page, serving to entice readers into an article or to highlight a key topic. The term is principally used in journalism and publishing."
Again, by combining this plugin with AddQuickTag, you can quickly break up your large chunks of text with your key concept, and it will be automatically aligned with where that phrase is used in your text.
4. Thickbox
This is great for screenshots. Just click the image to the right and note that it opens on top (rather than in a new window).
While its easy to add the class=thickbox to your HTML code, if you want to get this plugin to work automatically with any media you add from the "Add Media" button, you'll need to add a new function to your theme's functions.php script.
// ADD THICKBOX TO "ADD MEDIA" FUNCTIONALITY
function give_linked_images_class($html, $id, $caption, $title, $align, $url, $size, $alt = '' ){
$classes = 'thickbox'; // separated by spaces, e.g. 'img image-link'
// check if there are already classes assigned to the anchor
if ( preg_match('/<a.*? class=".*?">/', $html) ) {
$html = preg_replace('/(<a.*? class=".*?)(".*?>)/', '$1 ' . $classes . '$2', $html);
} else {
$html = preg_replace('/(<a.*?)>/', '$1 class="' . $classes . '" >', $html);
}
return $html;
}
add_filter('image_send_to_editor','give_linked_images_class',10,8);
// END EDIT 'ADD THICKBOX...'The above was adapted from answers to this thread.
5. YouTube SimpleGallery
Finally, one of my all-time favorite plugins is YouTube SimpleGallery. This plugin allows you to embed individual or collections of both YouTube and Vimeo videos. But when combined with Thickbox, it works even better.
This is great for demonstrating concepts and works really well on mobile devices.
[youtubegallery]
Particle Systems Demo|http://www.youtube.com/watch?v=h_8GpTncXAw
Traditional Perspective Demo|http://www.youtube.com/watch?v=wAm1SgoI3O4
[/youtubegallery]
Here is the code to create the above embedded video. The [youtubegallery] tag wraps the list of videos. Captions can be added, separated by a "|" (vertical bar).
[youtubegallery] Particle Systems Demo|http://www.youtube.com/watch?v=h_8GpTncXAw Traditional Perspective Demo|http://www.youtube.com/watch?v=wAm1SgoI3O4 [/youtubegallery]
The one issue I've found with copying and pasting code from YouTube, is that if you don't have an https enabled website, you'll need to remove the 's', ensuring your video links use "http", not "https".
Also, this is another great application of the "AddQuickTag" plugin.
Summary
Hopefully you'll find these as useful as I do. There are alternatives to all of these, but I've found these to be the best WordPress plug-ins for my needs. Best of all, they're all free.
