Write Multiple Lines Of Text On Image With PHP GD

Welcome to a quick tutorial on how to write multiple lines of text with PHP GD. So you have probably messed with GD to write some text, only to realize there is no way to “automatically break into multiple lines”.

Yes, it’s a real pain. So here’s a quick example of how I “automated” the line breaks – Read on!

TABLE OF CONTENTS

Download & Notes

PHP GD Multiple Lines

Extras

The End

EXAMPLE CODE DOWNLOAD

Click here to download

The example code is released under the MIT license, so feel free to build on top of it or use it in your own project.

SORRY FOR THE ADS...

But someone has to pay the bills, and sponsors are paying for it. I insist on not turning Code Boxx into a "paid scripts" business, and I don't "block people with Adblock". Every little bit of support helps.

Buy Me A Coffee Code Boxx eBooks

TUTORIAL VIDEO

PART 1) IMAGE & TEXT SETTINGS

// (A) LOAD IMAGE
$img = imagecreatefrompng("demo.png");
 
// (B) TEXT SETTINGS
$txtSize = 28;
$txtAngle = 0;
$txtX = 30;
$txtY = 280;
$txtColor = imagecolorallocate($img, 0, 0, 0);
$txtFont = "C:/Windows/Fonts/impact.ttf";
$txt = "TAKE A BREAK. DRINK A BUBBLE TEA!";

We begin by loading the source image and defining a whole bunch of settings. Let’s run through these quickly:

• $txtSize Font size.
• $txtAngle Leave this as 0, unless you want slanted text.
• $txtX $txtY Where to write the text on the image.
• $txtColor Font color.
• $txtFont Font to use, remember to change this to your own.
• $txt Text to write.

PART 2) BREAK TEXT INTO LINES

// (C) SPLIT TEXT INTO LINES
$maxChar = 13;
$lines = [];
$temp = "";
foreach (explode(" ", $txt) as $word) {
  if ($temp=="") { $temp .= $word; }
  else if (strlen("$temp $word") <= $maxChar) { $temp = "$temp $word"; }
  else { $lines[] = $temp; $temp = $word; }
}
$lines[] = $temp;

This little section can be a little confusing, so here’s a quick trace:

• The idea is to break $txt into many lines, into the array $lines.
• $maxChar is the allowed number of characters per line.
• for (explode(" ", $txt) as $word) will loop through word by word.
  • if (strlen("$temp $word") <= $maxChar) { $temp = "$temp $word" } We “collect” each word into $temp.
  • When $temp is over $maxChar, we “push” it into the array and start the next line  – $lines[] = $temp; $temp = $word.

P.S. In this example, $txt will break down into $lines = ["TAKE A BREAK.", "DRINK A", "BUBBLE TEA!"]

PART 3) DRAW LINES ONTO IMAGE

// (D) DRAW LINES ONTO IMAGE
$offsetY = 10;
foreach ($lines as $i=>$line) {
  $y = $txtY + ($i * $txtSize) + ($i==0 ? 0 : $i * $offsetY);
  imagettftext ($img, $txtSize, $txtAngle, $txtX, $y, $txtColor, $txtFont, $line);
}

Now that we have broken $txt into $lines, we do the very obvious thing – Loop through $lines and draw it line-by-line.

• We use the “usual” imagettftext() function to write text onto the image.
• But take note of how we shift the Y position for each new line – Y POSITION = ORIGINAL Y POSITION + (LINE X FONT SIZE) + (LINE X OFFSET).
• The OFFSET is optional, but the text will be very compact if you leave it out.

PART 4) SAVE PROCESSED IMAGE

// (E) SAVE COMPLETE IMAGE
imagepng($img, "written.png");
echo "OK";

Lastly, just save the processed image. The end. Thankfully.

INFOGRAPHIC CHEAT SHEET

LINKS & REFERENCES

• GD – Official PHP Manual
• PHP Add Text To Image – Code Boxx