On Google+, one of the folks in my Web Developers circle, Bert Mahoney, shared a post showing some ASCII art in an HTML file’s header. Being old enough to remember when ASCII art was a high art indeed, I thought that was pretty cool.  So cool, that I thought I’d come up with a way to use ASCII art in a WordPress site.

I commented, “Hey….I like that. Gotta remember to include some ASCII art in my HTML source. You don’t happen to know of any PHP code that generates ASCII art, do you?” In reply, he came up with two links, including the Damn Simple PHP ASCII Art Generator.

I took that code and came up with two different ways to use it. The first is a shortcode. By putting this shortcode on this page:

[ascii_art file=http://www.danromanchik.com/images/kb6nu.jpg title='KB6NU in ASCII']

you get this ASCII art:

                                                                                                   
     ###         ###     ###########           '#########      ####          ###    ###'         ##
    '###      '###      |##0     |####        ###T     ###     #####        .##    ###:         T##
    |##0    |###        ###        ###      T##0             '|#####:       ###    ###          ###
    ###   ####          ###       T##:     0##.               ### ###       ###    ###          ##T
    ###'####           ###      '###       ###    #T          ##0  ###     ###    ###'         ### 
   ####### '           ###########        ### #########      ###   :###    ###  ' ###          ### 
   ###  ###          '|##0      ####      ####       ###     ###    ####  .##    ###:         T##  
  |##0   ####         ###        .###     ###        ###    |##      #### ###    ###          ###  
  ###     ####        ###        X###     ###        ###    ###       #######    ###         |##   
  ###      '###0     ###        ####      ###     '.###     ##0        #####     ###        0##T   
 ###         ####    ############T         ##########      ###          ####     .############     

Here’s the PHP for the shortcode:


//[ascii_art] WordPress shortcode
function ascii_art_func ( $atts ) {
extract( shortcode_atts( array(
'title' => '',
'file' => '',
), $atts ) );

for($y = 0; $y <= $height - $scale - 1; $y += $scale) {
for($x = 0; $x <= $width - ($scale / 2) - 1; $x += ($scale / 2)) {
$rgb = imagecolorat($img, $x, $y);
$r = (( $rgb >> 16 ) & 0xFF);
$g = (( $rgb >> 8 ) & 0xFF);
$b = ( $rgb & 0xFF );
$sat = ( $r + $g + $b ) / (255 * 3);
$content .= $chars[ (int)( $sat * ($c_count - 1) ) ];
}
$content .= PHP_EOL;
}
}
$content .= '</pre>';
return $content;
}
add_shortcode( 'ascii_art', 'ascii_art_func' );


Put that in your functions.php file of your theme, and you can use the shortcode on any page or post.

Next, I thought about coming up with a function to insert the ASCII art into the header. Here’s the code for that:

//add some ASCII art to the header of all pages
function add_ascii_art() {
$file = 'http://www.danromanchik.com/images/danr.jpg';
$img = imagecreatefromstring(file_get_contents($file));
list($width, $height) = getimagesize($file);
$scale = 6;
$chars = array(
' ', '\'', '.', ':',
'|', 'T', 'X', '0',
'#',
);
$chars = array_reverse($chars);
$c_count = count($chars);

echo ''.PHP_EOL;
}
add_action('wp_head', 'add_ascii_art');


This also goes into the functions.php file of your theme. (Sorry about the formatting. I don’t know why this code isn’t indented properly.)

There are, of course, some limitations of this code. First of all, you need to work with images and not text directly. I might play around with that a bit. Also, I’m thinking about making a plugin so that it’s more widely usable. I haven’t decided on that yet.

Let me know what you think.