diff --git a/erpnext/website/templates/blog-old.html b/erpnext/website/templates/blog-old.html
new file mode 100644
index 0000000..d0b9a13
--- /dev/null
+++ b/erpnext/website/templates/blog-old.html
@@ -0,0 +1,58 @@
+{% extends "outer.html" %}
+
+{% block title %}{{ title }}{% endblock %}
+
+
+{% block content %}
+<div class="layout-wrapper layout-wrapper-background">
+	<div class="web-content" id="content-blog">
+		<div class="layout-main-section">
+			<h1>Blog</h1>
+			<br>
+			<div id="blog-list">
+				<!-- blog list will be generated dynamically -->
+			</div>
+		</div>
+		<div class="layout-side-section">
+			<!-- for later
+			<h4>Get Updates</h4>
+			<p>
+			<input name="blog-subscribe">
+			<button class="btn" id="blog-subscribe">Subscribe</button>
+			</p>-->
+			<h4>Subscribe</h4>
+			<p>
+			<img src="images/feed.png" style="margin-right: 4px; margin-bottom: -4px">
+			<a href="rss.xml" target="_blank">RSS Feed</a>
+			</p>
+		</div>
+		<div style="clear: both"></div>
+	</div>
+</div>
+
+<script>
+
+// if not a specific blog, show listing
+erpnext.blog_list = new wn.ui.Listing({
+	parent: $(wrapper).find('#blog-list').get(0),
+	query: 'select tabBlog.name, title, left(content, 1000) as content, tabBlog.creation, \
+		ifnull(first_name, "") as first_name, ifnull(last_name, "") as last_name \
+		from tabProfile, tabBlog\
+	 	where ifnull(published,0)=1 and tabBlog.owner = tabProfile.name \
+		order by tabBlog.creation desc',
+	hide_refresh: true,
+	no_toolbar: true,
+	render_row: function(parent, data) {
+		if(data.content && data.content.length==1000) data.content += '... (read on)';
+		data.content = wn.markdown(data.content);
+		if(data.last_name) data.last_name = ' ' + data.last_name;
+		data.date = prettyDate(data.creation);
+		parent.innerHTML = repl('<h2>%(title)s</h2>\
+			<p><div class="help">By %(first_name)s%(last_name)s, %(date)s</div></p>\
+			<p>%(content)s</p>\
+			<a href="%(name)s.html">Read Full Text</a><br>', data);
+	},
+	page_length: 10
+});
+erpnext.blog_list.run();
+</script>
\ No newline at end of file
diff --git a/erpnext/website/templates/blog.html b/erpnext/website/templates/blog.html
index d0b9a13..e188edf 100644
--- a/erpnext/website/templates/blog.html
+++ b/erpnext/website/templates/blog.html
@@ -1,58 +1,31 @@
-{% extends "outer.html" %}
-
-{% block title %}{{ title }}{% endblock %}
-
+{% extends "blog.js" %}
 
 {% block content %}
-<div class="layout-wrapper layout-wrapper-background">
-	<div class="web-content" id="content-blog">
-		<div class="layout-main-section">
-			<h1>Blog</h1>
-			<br>
-			<div id="blog-list">
-				<!-- blog list will be generated dynamically -->
+	<div class="layout-wrapper layout-wrapper-background">
+		<div class="web-content" id="blog-{{ name }}">
+
+			<div class="layout-main-section">
+				<h2>{{ title }}</h2>
+				<div class="help">By {{ full_name }} on {{ updated }}</div>
+				<br>
+				{{ content_html }}
+				<hr><h3>Comments</h3>
+				<br>
+				<div class="blog-comments"></div>
 			</div>
+
+			<div class="layout-side-section">
+				<p><a href="blog.html">All Blogs</a></p>
+				<h4>Recent Posts</h4>
+				<div class="recent-posts" style="min-height: 100px;"></div>
+				<h4>Subscribe</h4>
+				<p>
+					<img src="images/feed.png" style="margin-right: 4px; margin-bottom: -4px">
+					<a href="rss.xml" target="_blank">RSS Feed</a>
+				</p>
+			</div>
+
+			<div style="clear: both"></div>
 		</div>
-		<div class="layout-side-section">
-			<!-- for later
-			<h4>Get Updates</h4>
-			<p>
-			<input name="blog-subscribe">
-			<button class="btn" id="blog-subscribe">Subscribe</button>
-			</p>-->
-			<h4>Subscribe</h4>
-			<p>
-			<img src="images/feed.png" style="margin-right: 4px; margin-bottom: -4px">
-			<a href="rss.xml" target="_blank">RSS Feed</a>
-			</p>
-		</div>
-		<div style="clear: both"></div>
 	</div>
