Use your left/right keys to browse tutorials
PHP GD generate an image with text and font embedding

PHP GD generate an image with text and font embedding

1 Star2 Stars3 Stars4 Stars5 Stars
Posted on January 18, 2013

PHP isn’t limited to just generating HTML. It can also be used to create and manipulate image files in a variety of formats. I recently worked on a project where we had to generate an image for the user and include their name flattened into it. It’s extremely easy to do with PHP. Admittedly the demo I’ve put together for this tutorial is rather extravagant! but it serves the purpose to explain how to use the PHP GD image library.

The Code


// link to the font file no the server
$fontname = 'font/Capriola-Regular.ttf';
// controls the spacing between text
$i=30;
//JPG image quality 0-100
$quality = 85;

function create_image($user){

		global $fontname;	
		global $quality;
		$file = "covers/".md5($user[0]['name'].$user[1]['name'].$user[2]['name']).".jpg";	
	
	// if the file already exists dont create it again just serve up the original	
	if (!file_exists($file)) {	
			
			// define the base image that we lay our text on
			$im = imagecreatefromjpeg("pass.jpg");
			
			// setup the text colours
			$color['grey'] = imagecolorallocate($im, 54, 56, 60);
			$color['green'] = imagecolorallocate($im, 55, 189, 102);
			
			// this defines the starting height for the text block
			$y = imagesy($im) - $height - 365;
			 
		// loop through the array and write the text	
		foreach ($user as $value){
			// center the text in our image - returns the x value
			$x = center_text($value['name'], $value['font-size']);	
			imagettftext($im, $value['font-size'], 0, $x, $y+$i, $color[$value['color']], $fontname,$value['name']);
			// add 32px to the line height for the next text block
			$i = $i+32;	
			
		}
			// create the image
			imagejpeg($im, $file, $quality);
			
	}
						
		return $file;	
}

function center_text($string, $font_size){

			global $fontname;

			$image_width = 800;
			$dimensions = imagettfbbox($font_size, 0, $fontname, $string);
			
			return ceil(($image_width - $dimensions[4]) / 2);				
}

	$user = array(
	
		array(
			'name'=> 'Ashley Ford', 
			'font-size'=>'27',
			'color'=>'grey'),
			
		array(
			'name'=> 'Technical Director',
			'font-size'=>'16',
			'color'=>'grey'),
			
		array(
			'name'=> 'ashley[at]papermashup.com',
			'font-size'=>'13',
			'color'=>'green'
			)			
	);

// run the script to create the image
$filename = create_image($user);

Running the code

I’ve created two functions to make it as simple as possible. to run the code simply pass the $user array data to the function and it’ll save the new image in the folder ‘covers’ on your server. The function returns the file url so you just need to echo it into an image tag as shown below. Check out the demo where you can create your own.


$filename = create_image($user);

<img src="<?=$filename;?>" width="800" height="600"/>

GD vs ImageMagick

On a performance level there’s not much between the two libraries ImageMagick has more options for example text rotation. you can find out more about ImageMagick here and GD here.

Demo Download



More tutorials from Papermashup
Comments
11 discussions around PHP GD generate an image with text and font embedding
Older Comments
  1. Gun says:

    Is it also possible for frontend user to change font, fontcolor and size. So yes how? Thanks!

Older Comments




Never miss an update from Papermashup

Get notified about the latest tutorials and downloads.

Subscribe by Email

Get alerts directly into your inbox after each post and stay updated.
Subscribe
OR

Subscribe by RSS

Add our RSS to your feedreader to get regular updates from us.
Subscribe

Get in contact

Please use the form below to get in contact. If your question is related to a free script download, please use the comments on the article page as community members are more likely to respond quicker than I can personally.

About Me

I'm Ashley Ford, Co-founder and Technical Director at Harkable.com London, UK. Previously I worked at InMobi, Spotify and MySpace. My interests include photography and making short videos I'm also an avid F1 fan. I'm always working on side projects. Here are a few: Easy Poll, We Deliver.



What do you specialise in?

I spend a lot of time coding in PHP and MySQL, as well as front end XHTML and CSS. I also specialise in javascript and the jQuery framework as well as being an avid designer. You can find me on dribbble

Interested in advertising?

If you'd like to advertise on Papermashup.com please get in touch via the contact link below for advertising opportunities.

How do I contact you

You can contact me here. and I'm available for consultation, freelance, programming book reviews.

Get on the mailing list

Join over 3000 people who have subscribed to the Papermashup inbox message, and be the first to find out about tutorial, competitions and giveaways.