Skip to content

Embed URL


Subversion checkout URL

You can clone with
Download ZIP
Embedding and customising a Google Form in WordPress example (with dynamic parallel session selection)
$formKey = "blahblahblah"; // ENTER YOUR OWN VALUE - you can find your formkey by going to your live form in the spreadsheet and copying the value from the url
$redirectUrl = ""; // ENTER YOUR OWN VALUE - the url you want to direct people to after they fill in the form
$dataUrl = ""; // ENTER YOUR OWN VALUE - for parallel sessions you need to publish the public sheet via the share settings. This url is not published in the live webpage source
// function to get external webpages/data
function getData($url){
$ch = curl_init();
curl_setopt($ch, CURLOPT_URL, $url);
curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1);
curl_setopt($ch, CURLOPT_FRESH_CONNECT, 1);
curl_setopt($ch, CURLOPT_REFERER, "eAssessment Scotland");
$res = curl_exec($ch);
return $res;
// function to convert csv to array
function importCSV($input,$head=false,$delim=",",$len=5000) {
$return = array();
$fiveMBs = 5 * 1024 * 1024;
$handle = fopen("php://temp/maxmemory:$fiveMBs", 'r+');
fputs($handle, $input);
if ($head) {
$header = fgetcsv($handle, $len, $delim);
while (($data = fgetcsv($handle, $len, $delim)) !== FALSE) {
$return[$data[0]]['title'] = $data[1];
$return[$data[0]]['left'] = $data[2];
return $return;
// get current booking numbers
$data = importCSV(getData($dataUrl),true);
// get current Google Form
$response = getData("".$formKey);
// extract the Google Form body
preg_match_all("~<body[^>]*>(.*?)</body>~si", $response, $page);
$new_page = $page[1][0];
// for parallel sessions read options into array
preg_match_all("~<option[^>]*>(.*?)</option>~si", $response, $options);
// cycle through all the parallel sessions and if a session is full mark it FULL and remove submit value
$count = 0;
foreach($data as $key => $value){
$old_option = $new_option = '<option value="'.$key.' '.$data[$key]['title'].'">'.$key." ".$data[$key]['title'].'</option>';
if ($data[$key]['left'] <= 0){
$new_option = '<option value="">FULL '.$data[$key]['title'].'</option>';
$new_page = str_replace($old_option,$new_option, $new_page);
// building the redirect after submit code
// build using info from
$formRedirect = '<script type="text/javascript">var submitted=false;</script>
<iframe name="hidden_iframe" id="hidden_iframe"
style="display:none;" onload="if(submitted)
<form action="';
// we replace the formAction with formRedirect
$formAction = '<form action="';
$new_page = str_replace($formAction, $formRedirect, $new_page);
// if you are not using wordpress you can replace this next bit with some html code for the <head>
/* Set up WordPress stuff */
define('WP_USE_THEMES', false);
?><script type="text/javascript" src=""></script>
<script type="text/javascript" src=""></script><style type='text/css'>
input,select,textarea,option{font-family:inherit;font-size:inherit}.ss-q-short,.ss-q-other{width:20em}.g-doc,.g-doc-1024,.g-doc-800{font-size:130%}.ss-base-body{font-size:.8em}.ss-textarea{max-width:99%}.ss-choice-item{margin:0;line-height:1.3em;padding-bottom:.5em}.ss-form-entry input{vertical-align:middle;margin-top:0}.g{color:#666}.i{display:inline}.ss-form-desc{font:inherit;width:99%;margin:0}.ss-q-title{display:block;font-weight:bold}.ss-q-help{display:block;color:#666;margin:.1em 0 .25em 0}.ss-q-long{max-width:90%}.ss-form-entry{zoom:1;}.ss-choices{list-style:none;margin:.5em 0 0 0;padding:0}.ss-powered-by{display:block;clear:left;color:#666;margin:1em 0.2em 0.2em}.ss-powered-by a:link,.ss-powered-by a:visited{color:#666}.ss-terms{display:block;clear:left;margin:1em 0.2em 0.2em}.ss-required-asterisk{color:#c43b1d}.ss-section-title{background-color:#eee;padding:0.4em;margin:2em -0.4em 0}.ss-section-description{margin-top:0.5em}.ss-no-ignore-whitespace{white-space:pre-wrap;white-space:-moz-pre-wrap;word-wrap:break-word}.ss-page-title{margin:0;padding:0}.ss-gridnumbers{text-align:center;border-bottom:1px solid #d3d8d3}.ss-gridnumber{display:block;padding:0.5em 0 .5em}.ss-gridrow{text-align:center;color:#666;border-bottom:1px solid #d3d8d3;padding:.5em .25em}.ss-grid-row-even{background-color:#fff}.ss-grid-row-odd{background-color:#f2f2f2}.ss-gridrow-leftlabel{padding:0 1em}.ss-grideditor-columns input{line-height:150%}.ss-grideditor-editor .ss-magiclist-ul{font-weight:bold;padding-right:1em}.ss-grid .errorbox-component .errorbox-good,.ss-grid .errorbox-component .errorbox-bad{display:none}.ss-scalenumbers{text-align:center}.ss-scalenumber{display:block;padding:0.5em 0 .5em}.ss-scalerow{text-align:center;color:#666;border:1px solid #d3d8d3;border-left:0;border-right:0;padding:.5em .25em}{text-align:right;padding-left:0}{text-align:left;padding-right:0}label{display:block;cursor:pointer}ul label{display:inline}hr{border:0;height:1px;background-color:#ddd}table{border-collapse:collapse}.ss-response-cell{background-color:#fff;border:1px solid #ccc;padding:.1em .5em}.ss-responses-header{background-color:#969696;color:#fff;padding:.2em .5em}.ss-old-form-response{background-color:#ffff3d;font-weight:bold}.errorbox-bad{border:2px solid #c43b1d;background-color:#ffe6cc;padding:2px}.errorheader{color:#c43b1d}.ss-no-ignore-whitespace{*white-space:pre}
<style type="text/css">
label.error {
float: none;
color: red;
padding-left: .5em;
vertical-align: top;
<script type="text/javascript">
// Using jQuery Validation plugin
// in the source of the live form you can identify the field names of required entries
// in this example entry.5.single is a required email address
// entry.6.single is checked to make sure it is a valid twitter username
// and entry.8.single is a parallel session validation eg if it is full you can't get in
jQuery.validator.addMethod("accept", function(value, element, param) {
if (value.length <= 0 || value.match(new RegExp("^" + param + "$")))
return true;
rules: {"entry.2.single": "required",
"entry.3.single": "required",
"entry.4.single": "required",
"entry.5.single": {
required: true,
email: true
"entry.6.single": { accept: "[a-zA-Z0-9_]+" },
"entry.8.single": {
required: true,
minlength: 1
messages: {
"entry.6.single": "Please enter without '@'",
"entry.8.single": "This session is full. Please select another",
<!-- some more wordpress markup - the format of this is dependant on your theme -->
<?php get_sidebar(); ?>
<div id="content" class="float-right two-column">
<div class="post">
// this is where we output the modified Google Form we contructed at the beginning of this script
<!-- some more wordpress markup - the format of this is dependant on your theme -->
<!--/content -->
<?php get_footer(); ?>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Something went wrong with that request. Please try again.