-</div>
-
-<script>
-
-// if not a specific blog, show listing
-erpnext.blog_list = new wn.ui.Listing({
-	parent: $(wrapper).find('#blog-list').get(0),
-	query: 'select tabBlog.name, title, left(content, 1000) as content, tabBlog.creation, \
-		ifnull(first_name, "") as first_name, ifnull(last_name, "") as last_name \
-		from tabProfile, tabBlog\
-	 	where ifnull(published,0)=1 and tabBlog.owner = tabProfile.name \
-		order by tabBlog.creation desc',
-	hide_refresh: true,
-	no_toolbar: true,
-	render_row: function(parent, data) {
-		if(data.content && data.content.length==1000) data.content += '... (read on)';
-		data.content = wn.markdown(data.content);
-		if(data.last_name) data.last_name = ' ' + data.last_name;
-		data.date = prettyDate(data.creation);
-		parent.innerHTML = repl('<h2>%(title)s</h2>\
-			<p><div class="help">By %(first_name)s%(last_name)s, %(date)s</div></p>\
-			<p>%(content)s</p>\
-			<a href="%(name)s.html">Read Full Text</a><br>', data);
-	},
-	page_length: 10
-});
-erpnext.blog_list.run();
-</script>
\ No newline at end of file
+{% endblock %}
\ No newline at end of file
diff --git a/erpnext/website/templates/blog.js b/erpnext/website/templates/blog.js
new file mode 100644
index 0000000..80cb813
--- /dev/null
+++ b/erpnext/website/templates/blog.js
@@ -0,0 +1,87 @@
+{% extends "page.html" %}
+
+{% block javascript %}
+// ERPNext - web based ERP (http://erpnext.com)
+// Copyright (C) 2012 Web Notes Technologies Pvt Ltd
+// 
+// This program is free software: you can redistribute it and/or modify
+// it under the terms of the GNU General Public License as published by
+// the Free Software Foundation, either version 3 of the License, or
+// (at your option) any later version.
+// 
+// This program is distributed in the hope that it will be useful,
+// but WITHOUT ANY WARRANTY; without even the implied warranty of
+// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+// GNU General Public License for more details.
+// 
+// You should have received a copy of the GNU General Public License
+// along with this program.  If not, see <http://www.gnu.org/licenses/>.
+
+// js inside blog page
+wn.pages['{{ name }}'].onload = function(wrapper) {
+	// sidebar
+	wrapper.recent_list = new wn.ui.Listing({
+		parent: $(wrapper).find('.recent-posts'),
+		no_toolbar: true,
+		query: 'select name, title, left(content, 100) as content from tabBlog\
+			where ifnull(published,0)=1 and name!="{{ name }}" order by creation desc',
+		hide_refresh: true,
+		render_row: function(parent, data) {
+			//console.log(data);
+			if(data.content && data.content.length==100) data.content += '...';
+			parent.innerHTML = repl('<a href="%(name)s.html">%(title)s</a>\
+				<div class="comment">%(content)s</div><br>', data);
+		},
+		page_length: 5,
+	});
+	wrapper.recent_list.run();
+
+	wrapper.comment_list = new wn.ui.Listing({
+		parent: $(wrapper).find('.blog-comments').get(0),
+		no_toolbar: true,
+		query: 'select comment, comment_by_fullname, creation\
+			from `tabComment` where comment_doctype="Page"\
+			and comment_docname="{{ name }}" order by creation desc',
+		no_result_message: 'Be the first one to comment',
+		render_row: function(parent, data) {
+			data.comment_date = prettyDate(data.creation);
+			$(parent).html(repl("<div style='color:#777'>\
+				%(comment_by_fullname)s | %(comment_date)s:\
+				</div>\
+				<p style='margin-left: 20px;'>%(comment)s</p><br>", data))
+		},
+		hide_refresh: true,
+	});
+	wrapper.comment_list.run();
+
+	// add comment
+	$(wrapper).find('.layout-main-section').append('<br><button class="btn add-comment">\
+		Add Comment</button>');
+	$(wrapper).find('button.add-comment').click(function(){
+		d = new wn.widgets.Dialog({
+			title: 'Add Comment',
+			fields: [
+				{fieldname:'comment_by_fullname', label:'Your Name', reqd:1, fieldtype:'Data'},
+				{fieldname:'comment_by', label:'Email Id', reqd:1, fieldtype:'Data'},
+				{fieldname:'comment', label:'Comment', reqd:1, fieldtype:'Text'},
+				{fieldname:'post', label:'Post', fieldtype:'Button'}
+			]
+		});
+		d.fields_dict.post.input.onclick = function() {
+			var btn = this;
+			var args = d.get_values();
+			if(!args) return;
+			args.comment_doctype = 'Page';
+			args.comment_docname = '{{ name }}';
+			$(btn).set_working();
+			$c('webnotes.widgets.form.comments.add_comment', args, function(r) {
+				$(btn).done_working();
+				d.hide();
+				wrapper.comment_list.refresh();
+			})
+		}
+		d.show();
+	})
+}
+
+{% endblock %}
diff --git a/erpnext/website/templates/page.html b/erpnext/website/templates/page.html
index 97a309a..a8e20f6 100644
--- a/erpnext/website/templates/page.html
+++ b/erpnext/website/templates/page.html
@@ -12,7 +12,9 @@
 		var _page = new wn.views.Page(window.page_name);
 	
 		// page script
+		{% block javascript %}
 		{{ javascript }}
+		{% endblock %}
 	
 		// trigger onload
 		_page.trigger('onload');
diff --git a/erpnext/website/templates/web_page.html b/erpnext/website/templates/web_page.html
new file mode 100644
index 0000000..8188e71
--- /dev/null
+++ b/erpnext/website/templates/web_page.html
@@ -0,0 +1,23 @@
+{% extends "page.html" %}
+
+{% block content %}
+	<div class="layout-wrapper layout-wrapper-background">
+		<div class="web-content" style="text-align: {{ text_align }};">
+
+			{% if layout and layout.startswith('Two column') %}
+			<div class="layout-main-section">
+			{% else %}
+			<div class="layout-main">
+			{% endif %}
+				{{ main_section_html }}
+			</div>
+
+			{% if layout and layout.startswith('Two column') %}
+			<div class="layout-side-section">
+				{{ side_section_html }}
+			</div>
+			{% endif %}
+			<div style="clear: both"></div>
+		</div>
+	</div>
+{% endblock %}
\ No newline at end of file