<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>Design Gala &#187; PHP Image</title>
	<atom:link href="http://designgala.com/tag/php-image/feed/" rel="self" type="application/rss+xml" />
	<link>http://designgala.com</link>
	<description>Web Usability, Web Technology, User Experience</description>
	<lastBuildDate>Wed, 02 May 2012 03:55:38 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.3.2</generator>
		<item>
		<title>How to Add Text in an Image</title>
		<link>http://designgala.com/how-to-add-text-in-an-image/?utm_source=rss&#038;utm_medium=rss&#038;utm_campaign=how-to-add-text-in-an-image</link>
		<comments>http://designgala.com/how-to-add-text-in-an-image/#comments</comments>
		<pubDate>Thu, 15 Nov 2007 20:21:05 +0000</pubDate>
		<dc:creator>Design Gala</dc:creator>
				<category><![CDATA[PHP]]></category>
		<category><![CDATA[Adding Text to Image]]></category>
		<category><![CDATA[PHP Image]]></category>

		<guid isPermaLink="false">http://www.designgala.com/?p=6</guid>
		<description><![CDATA[Want to add text in images using PHP? This small script demonstrate how to add a custom text to an image loaded onto your page. ]]></description>
			<content:encoded><![CDATA[<p><!--adsense#for_article_1--><span class="firstletter"><span>T</span></span>his small script describes how to add a custom text to an image loaded onto your page. One of my client wanted to add a copyright notice in her images related to her site. So, I came up with this small PHP script for her.</p>
<h3><strong>Adding Text to an Image</strong></h3>
<p>Using the PHP GD function called <a href="http://www.php.net/manual/en/function.imagecreatefromjpeg.php" title="imagecreatefromjpeg">imagecreatefromjpeg</a>, <a href="http://www.php.net/manual/en/function.imagecreatefromgif.php" title="imagecreatefromgif">imagecreatefromgif</a> and <a href="http://www.php.net/manual/en/function.imagecreatefrompng.php" title="imagecreatefrompng">imagecreatefrompng</a>. We can add a custom text to an already existing image file.<br />
So you have imagecreatefromjpeg for jpeg file, imagecreatefrompng for png file and so on.</p>
<div class="wp_syntax">
<div class="code">
<pre class="php" style="font-family:monospace;"><span style="color: #339933;">&lt;</span> ?php
<span style="color: #990000;">header</span><span style="color: #009900;">&#40;</span><span style="color: #0000ff;">&quot;Content-type: image/png&quot;</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
<span style="color: #000088;">$string</span> <span style="color: #339933;">=</span> <span style="color: #0000ff;">&quot;copyright: some text&quot;</span><span style="color: #339933;">;</span>
<span style="color: #000088;">$font</span> <span style="color: #339933;">=</span> <span style="color: #cc66cc;">4</span><span style="color: #339933;">;</span>
<span style="color: #000088;">$width</span> <span style="color: #339933;">=</span> <span style="color: #990000;">imagefontwidth</span><span style="color: #009900;">&#40;</span><span style="color: #000088;">$font</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">*</span> <span style="color: #990000;">strlen</span><span style="color: #009900;">&#40;</span><span style="color: #000088;">$string</span><span style="color: #009900;">&#41;</span> <span style="color: #339933;">;</span>
<span style="color: #000088;">$height</span> <span style="color: #339933;">=</span> <span style="color: #990000;">imagefontheight</span><span style="color: #009900;">&#40;</span><span style="color: #000088;">$font</span><span style="color: #009900;">&#41;</span> <span style="color: #339933;">;</span></pre>
</div>
</div>
<p>This will setup the structure of the data being sent to the image file as well as what location to place the text at. In this case we want to place it on the bottom right of the page.</p>
<p>Now, we use imagecreatefrompng to create image from a file, set the text color, get the images dimensions, and figure on where to place the text.
</pre>
<div class="wp_syntax">
<div class="code">
<pre class="php" style="font-family:monospace;"><span style="color: #000088;">$im</span> <span style="color: #339933;">=</span> <span style="color: #990000;">imagecreatefrompng</span><span style="color: #009900;">&#40;</span><span style="color: #0000ff;">&quot;/path/to/yourimagefile&quot;</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
<span style="color: #000088;">$x</span> <span style="color: #339933;">=</span> <span style="color: #990000;">imagesx</span><span style="color: #009900;">&#40;</span><span style="color: #000088;">$im</span><span style="color: #009900;">&#41;</span> <span style="color: #339933;">-</span> <span style="color: #000088;">$width</span> <span style="color: #339933;">;</span>
<span style="color: #000088;">$y</span> <span style="color: #339933;">=</span> <span style="color: #990000;">imagesy</span><span style="color: #009900;">&#40;</span><span style="color: #000088;">$im</span><span style="color: #009900;">&#41;</span> <span style="color: #339933;">-</span> <span style="color: #000088;">$height</span><span style="color: #339933;">;</span>
&nbsp;
<span style="color: #000088;">$backgroundColor</span> <span style="color: #339933;">=</span> <span style="color: #990000;">imagecolorallocate</span> <span style="color: #009900;">&#40;</span><span style="color: #000088;">$im</span><span style="color: #339933;">,</span> <span style="color: #cc66cc;">255</span><span style="color: #339933;">,</span> <span style="color: #cc66cc;">255</span><span style="color: #339933;">,</span> <span style="color: #cc66cc;">255</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>   <span style="color: #666666; font-style: italic;">//white background</span>
<span style="color: #000088;">$textColor</span> <span style="color: #339933;">=</span> <span style="color: #990000;">imagecolorallocate</span> <span style="color: #009900;">&#40;</span><span style="color: #000088;">$im</span><span style="color: #339933;">,</span> <span style="color: #cc66cc;">0</span><span style="color: #339933;">,</span> <span style="color: #cc66cc;">0</span><span style="color: #339933;">,</span> <span style="color: #cc66cc;">0</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>   <span style="color: #666666; font-style: italic;">//black text</span>
<span style="color: #990000;">imagestring</span> <span style="color: #009900;">&#40;</span><span style="color: #000088;">$im</span><span style="color: #339933;">,</span> <span style="color: #000088;">$font</span><span style="color: #339933;">,</span> <span style="color: #000088;">$x</span><span style="color: #339933;">,</span> <span style="color: #000088;">$y</span><span style="color: #339933;">,</span>  <span style="color: #000088;">$string</span><span style="color: #339933;">,</span> <span style="color: #000088;">$textColor</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span></pre>
</div>
</div>
<p>Finally we produce the new image that will display custom text in an image.</p>
<div class="wp_syntax">
<div class="code">
<pre class="php" style="font-family:monospace;"><span style="color: #990000;">imagepng</span> <span style="color: #009900;">&#40;</span><span style="color: #000088;">$im</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
<span style="color: #000000; font-weight: bold;">?&gt;</span></pre>
</div>
</div>
<h3><strong>Here is the complete code:</strong></h3>
<div class="wp_syntax">
<div class="code">
<pre class="php" style="font-family:monospace;"><span style="color: #339933;">&lt;</span> ?php
<span style="color: #990000;">header</span> <span style="color: #009900;">&#40;</span><span style="color: #0000ff;">&quot;Content-type: image/png&quot;</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
<span style="color: #000088;">$string</span> <span style="color: #339933;">=</span> <span style="color: #0000ff;">&quot;your text&quot;</span><span style="color: #339933;">;</span>
<span style="color: #666666; font-style: italic;">// try changing this as well</span>
<span style="color: #000088;">$font</span> <span style="color: #339933;">=</span> <span style="color: #cc66cc;">4</span><span style="color: #339933;">;</span>
<span style="color: #000088;">$width</span> <span style="color: #339933;">=</span> <span style="color: #990000;">imagefontwidth</span><span style="color: #009900;">&#40;</span><span style="color: #000088;">$font</span><span style="color: #009900;">&#41;</span> <span style="color: #339933;">*</span> <span style="color: #990000;">strlen</span><span style="color: #009900;">&#40;</span><span style="color: #000088;">$string</span><span style="color: #009900;">&#41;</span> <span style="color: #339933;">;</span>
<span style="color: #000088;">$height</span> <span style="color: #339933;">=</span> <span style="color: #990000;">imagefontheight</span><span style="color: #009900;">&#40;</span><span style="color: #000088;">$font</span><span style="color: #009900;">&#41;</span> <span style="color: #339933;">;</span>
<span style="color: #000088;">$im</span> <span style="color: #339933;">=</span> <span style="color: #990000;">imagecreatefrompng</span><span style="color: #009900;">&#40;</span><span style="color: #0000ff;">&quot;/path/to/yourimagefile&quot;</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
<span style="color: #000088;">$x</span> <span style="color: #339933;">=</span> <span style="color: #990000;">imagesx</span><span style="color: #009900;">&#40;</span><span style="color: #000088;">$im</span><span style="color: #009900;">&#41;</span> <span style="color: #339933;">-</span> <span style="color: #000088;">$width</span> <span style="color: #339933;">;</span>
<span style="color: #000088;">$y</span> <span style="color: #339933;">=</span> <span style="color: #990000;">imagesy</span><span style="color: #009900;">&#40;</span><span style="color: #000088;">$im</span><span style="color: #009900;">&#41;</span> <span style="color: #339933;">-</span> <span style="color: #000088;">$height</span><span style="color: #339933;">;</span>
<span style="color: #000088;">$backgroundColor</span> <span style="color: #339933;">=</span> <span style="color: #990000;">imagecolorallocate</span> <span style="color: #009900;">&#40;</span><span style="color: #000088;">$im</span><span style="color: #339933;">,</span> <span style="color: #cc66cc;">255</span><span style="color: #339933;">,</span> <span style="color: #cc66cc;">255</span><span style="color: #339933;">,</span> <span style="color: #cc66cc;">255</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
<span style="color: #000088;">$textColor</span> <span style="color: #339933;">=</span> <span style="color: #990000;">imagecolorallocate</span> <span style="color: #009900;">&#40;</span><span style="color: #000088;">$im</span><span style="color: #339933;">,</span> <span style="color: #cc66cc;">0</span><span style="color: #339933;">,</span> <span style="color: #cc66cc;">0</span><span style="color: #339933;">,</span><span style="color: #cc66cc;">0</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
<span style="color: #990000;">imagestring</span> <span style="color: #009900;">&#40;</span><span style="color: #000088;">$im</span><span style="color: #339933;">,</span> <span style="color: #000088;">$font</span><span style="color: #339933;">,</span> <span style="color: #000088;">$x</span><span style="color: #339933;">,</span> <span style="color: #000088;">$y</span><span style="color: #339933;">,</span>  <span style="color: #000088;">$string</span><span style="color: #339933;">,</span> <span style="color: #000088;">$textColor</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
<span style="color: #990000;">imagepng</span><span style="color: #009900;">&#40;</span><span style="color: #000088;">$im</span><span style="color: #009900;">&#41;</span><span style="color: #339933;">;</span>
<span style="color: #000000; font-weight: bold;">?&gt;</span></pre>
</div>
</div>
<p>You may like to <a href="http://www.access-himalaya.com/picture-gallery.php?holiday_code=ACT" title="Demo">view demo</a>.
<div id="fb-root"></div>
<p><script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script><!-- Do not remove --></p>
]]></content:encoded>
			<wfw:commentRss>http://designgala.com/how-to-add-text-in-an-image/feed/</wfw:commentRss>
		<slash:comments>18</slash:comments>
		</item>
	</channel>
</rss>

