Codeigniter - Upload Image And Create Thumbnail Example

Feb 21, 2022 By Admin Category: Codeigniter   Codeigniter 4  
thumbnail.webp

Hi Guys,

In this tutorial, I will learn how to upload image and create thumbnail in codeigniter. upload image and create thumbnail images are most important part of the website. Codeigniter providing uploading file and resize file library. so let's uses of codeigniter.

Step 1: Create view file

you will create a index.php file in view directory and paste below code.

<!DOCTYPE html>
<html lang="en">
<head>
  <title>Upload image and create a thumbnail in codeigniter - RvSolutionStuff.com</title>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/css/bootstrap.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/js/bootstrap.min.js"></script> 
</head>
<body>
<div class="container">
  <div class="row">
	<div class="col-lg-12"> 
	  <form id="productImage" action="<?php echo site_url('upload');?>" name="productImage" method="post" enctype="multipart/form-data">
		<div class="form-group">
		  <label for="email">Choose Product Images:</label>
		  <input name="productImage" type="file"  /> 
		</div>
		<button type="submit" value="Submit" class="btn btn-default">Submit</button>
	  </form>
   </div>
 </div>
</div>
</body>
</html>
Step 2: Create Upload Directory

you will create a images folder for image upload on root project directory.

Step 3: Create controller

we will create a Upload.php controller file. when you choose upload image and click on submit button then that form will call upload controller's index method.

<?php
defined('BASEPATH') OR exit('No direct script access allowed');
class Upload extends CI_Controller {
	function __construct() {
		parent::__construct();
	}
	
	public function index()
	{
		$this->load->helper(array('form', 'url'));
		if($this->input->post('productImage'))
		{
			$file_name = time().'-'.$_FILES["image"]['name'];
			
			$config = array(
				'upload_path' => "./assets/images/",
				'allowed_types' => "gif|jpg|png|jpeg|JPEG|JPG|PNG|GIF",
				'overwrite' => TRUE,
				'max_size' => "26200",
				'max_width' => "650",
				'max_height' => "500",
				'file_name' => $new_name
			);
			$this->load->library('upload', $config);
	
			
			$data = $this->upload->data();
			
			// Create thumnail or resize image
			$config2 = array(
				'source_image'		=> $data['full_path'], //get original image
				'new_image'			=> $data['file_path'].'thumb', //save as new image //need to create thumbs first
				'maintain_ratio'	=> true,
				'width'				=> 150
			);
			$this->load->library('image_lib'); //load library
			$this->image_lib->initialize($config2);
			$this->image_lib->resize();
			$this->image_lib->clear();
			$this->load->view('index');
		}
		else
		{
			$this->load->view('index', $data);
		}
	}
}
?>

It will help you.....

We are Recommending you

Search

Popular Posts

Random Posts

Categories

Latest Posts

Copyright © 2023 www.RVSolutionStuff.com • All Rights Reserved