User Guide

What Is CE Image?

CE Image is an ExpressionEngine® plugin. This means that it does not have a user interface, but is intended as a development tool to be used in your templates. It allows you, as the developer, to dynamically manipulate images on-the-fly from your templates.

What Does CE Image Do?

CE Image takes the parameters you provide to it, and manipulates the images in the way you ask it to. Let’s walk through a simple example:

Let’s say, for example, that in the control panel, you have a file field called “property_image’ where your client uploads photos of properties they are selling. They may upload a huge image that they took with their camera (depending on your server settings). You will probably want to use that image in various places on your site.

In one section of the site, you may have a listing page, where you want a little square thumbnail of the image. You can do something like this in your Channel Entries tag in your template:

Which would create the following image, cropped to a 100px square:

In another section of the site, perhaps on the property’s listing page, you want to show the image at a larger size. In your Channel Entries tag in your template, you do something like this, because you don’t want the image to ever be wider than 600px, no matter how large the origin image uploaded by your client is:

Which gives you an image that is resized to a width of 600px:

[The above photo is in the public domain]

So, in summary, the plugin allows you to manipulate your images on-the-fly in various places throughout your site. The above example is very simple, but it gives you an idea of how easy it is to use in your templates.

The arguments for the CE Image tag are referred to as parameters. Parameters allow you to do all kinds of cool things, like add rounded corners and reflections to your images, add filters like grayscale or sepia tone, save your images into different formats, and so much more. You can see the parameter documentation for more details on the options that are available to you when manipulating your images.

There are also a number of variables that are available to you, that allow you to control what is returned by CE Image, and where it is returned. Variables are particularly useful when using the output= parameter or the tag pair syntax.

Why CE Image?

Simply put, CE Image is the most robust and complete image manipulation solution for ExpressionEngine® (take a look at the feature comparison page for more details). It is easy to use and generally works out-of-the-box (without configuration). CE Image is also highly configurable and allows many of the default settings to be overridden when needed. You can take a look at the feature comparison chart to compare CE Image with some of the currently available options.