more info

thomasdavis · thomasdavis · commit 028c717432ae · 2012-10-03T11:01:52.000Z
diff --git a/css/theme.css b/css/theme.css
@@ -8,4 +8,9 @@
 .showseo-output {
    width: 100%; 
    height: 300px;
+}
+
+code {
+  margin-bottom: 10px;
+  display: inline-block;
 }
diff --git a/index.html b/index.html
@@ -2,10 +2,11 @@
 <html lang="en">
 <head>
 	<meta charset="utf-8">
-	<title>Seo Server</title>
+	<title>Seo Server - Enabled SEO for your Javascript applications</title>
 	<meta name="viewport" content="width=device-width,initial-scale=1">
-	<meta name="description" content="">
+	<meta name="description" content="Seo Server is a command line tool that runs a server that allows GoogleBot(any any other crawlers) to crawl your heavily Javascript built websites.">
 	<meta name="fragment" content="!">
+	<base href="/repos/seoserver-site/" />
 	<link rel="stylesheet" href="css/styles.css">
 	<script data-main="js/main" src="js/libs/require/require.js" type="text/javascript"></script>
 </head>
diff --git a/templates/home/page.html b/templates/home/page.html
@@ -1,8 +1,41 @@
 <div class="well">
-  Welcome
+  <h3>Welcome!</h3>
+  <p>Seo Server is a command line tool that runs a server that allows GoogleBot(any any other crawlers) to crawl your heavily Javascript built websites. The tool works with very little changes to your server or client side code.</p>
+  <p><i>This entire site is driven by Javascript(view the source). Click the `What does Google see?` button at the bottom of each page to see Seo Server in action.</i></p>
 
-<hr />
-  <button class="btn btn-info showseo">What does Google see?</button>
+  <h3>How it works</h3>
+  <img src="http://yuml.me/5b1b60bb" /><br /><br />
+  <p>Seo Server runs <a href="http://phantomjs.org/">PhantomJs</a>(headless webkit browser) which renders the page fully and returns the fully executed code to GoogleBot.</p>
+  
+  <h3>Getting started</h3>
+  <p>Seo Server is an NPM module so install via</p>
+  <code>sudo npm install -g seoserver</code>
+  <p>Now we have access to the Seo Server command line tool</p>
+  <code>seoserver start</code>
+  <p>Which starts an Express server on port 3000 or</p>
+  <code> seoserver -p 4000 start</code> 
+  <h3>Telling GoogleBot to fetch from Seo Server</h3>
+  <p>To tell GoogleBot that we are using ajaxed content we simply add to our sites index.html file the Google specific <a href="https://developers.google.com/webmasters/ajax-crawling/docs/specification">meta tag</a>. If you view the source of this page you can see we have included the tag below. </p>
+  <code>&lt;meta name="fragment" content="!"&gt;</code>
+  <p>Now whenever GoogleBot visits any of our pages it will try to load <code>?_escaped_fragment_=pathname</code></p>
+  <p>So if we were using Apache with mod rewrite and mod proxy, we can include in our .htaccess</p>
+  <code>
+    RewriteCond %{QUERY_STRING} ^_escaped_fragment_=(.*)$<br />
+    RewriteRule (.*) http://address-of-seoserver:3000/%1? [P]
+  </code>
+  <p>Now all request from GoogleBot will be returned fully rendered.</p>
+  <h3>For other crawlers</h3>
+  <p>
+    Using mod rewrite, we can send other crawlers to Seo Server also
+  </p>
+  <code>
+    RewriteCond %{HTTP_USER_AGENT} ^DuckDuckBot/1.0;<br />
+    RewriteRule (.*) http://address-of-seoserver:3000/%1? [P]
+
+  </code>
+  <hr />
+<button class="btn btn-info showseo">What does Google see?</button>
   <hr />
 <textarea class="showseo-output" disabled="disabled"></textarea>
-</div>
+</div>
+
diff --git a/templates/menu.html b/templates/menu.html
@@ -1,7 +1,7 @@
 <div class="well sidebar-nav">
   <ul class="nav nav-list">
-    <li class="active"><a href="#">Home</a></li>
-    <li><a href="#">Docs</a></li>
+    <li class="active"><a href="">Home</a></li>
+    <li><a href="docs">Docs</a></li>
     <li class="nav-header">Examples</li>
     <li><a href="#">HTML Templates</a></li>
     <li><a href="#">AJAX Data</a></li>
