$1.99

Includes working source code with form, style sheet and recaptcha integration

Have you ever wanted to do the following?

• Embed a google form into your site without using iframes?


• Control the thank you page of your google form?

• Send out confirmation emails to the user who submitted the form or to people who should receive the google form data?


• Attach a file to your form?


• Setup a captcha script on your google form?

There are two ways to accomplish this:

1. Use the Google API - Go to Tutorial
2. Use a PHP curl function to submit to the form but you have to make your form public so you can access it anonymously from your curl script. - See Tutorial Below

Code Sample

Note: This is just a basic example without the CSS or captcha. For all my sample code please purchase the package above.

 

googlesandwich.php
//----------------------------------------------------
// Google Form Sandwich
// Created by Jaz Witham (Jazzerup)
// 2011
// THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND
// Script allows you to write custom php code
// before submitting a form to google
//----------------------------------------------------
//Google Form Key
$formkey = "dFdDTFBFRG1yZm9MckZUanFuM2dEd1E6MQ";
//Email address of person who should get email notification of form submission
$toemail = "
 This e-mail address is being protected from spambots. You need JavaScript enabled to view it.
 ";
$thankyou = "http://www.jazzerup.com/blogexamples/googleform/thankyou.html";
//Change this URL to your google form address
$googleformURL = "https://spreadsheets.google.com/formResponse?formkey=$formkey";
//-----------------Start send email script------------------------
//This is where you would put any custom scripting such as using php to send confirmation emails
$name = $_POST["entry_0_single"];  //Replace the periods in the field name with underscore.
$fromemail = $_POST["entry_1_single"];
$subject = $_POST["entry_2_single"];
$body = $_POST["entry_3_single"];
$header = "From: " . $fromemail . "\r\n";
$header .= "Reply-To: " . $fromemail . "\r\n";
if (!(mail($toemail,$subject,$body,$header))) {
   echo("
<p>Message delivery failed...</p>
 
");
   echo("from email: $fromemail to email: $toemail");
  }
//-----------------End send email script------------------------
 
//----------------Send Form Fields to Google--------------------
//Loops through the form fields and creates a query string to submit to google
foreach ($_POST as $var => $value) {
 
    if ($var != "ignore") {
    $postdata=$postdata . htmlentities(str_replace("_", "." , $var)) . "=" . $value . "&amp;";
    }
}
//remove the extra comma
$postdata=substr($postdata,0,-1);
//Submit the form fields to google
$ch = curl_init();
curl_setopt ($ch, CURLOPT_URL,$googleformURL);
curl_setopt ($ch, CURLOPT_SSL_VERIFYPEER, FALSE);
curl_setopt ($ch, CURLOPT_USERAGENT, "Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.8.1.6) Gecko/20070725 Firefox/2.0.0.6");
curl_setopt ($ch, CURLOPT_TIMEOUT, 60);
curl_setopt ($ch, CURLOPT_FOLLOWLOCATION, 1);
curl_setopt ($ch, CURLOPT_RETURNTRANSFER, 1);
curl_setopt ($ch, CURLOPT_POSTFIELDS, $postdata);
curl_setopt ($ch, CURLOPT_POST, 1);
$data = curl_exec ($ch);
curl_close($ch);
//echo $data;
//Redirect to your thank you page
header( "Location: $thankyou" ) ;
 

Now that you have a custom form page you can add a captcha to it if you want.
How to add captcha

$1.99

Includes working source code with images, style sheet and javascript.

One of my favorite free jquery slideshow scripts is Jquery Carousel Lite

The major problem I had with the script is everytime I wanted to add another picture to the slideshow, I had to modify the jquery code to include that image. I wrote a script that will do the following:

1) Automatically lists the image files inside a directory and load them into your jquery carousel.

2) Reads the picture metadata and adds it to the jquery carousel script

• Metadata: Title becomes the Image Alt Tag
• Metadata: Subject becomes the Image Link URL
• Metadata: Comments becomes the Caption

carouselexample.php
//----------------------------------------------------
// jQuery Carousel Enhancement
// Created by Jaz Witham (Jazzerup)
// 2011
// THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND
// Script reads the image files and 
// image metadata into the jQuery Carousel Script
//----------------------------------------------------
 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js" type="text/javascript"></script> 
<script src="js/jcarousellite_1.js" type="text/javascript"></script>
</head>
<body>
<!-- Carousel -->
<div id="carousel"> <a href="#" title="Previous" class="prev">Previous</a> <a href="#" title="Next" class="next">Next</a>
  <div style="visibility: visible; overflow: hidden; position: relative; z-index: 2; left: 0px; width: 864px;" class="content">
    <ul style="margin: 0pt; padding: 0pt; position: relative; list-style-type: none; z-index: 1; width: 2592px; left: -864px;">
 
<?php 
//Relative path to yout image directory
$dirpath = "../slideshow";
//Website URL to that same image directory
$dirURL = "http://www.jazzerup.com/blogexamples/slideshow/";
 
