Upload And Resize Image Using Codeigniter-
Hello Friends Is Post Me Apko Btaunga Ki Kis Parkar Ham Codeigniter Framework Me Image Size Reduce Kar Sakte Hai .
Aap Niche Diye Gye Steps Ko Follow Kijiye-
Note-Sabse Pehle Aap apne Root Folder Ke Ander Uploads Name Ka Folder Create Kar Lijiye.
Note-Sabse Pehle Aap apne Root Folder Ke Ander Uploads Name Ka Folder Create Kar Lijiye.
ü Sabse Pehle Aap Ek upload.php Name Ki File Create Kar Lijiye Apne Codeigniter Ke Controller Folder Me.Ham Ye Be Keh Sakte Hai Ki Aap Upload Name Ka Ek Controller Bana Lijiye
And Us File Me Niche Diye Gye Code Ko Paste Kar Diiye
upload.php
<?php
class Upload extends CI_Controller {
function __construct()
{
parent::__construct();
$this->load->helper(array('form', 'url'));
$this->load->library('image_lib');
$this->load->model('Hello_Model');
}
function index()
{
$this->load->view('upload_form', array('error' => ' ' ));
}
function do_upload()
{
$config['upload_path'] = './uploads/';
$config['allowed_types'] = 'gif|jpg|png';
$config['max_size'] = '1000';
$config['max_width'] = '1024';
$config['max_height'] = '768';
$this->load->library('upload', $config);
if ( ! $this->upload->do_upload())
{
$error = array('error' => $this->upload->display_errors());
$this->load->view('upload_form', $error);
}
else
{
$data = array('upload_data' => $this->upload->data());
$this->resize($data['upload_data']['full_path'], $data['upload_data']['file_name']);
$this->load->view('upload_success', $data);
}
}
function resize($path,$file)
{
$config['image_library']='gd2';
$config['source_image']=$path;
$config['create_thumb']=TRUE;
$config['maintain_ratio']=TRUE;
$config['width']=150;
$config['height']=75;
$config['new_image']='./uploads/'.$file;
$this->image_lib->initialize($config);
$this->image_lib->resize();
}
}
?>
ü Ab Aap Ek upload_form.php Name Ki File Create Kijiye View Folder Ke Ander
ü Wanha Ye Code Paste Karke Save Kar Dijiye
upload_form.php
<center>
<html>
<head>
<title>Upload Form</title>
<style>
body{
background-repeat: no-repeat;
}
body {font-family: Arial, Helvetica, sans-serif;}
/* The Modal (background) */
.modal {
display: none; /* Hidden by default */
position: fixed; /* Stay in place */
z-index: 1; /* Sit on top */
padding-top: 100px; /* Location of the box */
left: 0;
top: 0;
width: 100%; /* Full width */
height: 100%; /* Full height */
overflow: auto; /* Enable scroll if needed */
background-color: rgb(0,0,0); /* Fallback color */
background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}
/* Modal Content */
.modal-content {
background-color: #fefefe;
margin: auto;
padding: 20px;
border: 1px solid #888;
width: 80%;
/*background-image:url("monu.png"); */
}
/* The Close Button */
.close {
color: #aaaaaa;
float: right;
font-size: 28px;
font-weight: bold;
}
.close:hover,
.close:focus {
color: #000;
text-decoration: none;
cursor: pointer;
}
</style>
</head>
<body>
<center>
<h2>Image Size Reduce In Php</h2>
<!-- Trigger/Open The Modal -->
<button id="myBtn">Reduce Image Size</button>
<center>
<!-- The Modal -->
<div id="mymodal1" class="modal">
<!-- Modal content -->
<div class="modal-content">
<span class="close">×</span>
<p>Some text in the Modal..</p>
<center>
<?php echo $error;?>
<?php echo form_open_multipart('upload/do_upload');?>
<input type="file" name="userfile" size="20" />
<br /><br />
<input type="submit" value="upload" />
</form>
</div>
</div>
<script>
// Get the modal
var modal = document.getElementById('mymodal1');
// Get the button that opens the modal
var btn = document.getElementById("myBtn");
// Get the <span> element that closes the modal
var span = document.getElementsByClassName("close")[0];
// When the user clicks the button, open the modal
btn.onclick = function() {
modal.style.display = "block";
}
// When the user clicks on <span> (x), close the modal
span.onclick = function() {
modal.style.display = "none";
}
// When the user clicks anywhere outside of the modal, close it
window.onclick = function(event) {
if (event.target == modal) {
modal.style.display = "none";
}
}
</script>
</body>
</html>
</center>
ü Ab Ek form_success .php Name ki Ek File View folder ke ander Create kar lijiye
form_success.php
<center>
<html>
<head>
<title>Upload Form</title>
<style>
body{
background-repeat: no-repeat;
}
body {font-family: Arial, Helvetica, sans-serif;}
/* The Modal (background) */
.modal {
display: none; /* Hidden by default */
position: fixed; /* Stay in place */
z-index: 1; /* Sit on top */
padding-top: 100px; /* Location of the box */
left: 0;
top: 0;
width: 100%; /* Full width */
height: 100%; /* Full height */
overflow: auto; /* Enable scroll if needed */
background-color: rgb(0,0,0); /* Fallback color */
background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}
/* Modal Content */
.modal-content {
background-color: #fefefe;
margin: auto;
padding: 20px;
border: 1px solid #888;
width: 80%;
/*background-image:url("monu.png"); */
}
/* The Close Button */
.close {
color: #aaaaaa;
float: right;
font-size: 28px;
font-weight: bold;
}
.close:hover,
.close:focus {
color: #000;
text-decoration: none;
cursor: pointer;
}
</style>
</head>
<body>
<center>
<h2>Image Size Reduce In Php</h2>
<!-- Trigger/Open The Modal -->
<button id="myBtn">Reduce Image Size</button>
<center>
<!-- The Modal -->
<div id="mymodal1" class="modal">
<!-- Modal content -->
<div class="modal-content">
<span class="close">×</span>
<p>Some text in the Modal..</p>
<center>
<?php echo $error;?>
<?php echo form_open_multipart('upload/do_upload');?>
<input type="file" name="userfile" size="20" />
<br /><br />
<input type="submit" value="upload" />
</form>
</div>
</div>
<script>
// Get the modal
var modal = document.getElementById('mymodal1');
// Get the button that opens the modal
var btn = document.getElementById("myBtn");
// Get the <span> element that closes the modal
var span = document.getElementsByClassName("close")[0];
// When the user clicks the button, open the modal
btn.onclick = function() {
modal.style.display = "block";
}
// When the user clicks on <span> (x), close the modal
span.onclick = function() {
modal.style.display = "none";
}
// When the user clicks anywhere outside of the modal, close it
window.onclick = function(event) {
if (event.target == modal) {
modal.style.display = "none";
}
}
</script>
</body>
</html>
</center>
http://localhost/yourprojectname /index.php/upload/index
Is Url Kobowser Me Enter Karke Aap Is Code Ko Run Karwake Apni Image Ka Size Reduce Karwa Sakte Ho.
Resize Image Without Stretching In Codeigniter-
Ab Aap Apne Is Script Ko Run Karwakar Dekh Sakte Ho Or Image Reduce Karwa Sakte Ho.Me Ummid Karta Hu Ki Apko Post Achi Lagi Hogi Agar Koi Problem A Rhe Hai To Comment Me Puch Sakte Hai Aap.
Thank You
sir your blog and all article are nice keep it up
ReplyDeleteGajabwap ek Acha Blog hai nice article
ReplyDeletethanks rahul
Delete