May
25
2009

Turn Text into an Image using the PHP GD Library

by   |  Posted in Tutorials  |  9 comments

While developing a site for a client, I needed to figure out a way to convert certain text elements into images. I had no clue how to do this but after doing a bit of research, I discovered a nifty library of functions already available through PHP. The GD library offers tons of cools way to dynamically create PNG, JPEG or GIF files and output them directly to your browser, but you need to make sure that your server has the library enabled.

You can check to see if the GD library available on your server by placing the code:

<?php phpinfo(); ?>

into a test.php file and uploading it to your site’s main directory. Open the file online and look to see if GD Support is Enabled. If it is, you are good to go.

The following code will dynamically create a PNG file from a text string.

<?php
header("Content-type: image/png");
 
$string = "This is my test string.";
 
$font  = 2;
$width  = imagefontwidth($font) * strlen($string);
$height = imagefontheight($font);
 
$image = imagecreatetruecolor ($width,$height);
$white = imagecolorallocate ($image,255,255,255);
$black = imagecolorallocate ($image,0,0,0);
imagefill($image,0,0,$white);
 
imagestring ($image,$font,0,0,$string,$black);
 
imagepng ($image);
imagedestroy($image);
?>

The above code must be included in its own file, it cannot be added to an existing PHP file with other functions. To access this image from another file just include it as the source in an image tag.

Test out turning text into an image by typing in something below.

About the author:

A freelance web developer living in Montreal who spends most of his time writing for this site and building Premium themes for WordPress. You can find him on Twitter @bavotasan.

Site5 Affiliate Link
If you liked this, please share it.

Tags: , , , , , , , , , , , , , ,

Short URL: http://bit.ly/bnJw5J

Discussion 9 Comments

  1. dreamer on June 24, 2009 at 10:05 am

    great! thank you. however; what about the utf 8? out of english characters?

  2. Debra on July 14, 2009 at 9:57 am

    I am having trouble creating the image for the advertisement at the top of the magazine basic. There is no browse and select jpg or anything. When I type text nothing shows up either. Do you just need to add the above text to a file and refer to it somehow. Please advise.

    Thanks

    • c.bavota on July 16, 2009 at 11:53 pm

      Your comment is on the wrong page. To add an ad, you need to place an image link and a link. You need to upload your image either through FTP or the WordPress uploader.

  3. Johnny on September 18, 2009 at 4:11 pm

    Hi
    Is there some nifty way you can make this dynamically update based on a text string in e.g. a forum?
    I would like it to be used to include a text in an avatar I use on a forum, so it would be superb if it could pull the text from the forum where I have my public profile.

  4. Jamesalex on November 6, 2010 at 2:22 am

    I have this client, hes “one of those clients” who makes a simple project into a huge nightmare. Finally i could find something to finish his request. jeez.

    • Tarot on December 10, 2010 at 9:54 am

      Same here hehehe,
      Thank God I found this site every post is so useful.

  5. Holly Bulnes on January 14, 2011 at 6:30 pm

    As always, great design list, loved these comment designs!

  6. Joao on March 3, 2011 at 9:30 am

    is it a way to make it work with portuguese characters like “ã”?

  7. Amitav Roy on March 17, 2011 at 12:11 am

    Hey man that’s something I was looking for quite some time now.
    Thanks
    Can you tell how we can specify a font in this?