This isn’t something you want to do in JavaScript. You should resize the images before you upload them to the server.
If you need to resize a whole load of images if you Google bulk resize images there are plenty of options.
It is a social media network site where alot of people upload images
Well, whatever script you use to upload the images should resize them at the time they are uploaded.
If you want to resize the images that are already uploaded, you’ll probably need to do this on the server. What server-side language are you using?
Php language
You can use Imagemagick through exec() or the Imagemagick API called Imagick.
I upload my photos into a temporary folder and then resize them automatically. The original uploaded photo is deleted.
You can also run Imagemagick on a folder of photos on the server and resize them all.
Make sure you validate the photos before working on them.
Ok but how can I using this Imagemagick
You can learn more about it here:
Ok thanks I will check it out
There are some more php specific examples on my website: https://rubblewebs.co.uk/
I have try to install imagemagic in my cpanel but it saying c complier not working why
see the image below
Sorry I don’t know; I just asked my hosts to install it.
Ok I have told my hoster and they said they will install it so after they have done that what will I do and how can I use it please let me know and enlighten me a little on it
Thanks
Some basic code from my website:
Resize on upload
<?php
// If the form has been submitted do this
if ( isset( $_POST['Submit'] ) ){
// Temporary upload image name
$original_image = $_FILES['filename']['tmp_name'];
// Get the image dimensions
$size=GetImageSize( $original_image );
// Name to save the image as - in this case the same as the original
$new_image = $_FILES['filename']['name'];
// Maximum image width
$max_width = '200';
// Maximum image height
$max_height = '90';
// Resize the image and save
exec("convert $original_image -thumbnail $max_widthx$max_height $new_image");
echo "File uploaded<br>";
echo "<img src=\"".$new_image."\">";
}
else { ?>
<p>File to upload:</p>
<form method="post" action="<?php echo $PHP_SELF; ?>" enctype="multipart/form-data">
<input type="file" name="filename" />
<input type="Submit" name="Submit" value="Submit" />
</form>
<?php } ?>
Resize a directory of images
// Setup the maximium width and height for the finished image
$max_width = '200';
$max_height = '90';
// Directory containing the images
$dir = 'photos';
// Select all jpg, png and gif images
foreach (glob($dir."{*.jpg,*.png,*.gif}",GLOB_BRACE ) as $filename) {
// Get the image size for use in the code
$size=GetImageSize( $filename );
$new_name = 'thumb_'.$filename;
$cmd = " $filename -thumbnail $max_widthx$max_height ";
exec("convert $cmd $new_name");
}
I would practice the code on a different directory to get it working before you working on your real images.
Also you should look into validating/sanitising the images on upload. I presume you are doing this already if you are allowing anyone to upload images already.
Ok thanks, but should I create a JavaScript file in the cpanel or it is a php file that I will create in my website directory
No JavaScript required. The resize on upload will work when the form is submitted and the folder resize will work when you call the php code. As you say a php page in a folder on your server somewhere.
I once had to resize thousands of photos into different sizes for somebody, form memory the output was over 30,000 and ran it in batches. Say any images starting with a-d first then e-h etc. I think it took 24hrs to convert them all.
Ok that means I have to create php file and copy this your code and paste it there and then save right
Yes and change the paths to your directories and output file sizes and new name/prefix or path.
As I say try it out on a test folder with a few images to see what happens.
I assume the hosts will install a V6 version of Imagemagick but if it is a V7 version you will need to change convert to magick.
EDIT: You can install and run Imagemagick on a localhost if you want to try it there instead.
Should I also add this code in the same file
// Setup the maximium width and height for the finished image
$max_width = ‘200’;
$max_height = ‘90’;
// Directory containing the images
$dir = ‘photos’;
// Select all jpg, png and gif images
foreach (glob($dir.“{.jpg,.png,*.gif}”,GLOB_BRACE ) as $filename) {
// Get the image size for use in the code
$size=GetImageSize( $filename );
$new_name = ‘thumb_’.$filename;
$cmd = " $filename -thumbnail $max_widthx$max_height ";
exec(“convert $cmd $new_name”);
}