diff --git a/less/app.less b/less/app.less
index ec3472d..f09e6b3 100644
--- a/less/app.less
+++ b/less/app.less
@@ -1,10 +1,11 @@
 @import "new-core";
 @import "core";
 @import "pad";
 @import "pad-theme";
 @import "post-temp";
 @import "effects";
 @import "admin";
 @import "pages/error";
+@import "pages/import";
 @import "lib/elements";
 @import "lib/material";
diff --git a/less/pages/import.less b/less/pages/import.less
new file mode 100644
index 0000000..52ab735
--- /dev/null
+++ b/less/pages/import.less
@@ -0,0 +1,18 @@
+form.import-form {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  &span.row {
+    justify-content: space-around;
+  }
+  
+  input[type=file] {
+    width: 100%;
+    align-self: center;
+  }
+  
+  input[type=submit] {
+    width: 100%;
+    margin-top: .5rem;
+  }
+}
\ No newline at end of file
diff --git a/static/js/import.js b/static/js/import.js
new file mode 100644
index 0000000..efe1959
--- /dev/null
+++ b/static/js/import.js
@@ -0,0 +1,49 @@
+
+const selectElem = document.querySelector('select[name="collection"]');
+const submitElem = document.querySelector('input[type="submit"]');
+const zipInfo = document.querySelector('span.zip > ul.info');
+const zipWarning = document.querySelector('span.zip > p.error');
+const fileInput = document.querySelector('input[type="file"]')
+
+document.onreadystatechange = () => {
+  if ( document.readyState === "complete") {
+    selectElem.disabled = true;  
+    submitElem.disabled = true;
+    zipInfo.hidden = true;
+    zipWarning.hidden = true;
+  }
+}
+
+fileInput.onchange = function() {
+  if ( this.files.length === 1 ) {
+    if ( this.files[0].type === 'application/zip' ) {
+      selectElem.disabled = true;
+      submitElem.disabled = false;
+      zipInfo.hidden = false;
+      zipWarning.hidden = true;
+    } else if ( this.files[0].type.match('text.*')) {
+      selectElem.disabled = false;
+      submitElem.disabled = false;
+      zipInfo.hidden = true;
+      zipWarning.hidden = true;
+    }
+  }
+  
+  if ( this.files.length > 1 ) {
+    selectElem.disabled = false;
+    submitElem.disabled = false;
+    var zips = 0;
+    Array.from(this.files).forEach(file => {
+        if ( file.name.endsWith(".zip") ) {
+          zips++;
+        }
+    })
+    if ( zips > 0 ) {
+      zipInfo.hidden = true;
+      zipWarning.hidden = false;
+    } else {
+      zipInfo.hidden = true;
+      zipWarning.hidden = true;
+    }
+  }
+}
\ No newline at end of file
diff --git a/templates/user/import.tmpl b/templates/user/import.tmpl
index 0c04f06..b0a4973 100644
--- a/templates/user/import.tmpl
+++ b/templates/user/import.tmpl
@@ -1,38 +1,50 @@
 {{define "import"}}
 {{template "header" .}}
 
 <div class="snug content-container">
 	{{if .Message}}
 	<div class="alert {{if .InfoMsg}}info{{else}}success{{end}}">
 		<p>{{.Message}}</p>
 	</div>
 	{{end}}
 	<h2 id="posts-header">Import</h2>
-	<p>Upload text or markdown files to import as posts.</p>
-	<div class="formContainer">
-		<form id="importPosts" class="import" enctype="multipart/form-data" action="/api/me/import" method="POST">
+	<p>This form allows you to import posts from files on your computer.</p>
+	<p>Any number text or markdown files are supported, as well as zip archives of posts.</p>
+	<div>
+		<form class="import-form" enctype="multipart/form-data" action="/api/me/import" method="POST">
 			<label for="file" hidden>Browse files to upload</label>
-			<input class="fileInput" name="files" type="file" multiple accept="text/markdown, text/plain, application/zip"/>
-			<br />
-			<label for="collection">Select a blog to import the posts under.</label>
-			<select name="collection">
-				{{range $i, $el := .Collections}}
-				<option value={{.Alias}}>
-					{{if .Title}}{{.Title}}{{else}}{{.Alias}}{{end}}
-				</option>
-				{{end}}
-				<option value="" selected>drafts</option>
-			</select>
-			<br />
+			<input name="files" type="file" multiple accept="text/*, application/zip"/>
+			<span class="row">
+				<label for="collection">Select a blog to import the posts under.</label>
+				<select name="collection">
+					{{range $i, $el := .Collections}}
+					<option value={{.Alias}}>
+						{{if .Title}}{{.Title}}{{else}}{{.Alias}}{{end}}
+					</option>
+					{{end}}
+					<option value="" selected>drafts</option>
+				</select>
+			</span>
+			<span class="row zip">
+				<p class="error">
+					WARNING: zip files must be uploaded separately, one at a time.
+				</p>
+				<ul class="info">
+					<li>Root level zip files are imported as drafts</li>
+					<li>ZIP sub-directories are imported as blog collections.<br/>
+					If no blog exists matching the sub-directory name, one will be created if possible.</li>
+				</ul>
+			</span>
 			<input type="submit" value="Import" />
 		</form>
 	</div>
 	{{if .Flashes}}
 	<ul class="errors">
 		{{range .Flashes}}<li class="urgent">{{.}}</li>{{end}}
 	</ul>
 	{{end}}
 </div>
 
 {{template "footer" .}}
+<script src="/js/import.js"></script>
 {{end}}