Source code

<h1>Google Drive Folder iFrame Embedder</h1>
<h2>Instructions:</h2>
<ol>
<li>Find the folder in Google Drive you want to share</li>
<li>Rightmouseclick on folder name</li>
<li>Click on: Get shareable link</li>
<li>Click the link and copy the url</li>
<li>Paste url in first formfield</li>
<li>Choose your options and click on: Get Code</li>
<li>Click yellow code that appears and copy this</li>
</ol><br>
<form action="">
<table width="700" border="0" cellspacing="0" cellpadding="5" bgcolor="#FFFFFF" style="border: 1px solid black;"><tbody>
<tr><td bgcolor="silver" style="border-bottom-style: solid;border-bottom-width: 1px; border-bottom-color: black;"></td><td align="left" bgcolor="silver" style="border-bottom-style: solid;border-bottom-width: 1px; border-bottom-color: black;"><strong>Google Drive Folder iFrame Embedder</strong></td></tr>
<tr><td align="right" width="120">Folder URL:</td><td width="580"><input id="URL" size="50" type="text" title="Paste Folder URL" /></td></tr>
<tr><td align="right">Title:</td><td><input id="titel" size="50" type="text" placeholder="Optional" title="Optional, you can leave it empty" /></td></tr>
<tr><td align="right">Width:</td><td><select id="breedte" name="breedte"> <option value="500px">500 px</option> <option value="600px">600 px</option> <option value="700px">700 px</option> <option value="800px">800 px</option> <option selected="" value="100%">100 %</option> </select></td></tr>
<tr><td align="right">Height:</td><td><select id="hoogte" name="height"> <option value="100px">100 px</option> <option value="200px">200 px</option> <option value="300px">300 px</option> <option selected="" value="400px">400 px</option> <option value="500px">500 px</option> <option value="100%">100 %</option> </select></td></tr>
<tr><td align="right">Border:</td><td><select id="border" name="border"> <option value="1">Yes</option> <option selected="" value="0">No</option> </select></td></tr>
<tr><td align="right" valign="top">View:</td><td><select id="view" name="view"> <option selected="" value="list">List</option> <option value="grid">Grid</option> </select><br />
<br /></td></tr>
<tr><td align="right">&#10140;<br />
<br /></td><td><input onclick="genereer()" type="button" title="Get Code" value="Get Code" /><br />
<br /></td></tr>
<tr><td align="right" valign="top">iFrame Code:<br />
<br />
<br />
<br />
<br /></td><td valign="top"><span id="txtOutput" onclick="selectText('txtOutput')" style="background-color: yellow; font-family: 'courier' , monospace;" title="click to select text"></span></td></tr>
<tr><td align="right" bgcolor="#C0C0C0" style="border-top-style: solid;border-top-width: 1px; border-top-color: black;"><font size="-1">cc 2017</font></td><td align="left" bgcolor="#C0C0C0" style="border-top-style: solid;border-top-width: 1px; border-top-color: black;"><font size="-1">Offered by <a href="https://twitter.com/trendmatcher">@trendmatcher</a></font></td></tr>
</tbody></table>
</form>

<script type="text/javascript">
function genereer(){
var URL = document.getElementById("URL");
var titel = document.getElementById("titel");
var breedte = document.getElementById("breedte");
var hoogte = document.getElementById("hoogte");
var txtOutput = document.getElementById("txtOutput");
var name = URL.value;
var split ="";
split = name.split("=")
split = split[1]
var title = titel.value;
var width = breedte.value;
var height = hoogte.value;
var frameborder = border.value;
var gridlist = view.value;
txtOutput.value = "&lt;H2 style='color: red;'>" + title + "&lt;/H2>&lt;iframe width='" + width + "' height='" + height +"' frameborder='" + frameborder + "' scrolling='yes' src='https://drive.google.com/embeddedfolderview?id=" + split + "#" + gridlist + "'>loading... &lt;/iframe>";
txtOutput.innerHTML=txtOutput.value;
}
function selectText( containerid ) {
var node = document.getElementById( containerid );
if ( document.selection ) {
var range = document.body.createTextRange();
range.moveToElementText( node  );
range.select();
} else if ( window.getSelection ) {
var range = document.createRange();
range.selectNode( node );
window.getSelection().removeAllRanges();
window.getSelection().addRange( range );
}
}
</script>