Gitiles
Code Review Sign In
www.giggi.me / code-igniter-v3-giggi / b069789c78fdd1d33eff4b4f6c71a9883f1890a1 / . / user_guide / libraries / image_lib.html
blob: d32115a0c79c8f4528fe4d98bbdeeb7898df83cb [file] [log] [blame]
adminb0dd10f2006-08-25 17:25:49 +0000[diff] [blame]1<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
Derek Allardafd99ac2008-01-19 19:59:14 +0000[diff] [blame]2<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
adminb0dd10f2006-08-25 17:25:49 +0000[diff] [blame]3<head>
4
Derek Allard404e35d2007-08-07 01:00:45 +0000[diff] [blame]5<title>CodeIgniter User Guide : Image Manipulation Class</title>
adminb0dd10f2006-08-25 17:25:49 +0000[diff] [blame]6
7<style type='text/css' media='all'>@import url('../userguide.css');</style>
8<link rel='stylesheet' type='text/css' media='all' href='../userguide.css' />
9
admin17a890d2006-09-27 20:42:42 +0000[diff] [blame]10<script type="text/javascript" src="../nav/nav.js"></script>
admin2296fc32006-09-27 21:07:02 +0000[diff] [blame]11<script type="text/javascript" src="../nav/prototype.lite.js"></script>
admin17a890d2006-09-27 20:42:42 +0000[diff] [blame]12<script type="text/javascript" src="../nav/moo.fx.js"></script>
Derek Allardb3412372007-10-25 12:15:16 +0000[diff] [blame]13<script type="text/javascript" src="../nav/user_guide_menu.js"></script>
adminb0dd10f2006-08-25 17:25:49 +0000[diff] [blame]14
15<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
16<meta http-equiv='expires' content='-1' />
17<meta http-equiv= 'pragma' content='no-cache' />
18<meta name='robots' content='all' />
Derek Allard3d879d52008-01-18 19:41:32 +0000[diff] [blame]19<meta name='author' content='ExpressionEngine Dev Team' />
Derek Allardd2df9bc2007-04-15 17:41:17 +0000[diff] [blame]20<meta name='description' content='CodeIgniter User Guide' />
adminb0dd10f2006-08-25 17:25:49 +0000[diff] [blame]21
22</head>
23<body>
24
25<!-- START NAVIGATION -->
26<div id="nav"><div id="nav_inner"><script type="text/javascript">create_menu('../');</script></div></div>
27<div id="nav2"><a name="top"></a><a href="javascript:void(0);" onclick="myHeight.toggle();"><img src="../images/nav_toggle.jpg" width="153" height="44" border="0" title="Toggle Table of Contents" alt="Toggle Table of Contents" /></a></div>
28<div id="masthead">
29<table cellpadding="0" cellspacing="0" border="0" style="width:100%">
30<tr>
Derek Allard197d10b2008-02-12 04:20:38 +0000[diff] [blame]31<td><h1>CodeIgniter User Guide Version 1.6.1</h1></td>
adminc0d5d522006-10-30 19:40:35 +0000[diff] [blame]32<td id="breadcrumb_right"><a href="../toc.html">Table of Contents Page</a></td>
adminb0dd10f2006-08-25 17:25:49 +0000[diff] [blame]33</tr>
34</table>
35</div>
36<!-- END NAVIGATION -->
37
38
39<!-- START BREADCRUMB -->
40<table cellpadding="0" cellspacing="0" border="0" style="width:100%">
41<tr>
42<td id="breadcrumb">
Derek Jones7a9193a2008-01-21 18:39:20 +0000[diff] [blame]43<a href="http://codeigniter.com/">CodeIgniter Home</a> &nbsp;&#8250;&nbsp;
adminb0dd10f2006-08-25 17:25:49 +0000[diff] [blame]44<a href="../index.html">User Guide Home</a> &nbsp;&#8250;&nbsp;
45Image Manipulation Class
46</td>
Derek Allardbc030912007-06-24 18:25:29 +0000[diff] [blame]47<td id="searchbox"><form method="get" action="http://www.google.com/search"><input type="hidden" name="as_sitesearch" id="as_sitesearch" value="codeigniter.com/user_guide/" />Search User Guide&nbsp; <input type="text" class="input" style="width:200px;" name="q" id="q" size="31" maxlength="255" value="" />&nbsp;<input type="submit" class="submit" name="sa" value="Go" /></form></td>
adminb0dd10f2006-08-25 17:25:49 +0000[diff] [blame]48</tr>
49</table>
50<!-- END BREADCRUMB -->
51
52<br clear="all" />
53
54
55<!-- START CONTENT -->
56<div id="content">
57
58
59<h1>Image Manipulation Class</h1>
60
Derek Allardd2df9bc2007-04-15 17:41:17 +0000[diff] [blame]61<p>CodeIgniter's Image Manipulation class lets you perform the following actions:</p>
adminb0dd10f2006-08-25 17:25:49 +0000[diff] [blame]62
63<ul>
64<li>Image Resizing</li>
65<li>Thumbnail Creation</li>
66<li>Image Cropping</li>
67<li>Image Rotating</li>
68<li>Image Watermarking</li>
69</ul>
70
71<p>All three major image libraries are supported: GD/GD2, NetPBM, and ImageMagick</p>
72
admine334c472006-10-21 19:44:22 +0000[diff] [blame]73<p class="important"><strong>Note:</strong> Watermarking is only available using the GD/GD2 library.
adminb0dd10f2006-08-25 17:25:49 +0000[diff] [blame]74In addition, even though other libraries are supported, GD is required in
admine334c472006-10-21 19:44:22 +0000[diff] [blame]75order for the script to calculate the image properties. The image processing, however, will be performed with the
adminb0dd10f2006-08-25 17:25:49 +0000[diff] [blame]76library you specify.</p>
77
78
79<h2>Initializing the Class</h2>
80
Derek Allardd2df9bc2007-04-15 17:41:17 +0000[diff] [blame]81<p>Like most other classes in CodeIgniter, the image class is initialized in your controller
Derek Allard4a969bb2007-12-22 19:56:04 +0000[diff] [blame]82using the <dfn>$this->load-&gt;library</dfn> function:</p>
adminb0dd10f2006-08-25 17:25:49 +0000[diff] [blame]83<code>$this->load->library('image_lib');</code>
84
85<p>Once the library is loaded it will be ready for use. The image library object you will use to call all functions is: <dfn>$this->image_lib</dfn></p>
86
87
88<h2>Processing an Image</h2>
89
90<p>Regardless of the type of processing you would like to perform (resizing, cropping, rotation, or watermarking), the general process is
91identical. You will set some preferences corresponding to the action you intend to perform, then
92call one of four available processing functions. For example, to create an image thumbnail you'll do this:</p>
93
94<code>$config['image_library'] = 'GD';<br />
95$config['source_image'] = '/path/to/image/mypic.jpg';<br />
96$config['create_thumb'] = TRUE;<br />
97$config['maintain_ratio'] = TRUE;<br />
98$config['width'] = 75;<br />
99$config['height'] = 50;<br />
100<br />
admin1b90c272006-10-31 18:22:29 +0000[diff] [blame]101$this->load->library('image_lib', $config);
adminb0dd10f2006-08-25 17:25:49 +0000[diff] [blame]102<br />
103<br />
104$this->image_lib->resize();</code>
105
106<p>The above code tells the <dfn>image_resize</dfn> function to look for an image called <em>mypic.jpg</em>
107located in the <dfn>source_image</dfn> folder, then create a thumbnail that is 75 X 50 pixels using the GD2 <dfn>image_library</dfn>.
admine334c472006-10-21 19:44:22 +0000[diff] [blame]108Since the <dfn>maintain_ratio</dfn> option is enabled, the thumb will be as close to the target <dfn>width</dfn> and
adminb0dd10f2006-08-25 17:25:49 +0000[diff] [blame]109<dfn>height</dfn> as possible while preserving the original aspect ratio. The thumbnail will be called <em>mypic_thumb.jpg</em>
110</p>
111
112<p class="important"><strong>Note:</strong> In order for the image class to be allowed to do any processing, the
113folder containing the image files must have file permissions of 777.</p>
114
115
116<h2>Processing Functions</h2>
117
118<p>There are four available processing functions:</p>
119
120<ul>
121<li>$this->image_lib->resize()</li>
122<li>$this->image_lib->crop()</li>
123<li>$this->image_lib->rotate()</li>
124<li>$this->image_lib->watermark()</li>
Derek Allard44dbc782008-01-29 20:38:55 +0000[diff] [blame]125<li>$this-&gt;image_lib-&gt;clear()</li>
adminb0dd10f2006-08-25 17:25:49 +0000[diff] [blame]126</ul>
127
128<p>These functions return boolean TRUE upon success and FALSE for failure. If they fail you can retrieve the
129error message using this function:</p>
130
131<code>echo $this->image_lib->display_errors();</code>
132
133<p>A good practice is use the processing function conditionally, showing an error upon failure, like this:</p>
134
135<code>if ( ! $this->image_lib->resize())<br />
136{<br />
137&nbsp;&nbsp;&nbsp;&nbsp;echo $this->image_lib->display_errors();<br />
138}</code>
139
140<p>Note: You can optionally specify the HTML formatting to be applied to the errors, by submitting the opening/closing
141tags in the function, like this:</p>
142
143<code>$this->image_lib->display_errors('<var>&lt;p></var>', '<var>&lt;/p></var>');</code>
144
145
146<h2>Preferences</h2>
147
148<p>The 14 available preferences described below allow you to tailor the image processing to suit your needs.</p>
149
150<p>Note that not all preferences are available for every
151function. For example, the x/y axis preferences are only available for image cropping. Likewise, the width and height
152preferences have no effect on cropping. The "availability" column indicates which functions support a given preference.</p>
153
154<p>Availability Legend:</p>
155
156<ul>
157<li><var>R</var> - Image Resizing</li>
158<li><var>C</var> - Image Cropping</li>
159<li><var>X</var> - Image Rotation</li>
160<li><var>W</var> - Image Watermarking</li>
161
162</ul>
163
164
165
166
167
168<table cellpadding="0" cellspacing="1" border="0" style="width:100%" class="tableborder">
169<tr>
170<th>Preference</th>
171<th>Default&nbsp;Value</th>
172<th>Options</th>
173<th>Description</th>
174<th>Availability</th>
175</tr>
176
177<tr>
178<td class="td"><strong>image_library</strong></td>
179<td class="td">GD2</td>
180<td class="td">GD, GD2, ImageMagick, NetPBM</td>
181<td class="td">Sets the image library to be used.</td>
182<td class="td">R, C, X, W</td>
183</tr>
184
185<tr>
186<td class="td"><strong>library_path</strong></td>
187<td class="td">None</td>
188<td class="td">None</td>
189<td class="td">Sets the server path to your ImageMagick or NetPBM library. If you use either of those libraries you must supply the path.</td>
190<td class="td">R, C, X</td>
191</tr>
192
193<tr>
194<td class="td"><strong>source_image</strong></td>
195<td class="td">None</td>
196<td class="td">None</td>
197<td class="td">Sets the source image name/path. The path must be a relative or absolute server path, not a URL.</td>
198<td class="td">R, C, S, W</td>
199</tr>
200
201<tr>
202<td class="td"><strong>dynamic_output</strong></td>
203<td class="td">FALSE</td>
204<td class="td">TRUE/FALSE (boolean)</td>
205<td class="td">Determines whether the new image file should be written to disk or generated dynamically. Note: If you choose the dynamic setting, only one image can be shown at a time, and it can't be positioned on the page. It simply outputs the raw image dynamically to your browser, along with image headers.</td>
206<td class="td">R, C, X, W</td>
207</tr>
208
209
210<tr>
211<td class="td"><strong>quality</strong></td>
212<td class="td">90%</td>
213<td class="td">1 - 100%</td>
214<td class="td">Sets the quality of the image. The higher the quality the larger the file size.</td>
215<td class="td">R, C, X, W</td>
216</tr>
217
218
219<tr>
220<td class="td"><strong>new_image</strong></td>
221<td class="td">None</td>
222<td class="td">None</td>
223<td class="td">Sets the destination image name/path. You'll use this preference when creating an image copy. The path must be a relative or absolute server path, not a URL.</td>
Derek Jonesfecd4ed2008-01-29 19:04:13 +0000[diff] [blame]224<td class="td">R, C, X, W</td>
adminb0dd10f2006-08-25 17:25:49 +0000[diff] [blame]225</tr>
226
227<tr>
228<td class="td"><strong>width</strong></td>
229<td class="td">None</td>
230<td class="td">None</td>
231<td class="td">Sets the width you would like the image set to.</td>
Derek Allardf99f00a2007-07-12 00:06:01 +0000[diff] [blame]232<td class="td">R, C </td>
adminb0dd10f2006-08-25 17:25:49 +0000[diff] [blame]233</tr>
234
235<tr>
236<td class="td"><strong>height</strong></td>
237<td class="td">None</td>
238<td class="td">None</td>
239<td class="td">Sets the height you would like the image set to.</td>
Derek Allardf99f00a2007-07-12 00:06:01 +0000[diff] [blame]240<td class="td">R, C </td>
adminb0dd10f2006-08-25 17:25:49 +0000[diff] [blame]241</tr>
242
243<tr>
244<td class="td"><strong>create_thumb</strong></td>
245<td class="td">FALSE</td>
246<td class="td">TRUE/FALSE (boolean)</td>
247<td class="td">Tells the image processing function to create a thumb.</td>
248<td class="td">R</td>
249</tr>
250
251<tr>
252<td class="td"><strong>thumb_marker</strong></td>
253<td class="td">_thumb</td>
254<td class="td">None</td>
255<td class="td">Specifies the thumbnail indicator. It will be inserted just before the file extension, so mypic.jpg would become mypic_thumb.jpg</td>
256<td class="td">R</td>
257</tr>
258
259<tr>
260<td class="td"><strong>maintain_ratio</strong></td>
261<td class="td">TRUE</td>
262<td class="td">TRUE/FALSE (boolean)</td>
263<td class="td">Specifies whether to maintain the original aspect ratio when resizing or use hard values.</td>
264<td class="td">R</td>
265</tr>
266
267
268<tr>
269<td class="td"><strong>master_dim</strong></td>
270<td class="td">auto</td>
271<td class="td">auto, width, height</td>
272<td class="td">Specifies what to use as the master axis when resizing or creating thumbs. For example, let's say you want to resize an image to 100 X 75 pixels. If the source image size does not allow perfect resizing to those dimensions, this setting determines which axis should be used as the hard value. "auto" sets the axis automatically based on whether the image is taller then wider, or vice versa.</td>
273<td class="td">R</td>
274</tr>
275
276
277
278
279<tr>
280<td class="td"><strong>rotation_angle</strong></td>
281<td class="td">None</td>
282<td class="td">90, 180, 270, vrt, hor</td>
283<td class="td">Specifies the angle of rotation when rotating images. Note that PHP rotates counter-clockwise, so a 90 degree rotation to the right must be specified as 270.</td>
284<td class="td">X</td>
285</tr>
286
Derek Allardc6441282007-07-04 23:54:32 +0000[diff] [blame]287<tr>
adminb0dd10f2006-08-25 17:25:49 +0000[diff] [blame]288<td class="td"><strong>x_axis</strong></td>
289<td class="td">None</td>
290<td class="td">None</td>
291<td class="td">Sets the X coordinate in pixels for image cropping. For example, a setting of 30 will crop an image 30 pixels from the left.</td>
292<td class="td">C</td>
293</tr>
Derek Allardc6441282007-07-04 23:54:32 +0000[diff] [blame]294<tr>
adminb0dd10f2006-08-25 17:25:49 +0000[diff] [blame]295<td class="td"><strong>y_axis</strong></td>
296<td class="td">None</td>
297<td class="td">None</td>
298<td class="td">Sets the Y coordinate in pixels for image cropping. For example, a setting of 30 will crop an image 30 pixels from the top.</td>
299<td class="td">C</td>
300</tr>
301
302</table>
303
304
305<h2>Setting preferences in a config file</h2>
306
307<p>If you prefer not to set preferences using the above method, you can instead put them into a config file.
308Simply create a new file called the <var>image_lib.php</var>, add the <var>$config</var>
309array in that file. Then save the file in: <var>config/image_lib.php</var> and it will be used automatically. You
310will NOT need to use the <dfn>$this->image_lib->initialize</dfn> function if you save your preferences in a config file.</p>
311
312
313<h2>$this->image_lib->resize()</h2>
314
admine334c472006-10-21 19:44:22 +0000[diff] [blame]315<p>The image resizing function lets you resize the original image, create a copy (with or without resizing),
adminb0dd10f2006-08-25 17:25:49 +0000[diff] [blame]316or create a thumbnail image.</p>
317
318<p>For practical purposes there is no difference between creating a copy and creating
319a thumbnail except a thumb will have the thumbnail marker as part of the name (ie, mypic_thumb.jpg).</p>
320
321<p>All preferences listed in the table above are available for this function except these three: rotation, x_axis, and y_axis.</p>
322
323<h3>Creating a Thumbnail</h3>
324
325<p>The resizing function will create a thumbnail file (and preserve the original) if you set this preference so TRUE:</p>
326
327<code>$config['create_thumb'] = TRUE;</code>
328
329<p>This single preference determines whether a thumbnail is created or not.</p>
330
331<h3>Creating a Copy</h3>
332
333<p>The resizing function will create a copy of the image file (and preserve the original) if you set
334a path and/or a new filename using this preference:</p>
335
336<code>$config['new_image'] = '/path/to/new_image.jpg';</code>
337
338<p>Notes regarding this preference:</p>
339<ul>
340<li>If only the new image name is specified it will be placed in the same folder as the original</li>
341<li>If only the path is specified, the new image will be placed in the destination with the same name as the original.</li>
342<li>If both the path and image name are specified it will placed in its own destination and given the new name.</li>
343</ul>
344
345
346<h3>Resizing the Original Image</h3>
347
348<p>If neither of the two preferences listed above (create_thumb, and new_image) are used, the resizing function will instead
349target the original image for processing.</p>
350
351
352<h2>$this->image_lib->crop()</h2>
353
admine334c472006-10-21 19:44:22 +0000[diff] [blame]354<p>The cropping function works nearly identically to the resizing function except it requires that you set
adminb0dd10f2006-08-25 17:25:49 +0000[diff] [blame]355preferences for the X and Y axis (in pixels) specifying where to crop, like this:</p>
356
357<code>$config['x_axis'] = '100';<br />
Rick Ellis8ec66912007-06-13 22:07:35 +0000[diff] [blame]358$config['y_axis'] = '40';</code>
adminb0dd10f2006-08-25 17:25:49 +0000[diff] [blame]359
360<p>All preferences listed in the table above are available for this function except these: rotation, width, height, create_thumb, new_image.</p>
361
362<p>Here's an example showing how you might crop an image:</p>
363
364<code>$config['image_library'] = 'imagemagick';<br />
365$config['library_path'] = '/usr/X11R6/bin/';<br />
366$config['source_image'] = '/path/to/image/mypic.jpg';<br />
367$config['x_axis'] = '100';<br />
368$config['y_axis'] = '60';<br />
369<br />
370$this->image_lib->initialize($config);
371<br />
372<br />
373if ( ! $this->image_lib->crop())<br />
374{<br />
375&nbsp;&nbsp;&nbsp;&nbsp;echo $this->image_lib->display_errors();<br />
376}</code>
377
378
admine334c472006-10-21 19:44:22 +0000[diff] [blame]379<p>Note: Without a visual interface it is difficult to crop images, so this function is not very useful
380unless you intend to build such an interface. That's exactly what we did using for the photo
adminb0dd10f2006-08-25 17:25:49 +0000[diff] [blame]381gallery module in ExpressionEngine, the CMS we develop. We added a JavaScript UI that lets the cropping
382area be selected.</p>
383
384<h2>$this->image_lib->rotate()</h2>
385
386<p>The image rotation function requires that the angle of rotation be set via its preference:</p>
387
388<code>$config['rotation_angle'] = '90';</code>
389
390<p>There are 5 rotation options:</p>
391
392<ol>
393<li>90 - rotates counter-clockwise by 90 degrees.</li>
394<li>180 - rotates counter-clockwise by 180 degrees.</li>
395<li>270 - rotates counter-clockwise by 270 degrees.</li>
396<li>hor - flips the image horizontally.</li>
397<li>vrt - flips the image vertically.</li>
398</ol>
399
400<p>Here's an example showing how you might rotate an image:</p>
401
402<code>$config['image_library'] = 'netpbm';<br />
403$config['library_path'] = '/usr/bin/';<br />
404$config['source_image'] = '/path/to/image/mypic.jpg';<br />
405$config['rotation_angle'] = 'hor';<br />
406<br />
407$this->image_lib->initialize($config);
408<br />
409<br />
410if ( ! $this->image_lib->rotate())<br />
411{<br />
412&nbsp;&nbsp;&nbsp;&nbsp;echo $this->image_lib->display_errors();<br />
413}</code>
414
415
416
Derek Allard44dbc782008-01-29 20:38:55 +0000[diff] [blame]417<h2>$this-&gt;image_lib-&gt;clear()</h2>
418<p>The clear function resets all of the values used when processing an image. You will want to call this if you are processing images in a loop.</p>
419<p><code>$this-&gt;image_lib-&gt;clear();</code></p>
adminb0dd10f2006-08-25 17:25:49 +0000[diff] [blame]420<p>&nbsp;</p>
421<h1>Image Watermarking</h1>
422
423<p>The Watermarking feature requires the GD/GD2 library.</p>
424
425
426<h2>Two Types of Watermarking</h2>
427
428<p>There are two types of watermarking that you can use:</p>
429
430<ul>
431<li><strong>Text</strong>: The watermark message will be generating using text, either with a True Type font that you specify, or
admine334c472006-10-21 19:44:22 +0000[diff] [blame]432using the native text output that the GD library supports. If you use the True Type version your GD installation
adminb0dd10f2006-08-25 17:25:49 +0000[diff] [blame]433must be compiled with True Type support (most are, but not all).</li>
434
435<li><strong>Overlay</strong>: The watermark message will be generated by overlaying an image (usually a transparent PNG or GIF)
436containing your watermark over the source image.</li>
437
438</ul>
439
440
441<h2>Watermarking an Image</h2>
442
443<p>Just as with the other function (resizing, cropping, and rotating) the general process for watermarking
444involves setting the preferences corresponding to the action you intend to perform, then
445calling the watermark function. Here is an example:</p>
446
447<code>
448$config['source_image'] = '/path/to/image/mypic.jpg';<br />
449$config['wm_text'] = 'Copyright 2006 - John Doe';<br />
450$config['wm_type'] = 'text';<br />
451$config['wm_font_path'] = './system/fonts/texb.ttf';<br />
452$config['wm_font_size'] = '16';<br />
Derek Allarde8256b62007-07-08 17:05:09 +0000[diff] [blame]453$config['wm_font_color'] = 'ffffff';<br />
adminb0dd10f2006-08-25 17:25:49 +0000[diff] [blame]454$config['wm_vrt_alignment'] = 'bottom';<br />
455$config['wm_hor_alignment'] = 'center';<br />
456$config['wm_padding'] = '20';<br />
457<br />
458$this->image_lib->initialize($config);
459<br />
460<br />
461$this->image_lib->watermark();</code>
462
463
464<p>The above example will use a 16 pixel True Type font to create the text "Copyright 2006 - John Doe". The watermark
465will be positioned at the bottom/center of the image, 20 pixels from the bottom of the image.</p>
466
467<p class="important"><strong>Note:</strong> In order for the image class to be allowed to do any processing, the image file must have file permissions of 777.</p>
468
469
470<h2>Watermarking Preferences</h2>
471
472<p>This table shown the preferences that are available for both types of watermarking (text or overlay)</p>
473
474<table cellpadding="0" cellspacing="1" border="0" style="width:100%" class="tableborder">
475<tr>
476<th>Preference</th>
477<th>Default&nbsp;Value</th>
478<th>Options</th>
479<th>Description</th>
480</tr>
481
482<tr>
483<td class="td"><strong>wm_type</strong></td>
484<td class="td">text</td>
485<td class="td">type, overlay</td>
486<td class="td">Sets the type of watermarking that should be used.</td>
487</tr>
488
489<tr>
490<td class="td"><strong>source_image</strong></td>
491<td class="td">None</td>
492<td class="td">None</td>
493<td class="td">Sets the source image name/path. The path must be a relative or absolute server path, not a URL.</td>
494</tr>
495
496<tr>
497<td class="td"><strong>dynamic_output</strong></td>
498<td class="td">FALSE</td>
499<td class="td">TRUE/FALSE (boolean)</td>
500<td class="td">Determines whether the new image file should be written to disk or generated dynamically. Note: If you choose the dynamic setting, only one image can be shown at a time, and it can't be positioned on the page. It simply outputs the raw image dynamically to your browser, along with image headers.</td>
501</tr>
502
503<tr>
504<td class="td"><strong>quality</strong></td>
505<td class="td">90%</td>
506<td class="td">1 - 100%</td>
507<td class="td">Sets the quality of the image. The higher the quality the larger the file size.</td>
508</tr>
509
510<tr>
511<td class="td"><strong>padding</strong></td>
512<td class="td">None</td>
513<td class="td">A number</td>
514<td class="td">The amount of padding, set in pixels, that will be applied to the watermark to set it away from the edge of your images.</td>
515</tr>
516
517<tr>
518<td class="td"><strong>wm_vrt_alignment</strong></td>
519<td class="td">bottom</td>
520<td class="td">top, middle, bottom</td>
521<td class="td">Sets the vertical alignment for the watermark image.</td>
522</tr>
523
524<tr>
525<td class="td"><strong>wm_hor_alignment</strong></td>
526<td class="td">center</td>
527<td class="td">left, center, right</td>
528<td class="td">Sets the horizontal alignment for the watermark image.</td>
529</tr>
530
531<tr>
532<td class="td"><strong>wm_vrt_offset</strong></td>
533<td class="td">None</td>
534<td class="td">None</td>
535<td class="td">You may specify a horizontal offset (in pixels) to apply to the watermark position. The offset normally moves the watermark to the right, except if you have your alignment set to "right" then your offset value will move the watermark toward the left of the image.</td>
536</tr>
537
538<tr>
539<td class="td"><strong>wm_hor_offset</strong></td>
540<td class="td">None</td>
541<td class="td">None</td>
542<td class="td">You may specify a horizontal offset (in pixels) to apply to the watermark position. The offset normally moves the watermark down, except if you have your alignment set to "bottom" then your offset value will move the watermark toward the top of the image.</td>
543</tr>
544
545</table>
546
547
548
549<h3>Text Preferences</h3>
550<p>This table shown the preferences that are available for the text type of watermarking.</p>
551
552
553<table cellpadding="0" cellspacing="1" border="0" style="width:100%" class="tableborder">
554<tr>
555<th>Preference</th>
556<th>Default&nbsp;Value</th>
557<th>Options</th>
558<th>Description</th>
559</tr>
560
561<tr>
562<td class="td"><strong>wm_text</strong></td>
563<td class="td">None</td>
564<td class="td">None</td>
565<td class="td">The text you would like shown as the watermark. Typically this will be a copyright notice.</td>
566</tr>
567
568<tr>
569<td class="td"><strong>wm_font_path</strong></td>
570<td class="td">None</td>
571<td class="td">None</td>
Rick Ellis573b66a2007-08-04 02:09:01 +0000[diff] [blame]572<td class="td">The server path to the True Type Font you would like to use. If you do not use this option, the native GD font will be used.</td>
adminb0dd10f2006-08-25 17:25:49 +0000[diff] [blame]573</tr>
574
575<tr>
576<td class="td"><strong>wm_font_size</strong></td>
577<td class="td">16</td>
578<td class="td">None</td>
579<td class="td">The size of the text. Note: If you are not using the True Type option above, the number is set using a range of 1 - 5. Otherwise, you can use any valid pixel size for the font you're using.</td>
580</tr>
581
582<tr>
583<td class="td"><strong>wm_font_color</strong></td>
584<td class="td">ffffff</td>
585<td class="td">None</td>
586<td class="td">The font color, specified in hex. Note, you must use the full 6 character hex value (ie, 993300), rather than the three character abbreviated version (ie fff).</td>
587</tr>
588
589
590<tr>
591<td class="td"><strong>wm_shadow_color</strong></td>
592<td class="td">None</td>
593<td class="td">None</td>
594<td class="td">The color of the drop shadow, specified in hex. If you leave this blank a drop shadow will not be used. Note, you must use the full 6 character hex value (ie, 993300), rather than the three character abbreviated version (ie fff).</td>
595</tr>
596
597<tr>
598<td class="td"><strong>wm_shadow_distance</strong></td>
599<td class="td">3</td>
600<td class="td">None</td>
601<td class="td">The distance (in pixels) from the font that the drop shadow should appear.</td>
602</tr>
603
604</table>
605
606
607
608
609<h3>Overlay Preferences</h3>
610<p>This table shown the preferences that are available for the overlay type of watermarking.</p>
611
612
613<table cellpadding="0" cellspacing="1" border="0" style="width:100%" class="tableborder">
614<tr>
615<th>Preference</th>
616<th>Default&nbsp;Value</th>
617<th>Options</th>
618<th>Description</th>
619</tr>
620
621<tr>
622<td class="td"><strong>wm_overlay_path</strong></td>
623<td class="td">None</td>
624<td class="td">None</td>
625<td class="td">The server path to the image you wish to use as your watermark. Required only if you are using the overlay method.</td>
626</tr>
627
628<tr>
629<td class="td"><strong>wm_opacity</strong></td>
630<td class="td">50</td>
631<td class="td">1 - 100</td>
632<td class="td">Image opacity. You may specify the opacity (i.e. transparency) of your watermark image. This allows the watermark to be faint and not completely obscure the details from the original image behind it. A 50% opacity is typical.</td>
633</tr>
634
635<tr>
636<td class="td"><strong>wm_x_transp</strong></td>
637<td class="td">4</td>
638<td class="td">A number</td>
639<td class="td">If your watermark image is a PNG or GIF image, you may specify a color on the image to be "transparent". This setting (along with the next) will allow you to specify that color. This works by specifying the "X" and "Y" coordinate pixel (measured from the upper left) within the image that corresponds to a pixel representative of the color you want to be transparent.</td>
640</tr>
641
642<tr>
643<td class="td"><strong>wm_y_transp</strong></td>
644<td class="td">4</td>
645<td class="td">A number</td>
646<td class="td">Along with the previous setting, this allows you to specify the coordinate to a pixel representative of the color you want to be transparent.</td>
647</tr>
648</table>
649
adminb0dd10f2006-08-25 17:25:49 +0000[diff] [blame]650</div>
651<!-- END CONTENT -->
652
653
654<div id="footer">
655<p>
admin40037182006-10-11 19:16:58 +0000[diff] [blame]656Previous Topic:&nbsp;&nbsp;<a href="table.html">HTML Table Class</a>
adminb0dd10f2006-08-25 17:25:49 +0000[diff] [blame]657&nbsp;&nbsp;&nbsp;&middot;&nbsp;&nbsp;
658<a href="#top">Top of Page</a>&nbsp;&nbsp;&nbsp;&middot;&nbsp;&nbsp;
659<a href="../index.html">User Guide Home</a>&nbsp;&nbsp;&nbsp;&middot;&nbsp;&nbsp;
660Next Topic:&nbsp;&nbsp;<a href="input.html">Input Class</a>
Derek Allardc6441282007-07-04 23:54:32 +0000[diff] [blame]661</p>
Derek Jones7a9193a2008-01-21 18:39:20 +0000[diff] [blame]662<p><a href="http://codeigniter.com">CodeIgniter</a> &nbsp;&middot;&nbsp; Copyright &#169; 2007 &nbsp;&middot;&nbsp; <a href="http://ellislab.com/">Ellislab, Inc.</a></p>
adminb0dd10f2006-08-25 17:25:49 +0000[diff] [blame]663</div>
664
665</body>
666</html>