$folder = opendir($dirpath);
$pic_types = array("jpg", "jpeg");
$alttag = ""; 
$websiteurl= ""; 
$caption = ""; 
$index = array();
 
//Loop through the images in the directory
while ($file = readdir ($folder)) {
  if(in_array(substr(strtolower($file), strrpos($file,".") + 1),$pic_types))
      {                       
      $items[] = $file;            
    }
}
//each time it loads it shuffles the images
shuffle($items);
for($i=0; $i<sizeof($items); $i++) {
  $picpath = $dirpath . "/" . $items[$i];
  $exif = exif_read_data($picpath, 'EXIF');
  $alttag = $exif['Title']; //alt tag
  $websiteurl= $exif['Subject']; //website url
  $caption = $exif['Comments']; //caption
 
  $varimages = $varimages . "<li style='overflow: hidden; float: left; width: 216px; height: 136px;'>";
 
//Build the html code based on the metadata 
  $varimages =  $varimages . " <img src='$picpath' height='120' width='200' style='border:3px solid #FFF;' alt='$alttag' />" . "\n\n" ;
 
  $alttag = ""; 
  $websiteurl= ""; 
  $caption = "";
  $varimages =  $varimages . "</li>";
 }
closedir($folder);
 
echo $varimages;
?>
    </ul>
  </div>
</div>
<!-- [END] Carousel --> 
<script type="text/javascript">
    $(window).load(function() {
 
      $("#carousel .content").jCarouselLite({
          btnNext: ".next",
          btnPrev: ".prev",
          speed: 800,
          visible: 4
      });
 
 
    });
    </script>
</body>
 

$1.99

Includes working source code with images, style sheet and javascript.

One of my favorite free jQuery slideshow scripts is Nivo Slider

The major problem I had with the script is everytime I wanted to add another picture to the slideshow, I had to modify the jquery code to include that image. I wrote a script that will do the following:

1) Automatically lists the image files inside a directory and load them into your nivo slider.

2) Reads the picture metadata and adds it to the Nivo script

• Metadata: Title becomes the Nivo Image Alt Tag
• Metadata: Subject becomes the Nivo Image Link URL
• Metadata: Comments becomes the Nivo Caption
  

nivoexample.php
<!--
//----------------------------------------------------
// Nivo Slider Enhancement
// Created by Jaz Witham (Jazzerup)
// 2011
// THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND
// Script reads the image files and 
// image metadata into the nivo slider script
//----------------------------------------------------
-->
<body>
<div id="wrapper"> 
  <div class="slider-wrapper theme-default">
    <div class="ribbon"></div>
    <div id="slider" class="nivoSlider">
<?php 
//This php code will generate your list of images based on 
//image files in a folder
 
$dirpath = "slideshow";
$dirURL = "http://www.jazzerup.com/blogexamples/slideshow/";
$folder = opendir($dirpath); // Use 'opendir(".")' if the PHP file is in the same folder as your images. Or set a relative path 'opendir("../path/to/folder")'.
$pic_types = array("jpg", "jpeg", "gif", "png");
$alttag = ""; //caption
$websiteurl= ""; //alt tag
$caption = ""; //website url
 
$index = array();
while ($file = readdir ($folder)) {
  if(in_array(substr(strtolower($file), strrpos($file,".") + 1),$pic_types))
      {                       
      $items[] = $file;                                  
      }
}
for($i=0; $i<sizeof($items); $i++) {                  
  $picpath = $dirpath . "/" . $items[$i];
 
  //Get the meta data
  $exif = exif_read_data($picpath, 'EXIF');
  $alttag = $exif['Title']; //alt tag
  $websiteurl= $exif['Subject']; //website url
  $caption = $exif['Comments']; //caption
  if ($caption != "") {
    $caption =  "title='" . $caption  . "'";
    $alt = "alt='" . $caption  . "'";
  }
  if ($alttag != "") {
    $alt =  "alt='" . $alttag . "'";
  }
  if ($websiteurl != "") {
    $varimages =  $varimages . " <a href='$websiteurl'><img src='$picpath' $alt $caption /></a>" . "\n\n" ;
  } else {
  $varimages =  $varimages . " <img src='$picpath' $alt $caption />" . "\n\n" ;
      }
  $alttag = ""; //caption
  $websiteurl= ""; //alt tag
  $caption = ""; //website url
}
closedir($folder);
$varimages = substr_replace($varimages ,"",-1);
echo $varimages;
?>
    </div>
  </div>
</div>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript" src="js/jquery.nivo.slider.pack.js"></script> 
<script type="text/javascript">
    $(window).load(function() {
        $('#slider').nivoSlider();
    });
    </script>
</body>
 
 
 

Updating Metadata in a file is very easy. On windows:

1. Right click on the file
2. Select Properties
3. Select the "Details" tab
4. Update Title, Subject and Comments and press "Okay"