diff --git a/src/main/resources/lang_zh_CN.properties b/src/main/resources/lang_zh_CN.properties
index c12204b9b..0ce913873 100644
--- a/src/main/resources/lang_zh_CN.properties
+++ b/src/main/resources/lang_zh_CN.properties
@@ -147,6 +147,6 @@ ADLabel=\u9499\u5976\uff0c\u54c7\u5361\u5361~
 postLabel=\u53d1\u5e03
 previewLabel=\u9884\u89c8
 postGuideLabel=<ul class='tip-add-article'>\
-<li>\u6587\u7ae0\u4e00\u65e6\u53d1\u5e03\u5c31<span style='color:#DC5F59'>\u4e0d\u80fd\u7f16\u8f91</span>\u4e86\uff0c\u6240\u4ee5\u53d1\u5e03\u524d\u8bf7\u5148\u68c0\u67e5\u4e00\u4e0b</li>\
+<li>\u6587\u7ae0\u4e00\u65e6\u53d1\u5e03\u5c31<span style='color:#DC5F59'>\u4e0d\u80fd\u5220\u9664</span>\u4e86\uff0c\u6240\u4ee5\u53d1\u5e03\u524d\u8bf7\u5148\u68c0\u67e5\u4e00\u4e0b</li>\
 <li>\u5728<a href='/settings' target='_blank'>\u8bbe\u7f6e</a>\u4e2d\u8fdb\u884c<a href='/article/1353772377257' target='_blank'>\u540c\u6b65\u914d\u7f6e</a>\u540e\uff0c\u53d1\u5e16\u65f6\u52fe\u9009\u201c\u4fdd\u6301\u540c\u6b65\u201d\u5c06\u628a\u8be5\u6587\u7ae0\u540c\u6b65\u81f3\u535a\u5ba2</li>\
 <li>\u6587\u7ae0\u4fdd\u6301\u540c\u6b65\u540e\uff0c\u6240\u6709\u6765\u81ea\u535a\u5ba2\u7684\u8bc4\u8bba\u5c06\u88ab\u540c\u6b65\u81f3\u793e\u533a\uff1b\u540c\u6837\uff0c\u793e\u533a\u7684\u8bc4\u8bba\u4e5f\u4f1a\u540c\u6b65\u81f3\u535a\u5ba2</li></ul>
