diff --git a/readme.md b/readme.md
index 5b4460a..d1b6481 100644
--- a/readme.md
+++ b/readme.md
@@ -1,9 +1,36 @@
-## H5-Dooring
+<h1 align="center">Welcome to H5-Dooring 👋</h1>
+<p>
+  <img alt="Version" src="https://img.shields.io/badge/version-1.2-blue.svg?cacheSeconds=2592000" />
+  <a href="https://juejin.im/post/6864410873709592584/" target="_blank">
+    <img alt="Documentation" src="https://img.shields.io/badge/documentation-yes-brightgreen.svg" />
+  </a>
+  <a href="#" target="_blank">
+    <img alt="License: MIT" src="https://img.shields.io/badge/License-MIT-yellow.svg" />
+  </a>
+</p>
+
+> H5-Dooring是一款功能强大，开源免费的H5可视化页面配置解决方案，致力于提供一套简单方便、专业可靠、无限可能的H5落地页最佳实践。技术栈以react为主， 后台采用nodejs开发。
+
+### 🏠 [Homepage](http://io.nainor.com/h5_visible)
+
+### ✨ [Demo](http://io.nainor.com/h5_plus/editor?tid=123456)
+
 <img src="http://io.nainor.com/uploads/56_1741c466be0.png" alt="H5可视化编辑器" />
 
-H5-Dooring是一款功能强大，开源免费的H5可视化页面配置解决方案，致力于提供一套简单方便、专业可靠、无限可能的H5落地页最佳实践。技术栈以react为主， 后台采用nodejs开发。
+## Author
 
-* 预览地址：http://io.nainor.com/h5_visible
+👤 **徐小夕**
+
+* Website: http://io.nainor.com/h5_visible
+* Github: [@MrXujiang](https://github.com/MrXujiang)
+
+## 🤝 Contributing
+
+Contributions, issues and feature requests are welcome!<br />Feel free to check [issues page](https://github.com/MrXujiang/h5-Dooring/issues). 
+
+## Show your support
+
+Give a ⭐️ if this project helped you!
 
 ## 技术栈
 * **React** 前端主流框架(react,vue,angular)之一,更适合开发灵活度高且复杂的应用
@@ -225,6 +252,18 @@ FileSaver.saveAs(blob, "hello world.txt");
 * 组件细分和代码优化
 * 添加typescript支持和单元测试
 
+## Install(安装)
+
+```sh
+yarn install
+```
+
+## Usage
+
+```sh
+yarn run start
+```
+
 ## 持续升级
 正在升级1.1版本，敬请期待...
 
diff --git a/src/pages/editor/components/Header/index.js b/src/pages/editor/components/Header/index.js
index 03d00ef..351bf01 100644
--- a/src/pages/editor/components/Header/index.js
+++ b/src/pages/editor/components/Header/index.js
@@ -87,6 +87,10 @@ const HeaderComponent = memo((props) => {
     req.post('/visible/preview', { tid, tpl: pointData })
   }
 
+  const handleSaveCode = () => {
+    
+  }
+
   return (
     <div className={styles.header}>
         <div className={styles.logoArea}>
@@ -98,7 +102,8 @@ const HeaderComponent = memo((props) => {
         </div>
         <div className={styles.btnArea}>
           <Button type="primary" style={{marginRight: '9px'}} onClick={useTemplate}>使用模版库</Button>
-          <Button type="primary" style={{marginRight: '9px'}} onClick={handleSaveTpl} disabled={!pointData.length}><DownloadOutlined />保存</Button>
+          <Button type="primary" style={{marginRight: '9px'}} onClick={handleSaveTpl} disabled={!pointData.length}><DownloadOutlined />保存模版</Button>
+          <Button style={{marginRight: '9px'}} onClick={handleSaveCode} disabled={!pointData.length}><DownloadOutlined /></Button>
           <Button style={{marginRight: '9px'}} title="下载json文件" onClick={downLoadJson} disabled={!pointData.length}><CopyOutlined /></Button>
           <Popover placement="bottom" title={null} content={content} trigger="click">
             <Button style={{marginRight: '9px'}} onClick={savePreview} disabled={!pointData.length}><MobileOutlined /></Button>