Multiple Image Uploader

Posted on January 12, 2013 by Jaydipsinh

Hello guys,

Today i need to develop Multiple Image Uploader for my project purpose, so first i searched on Google and i also got so many widgets, but all widget have heavy coding which is not easy to understand. so i thought let’s develop it with my own logic and i did it.!

multiimageuploader

I used JQuery and HTML and PHP for this small widget. don’t worry this is very simple and easy to understand. 🙂

so let’s Go For CodinG…..!

HTML-CODE

<html>
<head>
<title>Image Uploader</title>
<script src="jquery.js"> </script>
<script>
var i=0;
$("#add").live("click",function(){
i++;
document.getElementById("count").value=i;
$("#file").append("<input type='file' name='file"+i+"'><br>");
});
</script>
</head>
<body>
<div style="border:2px solid blue; width:550px;">
<form method="post" action="uploadarticle.php" enctype="multipart/form-data">
<input type="hidden" name="count" id="count">
<table border="0">
<tr>
<td> <b>Upload Image here </b></td>
</tr>
<tr>
<tr>
<td> <input type="file" name="file0"> </td><td> <img src="zoomin1.png" width="35" heigth="35" id="add"> </td>
<td> &nbsp;&nbsp;&nbsp;&nbsp;<input type="submit" value="upload"> </td>
</tr>
</table>
<div id="file"></div>
</form>
</div>
</body>
</html>

PHP-CODE

<?php
$count = $_POST["count"];
for($i=0;$i<=$count;$i++)
{
    if ($_FILES["file".$i]["error"] > 0)
    {
         echo "Error: " . $_FILES["file".$i]["error"] . "<br />";
    }
   else
   {
      move_uploaded_file($_FILES["file".$i]["tmp_name"],"upload/" .      $_FILES["file".$i]["name"] );
     echo "<script>alert('IMAGE uploaded successfully')</script>";
   }
}
?>

NOTE:

Create directory with name upload to run this widget.
and you must have jquery.js file inside your current directory.
put bellow image in your current directory. or you can also place your image if u don’t like mine .

Hope you like my widget.!!
🙂

Image upload validation using php

Posted on January 9, 2013 by Jaydipsinh

hello guys,

sometime it is necessary to check whether the uploaded file is valid Image file or not ? or sometime you need to allow user to upload only few image extension file. let’s say you want to allow user to upload only (gif, jpeg, jpg, png) extension file.

so let’s go for coding.

HTML Coding

<body>
<form method="post" action="uploadimage.php" enctype="multipart/form-data">
<table>
<tr>
<td> Upload Image here : </td>
<td> <input type="file" name="file"> </td>
</tr>
<tr>
<td> <input type="submit" value="upload"> </td>
</tr>
</table>
</form>
</body>

PHP Coding (uploadimage.php)

<?php
$allowedExts = array("jpg", "jpeg", "gif", "png");
$arr = explode(".", $_FILES["file"]["name"]);
$extension = end($arr);
if ((($_FILES["file"]["type"] == "image/gif")
|| ($_FILES["file"]["type"] == "image/jpeg")
|| ($_FILES["file"]["type"] == "image/png")
|| ($_FILES["file"]["type"] == "image/jpg"))
&& in_array($extension, $allowedExts))
{
   if ($_FILES["file"]["error"] > 0)
    {
        echo "Error: " . $_FILES["file"]["error"] . "<br />";
    }
    else
    {
      move_uploaded_file($_FILES["file"]["tmp_name"],"upload/" . $_FILES["file"]["name"] );
      echo "<script>alert('file uploaded successfully')</script>";
     }
 }
else
{
      echo "Invalid file";
}
?>

Please make sure that you have upload folder in your current directory.!

Hope you enjoy this small script!
🙂

Prevent your images from appearing in Google search results

Posted on January 8, 2013 by Jaydipsinh

Hello guys,

Sometime we need to prevent our images from appearing in Google result. Please follow given steps to prevent your images.

To prevent images from your site appearing in Google’s image index, add a robots.txt file to the root of the server that blocks the image.

For example, if you want Google to exclude the dkprofile.jpg image that appears on your site at http://www.ursite.com/images/dkprofile.jpg, add the following to your robots.txt file:

User-agent: Googlebot-Image
Disallow: /images/dkprofile.jpg

The next time Google crawls your website, see this directive and drop your image from our search results

To remove all the images on your site from our index, place the following robots.txt file in your server root:

User-agent: Googlebot-Image
Disallow: /

Hope You all like dis..!!

Add Google Translate Widget to your site.!

Posted on January 1, 2013 by Jaydipsinh

Google Translate widget allow user to convert webpage in their native language.

To add this widget to your site put bellow meta tag inside <head> …. </head> section. and place bellow <div id=”google_translate_element”> tag in body section wherever you want to display widget. this code also available on Google.

Testing file

<html>
<head>
<meta name=”google-translate-customization” content=”6e4db4d5f4d2558b-e0d1d81353eae122-g1ff482c45ccd2410-1e”></meta>
</head>
<body>
<div id=”google_translate_element”></div><script type=”text/javascript”>
function googleTranslateElementInit() {
new google.translate.TranslateElement({pageLanguage: ‘en’, layout: google.translate.TranslateElement.InlineLayout.SIMPLE, multilanguagePage: true}, ‘google_translate_element’);
}
</script><script type=”text/javascript” src=”//translate.google.com/translate_a/element.js?cb=googleTranslateElementInit”></script>
Copy and paste the following code snippets onto every page you want to translate
Place this meta tag before the closing
</body>
</html>

Email validation using php

Posted on January 1, 2013 by Jaydipsinh

<?php
//$email = “xy123@lolhseraha”; // Invalid email address
$email = “somebody@gmail.com”; // Valid email address
// Set up regular expression strings to evaluate the value of email variable against
$regex = ‘/^[_a-z0-9-]+(\.[_a-z0-9-]+)*@[a-z0-9-]+(\.[a-z0-9-]+)*(\.[a-z]{2,3})$/’;
// Run the preg_match() function on regex against the email address
if (preg_match($regex, $email))
{
echo $email . ” is a valid email.”;
}
else {
echo $email . ” is an invalid email.”;
}
?>

Web Developer Blog

This is blog about PHP,JSP, JQuery, Javascript and MySQL.

Monthly Archives: January 2013