\ No newline at end of file
diff --git a/src/main/webapp/css/base.css b/src/main/webapp/css/base.css
index d37430237..9d6095e74 100644
--- a/src/main/webapp/css/base.css
+++ b/src/main/webapp/css/base.css
@@ -605,6 +605,7 @@ button.red:active {
     display: none;
     position: absolute;
     z-index: 100;
+    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5);
 }
 .dialog-title {
     color: #FFFFFF;
@@ -614,27 +615,13 @@ button.red:active {
     margin-left: 3px;
 }
 
-.dialog-header-bg {
-    background-color: #fafafa;
-    background: linear-gradient(#fafafa, #eaeaea);
-    background: -ms-linear-gradient(#fafafa, #eaeaea);
-    background: -o-linear-gradient(#fafafa, #eaeaea);
-    background: -webkit-linear-gradient(#fafafa, #eaeaea);
-    filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#fafafa', endColorstr='#eaeaea');
-    border-color: #C0C0C0 #D9D9D9 #D9D9D9;
-    border-radius: 6px 6px 0 0;
-    border-style: solid;
-    border-width: 1px 1px 0;
-    cursor: move;
-    height: 34px;
-}
-
 .dialog-close-icon {
     background: url("../images/icons.png") no-repeat scroll -4px -96px transparent;
     cursor: pointer;
     float: right;
     height: 18px;
-    margin-top: 6px;
+    margin-right: -17px;
+    margin-top: -8px;
     padding: 3px;
     width: 22px;
 }
@@ -645,9 +632,7 @@ button.red:active {
 
 .dialog-main {
     background-color: #FFFFFF;
-    border: 2px solid #666666;
-    border-color: #C0C0C0 #D9D9D9 #D9D9D9;
-    border-top-width: 0;
+    border: 1px solid #777;
     padding: 12px;
 }
 /* end dialog */
diff --git a/src/main/webapp/js/add-article.js b/src/main/webapp/js/add-article.js
index edf7ef3e3..bdb76ebff 100644
--- a/src/main/webapp/js/add-article.js
+++ b/src/main/webapp/js/add-article.js
@@ -1,154 +1,162 @@
-/*
- * Copyright (c) 2012, B3log Team
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-/**
- * @fileoverview add-article.
- *
- * @author <a href="mailto:LLY219@gmail.com">Liyuan Li</a>
- * @version 1.0.0.8, Mar 5, 2013
- */
-
-/**
- * @description Add article function.
- * @static
- */
-var AddArticle = {
-
-    /**
-     * @description 发布文章
-     */
-    add: function () {
-        var isError = false;
-        if (this.editor.getValue().length < 4 || this.editor.getValue().length > 1048576) {
-            $("#articleContentTip").addClass("tip-error").text(Label.articleContentErrorLabel);
-        } else {
-            isError = true;
-            $("#articleContentTip").removeClass("tip-error").text("");
-        }
-        
-        if (Validate.goValidate([{
-            "id": "articleTitle",
-            "type": 256,
-            "msg": Label.articleTitleErrorLabel
-        }, {
-            "id": "articleTags",
-            "type": "tags",
-            "msg": Label.articleTagsErrorLabel
-        }]) && isError) {
-            var requestJSONObject = {
-                articleTitle: $("#articleTitle").val().replace(/(^\s*)|(\s*$)/g,""),
-                articleContent: this.editor.getValue(),
-                articleTags: $("#articleTags").val().replace(/(^\s*)|(\s*$)/g,""),
-                syncWithSymphonyClient: $("#syncWithSymphonyClient").prop("checked")
-            };
-            
-            $.ajax({
-                url: "/article",
-                type: "POST",
-                cache: false,
-                data: JSON.stringify(requestJSONObject),
-                beforeSend: function () {
-                    $(".form button.red").attr("disabled", "disabled").css("opacity", "0.3");
-                },
-                success: function(result, textStatus){
-                    $(".form button.red").removeAttr("disabled").css("opacity", "1");
-                    if (result.sc) {
-                        window.location = "/member/" + Label.userName;
-                    } else {
-                        $("#addArticleTip").addClass("tip-error").text(result.msg).css({
-                            "border-left": "1px solid #E2A0A0",
-                            "top": "-35px",
-                            "width": "985px"
-                        });
-                    }
-                },
-                complete: function () {
-                    $(".form button.red").removeAttr("disabled").css("opacity", "1"); 
-                }
-            });
-        }
-    },
-    
-    /**
-     * @description 初识化发文页面，回车提交表单
-     */
-    init: function () {
-        var it = this;
-        it.editor = CodeMirror.fromTextArea(document.getElementById("articleContent"), {
-            mode: 'markdown',
-            lineNumbers: true,
-            onKeyEvent: function (editor, event) {
-                if (it.editor.getValue().replace(/(^\s*)|(\s*$)/g, "") !== "") {
-                    $(".form .green").show();
-                } else {
-                    $(".form .green").hide();
-                }
-                
-                if (event.keyCode === 13 && event.ctrlKey) {
-                    AddArticle.add();
-                }
-            }
-        });
-            
-        $("#articleTitle, #articleTags").keypress(function (event) {
-            if (event.keyCode === 13) {
-                AddArticle.add();
-            }
-        });
-        
-        $("#preview").dialog({
-            "modal": true,
-            "hideFooter": true,
-            "height": 402
-        });
-    },
-    
-    /**
-     * @description 预览文章
-     */
-    preview: function () {
-        var it = this;
-        $.ajax({
-            url: "/markdown",
-            type: "POST",
-            cache: false,
-            data: {
-                markdownText: it.editor.getValue()
-            },
-            success: function(result, textStatus){
-                $("#preview").dialog("open");
-                $("#preview").html(result.html);
-            }
-        });
-    },
-    
-    /**
-     * @description 显示简要语法
-     */
-    grammar: function () {
-        var $grammar = $(".grammar"),
-        $codemirror = $(".CodeMirror");
-        if ($codemirror.width() > 900) {
-            $grammar.show();
-            $codemirror.width(770);
-        } else {
-            $grammar.hide();
-            $codemirror.width(996)
-        }
-       
-    }
-};
-
+/*
+ * Copyright (c) 2012, B3log Team
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+/**
+ * @fileoverview add-article.
+ *
+ * @author <a href="mailto:LLY219@gmail.com">Liyuan Li</a>
+ * @version 1.0.0.8, Mar 5, 2013
+ */
+
+/**
+ * @description Add article function.
+ * @static
+ */
+var AddArticle = {
+
+    /**
+     * @description 发布文章
+     * @id [string] 文章 id ，如不为空则表示更新文章否则为添加文章
+     */
+    add: function (id) {
+        var isError = false;
+        if (this.editor.getValue().length < 4 || this.editor.getValue().length > 1048576) {
+            $("#articleContentTip").addClass("tip-error").text(Label.articleContentErrorLabel);
+        } else {
+            isError = true;
+            $("#articleContentTip").removeClass("tip-error").text("");
+        }
+        
+        if (Validate.goValidate([{
+            "id": "articleTitle",
+            "type": 256,
+            "msg": Label.articleTitleErrorLabel
+        }, {
+            "id": "articleTags",
+            "type": "tags",
+            "msg": Label.articleTagsErrorLabel
+        }]) && isError) {
+            var requestJSONObject = {
+                articleTitle: $("#articleTitle").val().replace(/(^\s*)|(\s*$)/g,""),
+                articleContent: this.editor.getValue(),
+                articleTags: $("#articleTags").val().replace(/(^\s*)|(\s*$)/g,""),
+                syncWithSymphonyClient: $("#syncWithSymphonyClient").prop("checked")
+            },
+            url = "/article",
+            type = "POST";
+    
+            if (id) {
+                url = url + "/" + id;
+                type = "PUT";
+            }
+            
+            $.ajax({
+                url: url,
+                type: type,
+                cache: false,
+                data: JSON.stringify(requestJSONObject),
+                beforeSend: function () {
+                    $(".form button.red").attr("disabled", "disabled").css("opacity", "0.3");
+                },
+                success: function(result, textStatus){
+                    $(".form button.red").removeAttr("disabled").css("opacity", "1");
+                    if (result.sc) {
+                        window.location = "/member/" + Label.userName;
+                    } else {
+                        $("#addArticleTip").addClass("tip-error").text(result.msg).css({
+                            "border-left": "1px solid #E2A0A0",
+                            "top": "-35px",
+                            "width": "985px"
+                        });
+                    }
+                },
+                complete: function () {
+                    $(".form button.red").removeAttr("disabled").css("opacity", "1"); 
+                }
+            });
+        }
+    },
+    
+    /**
+     * @description 初识化发文页面，回车提交表单
+     */
+    init: function () {
+        var it = this;
+        it.editor = CodeMirror.fromTextArea(document.getElementById("articleContent"), {
+            mode: 'markdown',
+            lineNumbers: true,
+            onKeyEvent: function (editor, event) {
+                if (it.editor.getValue().replace(/(^\s*)|(\s*$)/g, "") !== "") {
+                    $(".form .green").show();
+                } else {
+                    $(".form .green").hide();
+                }
+                
+                if (event.keyCode === 13 && event.ctrlKey) {
+                    AddArticle.add();
+                }
+            }
+        });
+            
+        $("#articleTitle, #articleTags").keypress(function (event) {
+            if (event.keyCode === 13) {
+                AddArticle.add();
+            }
+        });
+        
+        $("#preview").dialog({
+            "modal": true,
+            "hideFooter": true,
+            "height": 402
+        });
+    },
+    
+    /**
+     * @description 预览文章
+     */
+    preview: function () {
+        var it = this;
+        $.ajax({
+            url: "/markdown",
+            type: "POST",
+            cache: false,
+            data: {
+                markdownText: it.editor.getValue()
+            },
+            success: function(result, textStatus){
+                $("#preview").dialog("open");
+                $("#preview").html(result.html);
+            }
+        });
+    },
+    
+    /**
+     * @description 显示简要语法
+     */
+    grammar: function () {
+        var $grammar = $(".grammar"),
+        $codemirror = $(".CodeMirror");
+        if ($codemirror.width() > 900) {
+            $grammar.show();
+            $codemirror.width(770);
+        } else {
+            $grammar.hide();
+            $codemirror.width(996)
+        }
+       
+    }
+};
+
 AddArticle.init();
\ No newline at end of file
diff --git a/src/main/webapp/skins/classic/home/add-article.ftl b/src/main/webapp/skins/classic/home/add-article.ftl
index f594e15be..f9ef00eca 100644
--- a/src/main/webapp/skins/classic/home/add-article.ftl
+++ b/src/main/webapp/skins/classic/home/add-article.ftl
@@ -1,66 +1,66 @@
-<#include "../macro-head.ftl">
-<!DOCTYPE html>
-<html>
-    <head>
-        <@head title="${userName} - ${addArticleLabel}">
-        <meta name="robots" content="none" />
-        </@head>
-        <link type="text/css" rel="stylesheet" href="${staticServePath}/css/home.css?${staticResourceVersion}" />
-        <link type="text/css" rel="stylesheet" href="${staticServePath}/js/lib/codemirror/codemirror.css?${staticResourceVersion}" />
-    </head>
-    <body>
-        <#include "../header.ftl">
-        <div class="main">
-            <div class="wrapper">
-                <div class="form">
-                    ${titleLabel}
-                    <div>
-                        <input type="text" id="articleTitle" />
-                        <span style="right:2px;top:30px;"></span>
-                    </div>
-                    ${contentLabel}
-                    <a href="javascript:AddArticle.grammar()">${baseGrammarLabel}</a>
-                    <a target="_blank" href="http://daringfireball.net/projects/markdown/syntax">${allGrammarLabel}</a>
-                    <div class="fn-clear">
-                        <div class="fn-left">
-                            <textarea id="articleContent"></textarea>
-                            <span id="articleContentTip" style="right:2px;top:410px;"></span>
-                        </div>
-                        <div class="fn-left grammar fn-none">
-                            ${markdwonGrammarLabel}
-                        </div>
-                    </div>
-                    ${tagLabel}
-                    <div>
-                        <input id="articleTags" type="text" />
-                        <span style="right:2px;top:478px;"></span>
-                    </div>
-                    <div class="fn-clear">
-                        <div class="fn-left">
-                            <input type="checkbox" id="syncWithSymphonyClient"/> 
-                            ${syncWithSymphonyClientLabel}
-                        </div>
-                        <div class="fn-right">
-                            <button class="green fn-none" onclick="AddArticle.preview()">${previewLabel}</button>
-                            <button class="red" onclick="AddArticle.add()">${postLabel}</button>
-                        </div>
-                    </div>
-                    <div id="addArticleTip">
-                    </div>
-                    ${postGuideLabel}
-                </div>
-            </div>
-        </div>
-        <div id="preview" class="content-reset"></div>
-        <#include "../footer.ftl">
-        <script>
-            Label.articleTitleErrorLabel = "${articleTitleErrorLabel}";
-            Label.articleContentErrorLabel = "${articleContentErrorLabel}";
-            Label.articleTagsErrorLabel = "${articleTagsErrorLabel}";
-            Label.userName = "${userName}";
-        </script>
-        <script src="${staticServePath}/js/lib/jquery/jquery.bowknot.min.js?${staticResourceVersion}"></script>
-        <script src="${staticServePath}/js/lib/codemirror/codemirror.js?${staticResourceVersion}"></script>
-        <script src="${staticServePath}/js/add-article.js?${staticResourceVersion}"></script>
-    </body>
-</html>
+<#include "../macro-head.ftl">
+<!DOCTYPE html>
+<html>
+    <head>
+        <@head title="${userName} - ${addArticleLabel}">
+        <meta name="robots" content="none" />
+        </@head>
+        <link type="text/css" rel="stylesheet" href="${staticServePath}/css/home.css?${staticResourceVersion}" />
+        <link type="text/css" rel="stylesheet" href="${staticServePath}/js/lib/codemirror/codemirror.css?${staticResourceVersion}" />
+    </head>
+    <body>
+        <#include "../header.ftl">
+        <div class="main">
+            <div class="wrapper">
+                <div class="form">
+                    ${titleLabel}
+                    <div>
+                        <input type="text" id="articleTitle" value="<#if article??>${article.articleTitle}</#if>" />
+                        <span style="right:2px;top:30px;"></span>
+                    </div>
+                    ${contentLabel}
+                    <a href="javascript:AddArticle.grammar()">${baseGrammarLabel}</a>
+                    <a target="_blank" href="http://daringfireball.net/projects/markdown/syntax">${allGrammarLabel}</a>
+                    <div class="fn-clear">
+                        <div class="fn-left">
+                            <textarea id="articleContent"><#if article??>${article.articleContent}</#if></textarea>
+                            <span id="articleContentTip" style="right:2px;top:410px;"></span>
+                        </div>
+                        <div class="fn-left grammar fn-none">
+                            ${markdwonGrammarLabel}
+                        </div>
+                    </div>
+                    ${tagLabel}
+                    <div>
+                        <input id="articleTags" type="text" value="<#if article??>${article.articleTags}</#if>" />
+                        <span style="right:2px;top:478px;"></span>
+                    </div>
+                    <div class="fn-clear">
+                        <div class="fn-left">
+                            <input<#if article??> disabled="disabled"<#if article.syncWithSymphonyClient> checked="checked"</#if></#if> type="checkbox" id="syncWithSymphonyClient"/> 
+                            ${syncWithSymphonyClientLabel}
+                        </div>
+                        <div class="fn-right">
+                            <button class="green<#if !article??> fn-none</#if>" onclick="AddArticle.preview()">${previewLabel}</button>
+                            <button class="red" onclick="AddArticle.add(<#if article??>'${article.oId}'</#if>)">${postLabel}</button>
+                        </div>
+                    </div>
+                    <div id="addArticleTip">
+                    </div>
+                    ${postGuideLabel}
+                </div>
+            </div>
+        </div>
+        <div id="preview" class="content-reset"></div>
+        <#include "../footer.ftl">
+        <script>
+            Label.articleTitleErrorLabel = "${articleTitleErrorLabel}";
+            Label.articleContentErrorLabel = "${articleContentErrorLabel}";
+            Label.articleTagsErrorLabel = "${articleTagsErrorLabel}";
+            Label.userName = "${userName}";
+        </script>
+        <script src="${staticServePath}/js/lib/jquery/jquery.bowknot.min.js?${staticResourceVersion}"></script>
+        <script src="${staticServePath}/js/lib/codemirror/codemirror.js?${staticResourceVersion}"></script>
+        <script src="${staticServePath}/js/add-article.js?${staticResourceVersion}"></script>
+    </body>
+</html>