Smart Image Processor ASP 2 is DMXzone’s most powerful Image Resize, Enhancement and Manipulation extension that allows you to quickly and easily process multiple images, create thumbnails, use image options such as crop, flip, rotate, sharpen and blur, or create grayscale images. You can even brand your image by including a watermark or text.
Amazing Image Manipulation
Let the user upload all sorts of images and then resize, crop and improve image quality automatically on the server. The extension can process images uploaded by Pure Upload 2 and 3, stored in a Recordset or folder.
Add text to your images
Now you can print any text on your image, even watermark text! This extension allows you to set rich text options, set text overlays, color and alignment to brand your image any way you like to.
You can also add watermark image and set options such as opacity options, color keying and positioning. Be creative and use this option and the many other text options for multiple purposes. For example now you can brand your images with your site logo or captions.
Introduction
In this tutorial we're going to resize an image that is uploaded with Pure ASP Upload (2 or 3) while maintaining the aspect ratio.
Start: Original image
Resized Image (Width 200, Height 200, Checked Keep Aspect Ratio)
We also show what happens when you uncheck the aspect ratio:
Example: Resized Image (notice that the image is a bit squeezed)
After that we show you how to crop an image
The area inside the red square represents the cropped image, the total image above resembled the original image size.
We also show you how to combine the crop and resize options.
We'll explain the process in a step by step tutorial.
Resizing and cropping
- Create a new ASP page
Create a new or open an existing ASP file where the Pure ASP Upload Server behavior and the Resize Uploaded Files server behaviors need to be applied to..
- First apply the Pure ASP Upload behavior
Make sure you have a form with a File Upload Field and a Submit button.
1. From the Server Behaviors panel select DMXzone - Pure ASP Upload (2 or 3).
2. Browse to the folder where the images will need to be uploaded to.
3. If you choose the option Prefix With Full Path, you do not need to mention the folder when you are trying to display the thumbnail.
4. Leave Go To After Uploading empty, since we are not done after this.
5. Click CTRL-S (Command S for Mac users) to save the file.
Pure Upload 3 settings
- Go to the Smart Image Processor 2 behavior panel
You will find the Smart Image Processor 2 panel under Server Behaviors. Click on the + sign, DMXzone, Smart Image Processor 2.
This will Open the Smart Image Processor 2 Panel.
- Set the General Options
The name field is created by default to identify the Server Behavior, we don't change the name as we don't need to. The server component select box is set to Auto Detect by default, you should only change this if you want to use a specific component. Check the Absolute Path if the server does not support parent paths. We leave the setting on Auto Detect and set the Path to Relative.
- Define the Source Options
Select the Pure Upload option if you are uploading files with Pure Upload 2 or 3 that need to be resized. You can apply the resize action to all file fields field by choosing the *** All Files option. In our case there is only one upload field so we leave the dropdown at file. You can also choose a Recordset, Folder or Single file as a source to resize your images from. We'll get back to these options later.
- Setting the Action options - Resize
To resize an image, select the Resize option and enter the desired Width and Height of the resized image. Select the keep aspect ratio option to maintain the dimensions of the image when resizing.
- Set your Destination options, save and upload the files
Check select the Overwrite option if you only want to save the resized image or check the Create New option and enter the changes that need to be made to the path, filename or file extension.
The image can be saved as a jpeg, gif or png. To apply the Smart Image Processor 2 behavior click OK. You will need to save the file in your site. Press F12 tot test the result in your browser
- Setting the Action options - Crop
To crop an image, open the Smart Image Processor 2 server behavior again, select the crop option and enter the desired Width and Height of the cropped image. Select the Position option to determine the location to crop from.
- Set your Destination options, save and upload the files
Check select the Overwrite option if you only want to save the resized image or check the Create New option and enter the changes that need to be made to the path, filename or file extension.
##path## is the path of the original file, ##name## is the filename without the extension, you can add ##filename## for the complete filename.
Here are a few examples:
If your original file is "c:\images\dmxzone.jpg" and you want the filename and you to set the file to "c:\images\thumb_dmxzone.jpg" enter ##path##thumb_##filename## in the Create new field.
If you want to create a suffix like "c:\images\dmxzone_small.jpg" enter ##path####name##_small.jpg in the Create new field.
If you want to create a new folder "c:\images\thumbs\dmxzone.jpg" enter ##path##thumbs\##filename## in the Create new field.
The image can be saved as a jpeg, gif or png. To apply the Smart Image Processor 2 behavior click OK. You will need to save the file in your site. Press F12 tot test the result in your browser
- Setting the Action options - Combing the Resize and Crop options
You can also resize an image and the crop it. For instance if you have an image from 400 by 300 and you want to create a square image of 200 by 200 that isn't squeezed.
- Set your Destination options, save and upload the files
Check select the Overwrite option if you only want to save the resized image or check the Create New option and enter the changes that need to be made to the path, filename or file extension.
The image can be saved as a jpeg, gif or png. To apply the Smart Image Processor 2 behavior click OK. You will need to save the file in your site. Press F12 tot test the result in your browser
- Setting the Action options - Image Manipulation Options
Rotate, flip, sharpen or blur the image if you like too, the options speak for themselves. You can also create black and white images by checking the grayscale options.
- Set your Destination options, save and upload the files
Check select the Overwrite option if you only want to save the resized image or check the Create New option and enter the changes that need to be made to the path, filename or file extension.
The image can be saved as a jpeg, gif or png. To apply the Smart Image Processor 2 behavior click OK. You will need to save the file in your site. Press F12 tot test the result in your browser