diff --git a/docs/en/faq.md b/docs/en/faq.md
index d5fe1e60..e98ac5f3 100644
--- a/docs/en/faq.md
+++ b/docs/en/faq.md
@@ -116,7 +116,9 @@
   <button type="button" class="btn btn-primary" data-toggle="collapse" data-target="#Q9">answer</button>
   <div id="Q9" class="collapse">
     <img src="assets/img/faq/m5stickc_05.jpg" width="50%" height="50%">
-     There is one way to bring the device back to live: 1, Connect G0 to 3V3.  2. Plug in the USB cable. 3, The screen will light up and leave the USB to charge the device.  
+
+  There is one way to bring the device back to live: 1, Connect G0 to 3V3.  2. Plug in the USB cable. 3, The screen will light up and leave the USB to charge the device.  
+
   </div>
 </div>
 
diff --git a/docs/en/unit/accel.md b/docs/en/unit/accel.md
index b946733d..17ed04b7 100644
--- a/docs/en/unit/accel.md
+++ b/docs/en/unit/accel.md
@@ -4,7 +4,7 @@
 
 ***
 
-:memo:**[Description](#Description)**&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;:electric_plug:**[Schematic](#Schematic)** &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;:octocat:**[Code](#Code)**&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 🛒**[Purchase](https://m5stack.com/collections/m5-unit/products/3-axis-analog-accelerometer-unitadx345)**&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<img src="https://m5stack.oss-cn-shenzhen.aliyuncs.com/image/EasyLoader_logo-min.jpg">**[EasyLoader](#EasyLoader)**
+:memo:**[Description](#Description)**&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;:electric_plug:**[Schematic](#Schematic)** &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;:octocat:**[Code](#Code)**&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 🛒**[Purchase](https://m5stack.com/products/3-axis-digital-accelerometer-unit-adxl345)**&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<img src="https://m5stack.oss-cn-shenzhen.aliyuncs.com/image/EasyLoader_logo-min.jpg">**[EasyLoader](#EasyLoader)**
 
 ## Description
 
diff --git a/docs/index.html b/docs/index.html
index dc14ae7a..ba5a0268 100644
--- a/docs/index.html
+++ b/docs/index.html
@@ -78,24 +78,20 @@
     <script src="https://unpkg.com/docsify/lib/plugins/ga.min.js"></script>
     <!-- <script src="https://unpkg.com/docsify/lib/plugins/search.js"></script> -->
     <script src="https://unpkg.com/docsify/lib/plugins/zoom-image.min.js"></script>
-    <script src="https://unpkg.com/prismjs/components/prism-bash.min.js"></script>
+    <!-- <script src="https://unpkg.com/prismjs/components/prism-bash.min.js"></script>
     <script src="https://unpkg.com/prismjs/components/prism-python.min.js"></script>
     <script src="https://unpkg.com/prismjs/components/prism-c.min.js"></script>
     <script src="https://unpkg.com/prismjs/components/prism-cpp.min.js"></script>
-    <script src="https://unpkg.com/prismjs/components/prism-arduino.min.js"></script>
+    <script src="https://unpkg.com/prismjs/components/prism-arduino.min.js"></script> -->
 </body>
 
 <script>
     window.onload = function() {
         $('.nav-link[data-bind="event"]').delegate(this, 'mouseenter', Enter);
-        $('.nav-link[data-bind="event"]').next("div").delegate(this, 'mouseleave',Leave);
-        $(document).ready(function(){
-        $(".dropdown-menu a").css("margin-left","35px");
-     });
+        $('.dropdown-menu div[data-bind="leave1"]').delegate(this, 'mouseleave',Leave);
     }
     
     function Enter() {
-        console.log(1);
         $(this).find("~ div").eq(0).removeClass("collapse")
         $(this).find("~ div").eq(0).addClass("collapse show")
 
@@ -108,10 +104,8 @@
 
     // };
     function Leave() {
-        console.log(this)
-        console.log(2);
-        $(this).removeClass("collapse show")
-        $(this).addClass("collapse")
+        $(this).children("div").removeClass("collapse show")
+        $(this).children("div").addClass("collapse")
 
     };
 </script>
diff --git a/docs/sidebar.md b/docs/sidebar.md
index dc642165..1f43217e 100644
--- a/docs/sidebar.md
+++ b/docs/sidebar.md
@@ -1,4 +1,4 @@
-- [Product Documents](en/)
+<!-- - [Product Documents](en/)
 - [Arduino API](en/api)
 - [M5Stack Cases](en/case)
 - [Related Documents](en/related_documents)
@@ -9,32 +9,32 @@
 - <a href="https://m5stack.com/"><img src="https://docs.m5stack.com/assets/img/favicon.ico" width=16px/>M5Stack</a>
 - [![Github](https://icongram.jgog.in/simple/github.svg?color=808080&size=16)Github](https://github.com/m5stack)
 - [![Twitter](https://icongram.jgog.in/simple/twitter.svg?colored&size=16)@M5Stack](http://twitter.com/M5Stack)
-- [![Facebook](https://icongram.jgog.in/simple/facebook.svg?colored&size=16)@M5Stack](https://www.facebook.com/M5Stack)
+- [![Facebook](https://icongram.jgog.in/simple/facebook.svg?colored&size=16)@M5Stack](https://www.facebook.com/M5Stack) -->
 
 
 
 
-
-<!-- 
 <div class="container">
     <a class="nav-link" href="#" data-toggle="collapse" data-target="#Product">> Product Documents</a>
 <div id="Product" class="collapse">
 <div class="container" style="margin:10px">
   <div class="btn-group-vertical">
-    <button type="button" class="btn btn-primary">Core</button>
+    <button type="button" class="btn btn-primary"><a href="#" style="color:white;text-decoration:none;margin-left:-25px">Product list</a></button>
     <div class="btn-group">
         <button type="button" class="btn btn-primary dropdown-toggle" data-toggle="dropdown">
         Core
         </button>
         <div class="dropdown-menu" style="margin-left:45px ; margin-top:-10px">
-        <a class="dropdown-item" href="/#/en/core/basic">Basic</a>
-        <a class="dropdown-item" href="/#/en/core/gray">GRAY</a>
-        <a class="dropdown-item" href="/#/en/core/fire" >FIRE</a>
-        <a class="dropdown-item" href="/#/en/core/m5stickc" >M5StickC</a>
-        <a class="dropdown-item" href="/#/en/core/m5stick" >M5Stick</a>
-        <a class="dropdown-item" href="/#/en/core/m5go_lite" >M5GO Lite</a>
-        <a class="dropdown-item" href="/#/en/core/m5go" >M5GO Kit</a>
-        <a class="dropdown-item" href="/#/en/core/face_kit" >FACES Kit</a>
+            <div style="margin-left:20px">
+                <a class="dropdown-item" href="#/en/core/basic">Basic</a>
+                <a class="dropdown-item" href="#/en/core/gray">GRAY</a>
+                <a class="dropdown-item" href="#/en/core/fire" >FIRE</a>
+                <a class="dropdown-item" href="#/en/core/m5stickc" >M5StickC</a>
+                <a class="dropdown-item" href="#/en/core/m5stick" >M5Stick</a>
+                <a class="dropdown-item" href="#/en/core/m5go_lite" >M5GO Lite</a>
+                <a class="dropdown-item" href="#/en/core/m5go" >M5GO Kit</a>
+                <a class="dropdown-item" href="#/en/core/face_kit" >FACES Kit</a>
+            </div>
         </div>
     </div>
         <div class="btn-group">
@@ -42,26 +42,28 @@
         Module
         </button>
         <div class="dropdown-menu" style="margin-left:45px ; margin-top:-10px">
-        <a class="dropdown-item" href="#/en/?id=basic" >GPS</a>
-        <a class="dropdown-item" href="#/en/?id=gray" >LORA</a>
-        <a class="dropdown-item" href="#/en/?id=fire" >LoRaWAN</a>
-        <a class="dropdown-item" href="#/en/?id=m5stickc" >SIM800L</a>
-        <a class="dropdown-item" href="#/en/?id=m5stick" >COMMU</a>
-        <a class="dropdown-item" href="#/en/?id=m5go-lite" >BATTERY</a>
-        <a class="dropdown-item" href="#/en/?id=m5go-kit" >PROTO</a>
-        <a class="dropdown-item" href="#/en/?id=faces-kit" >PROTO-KIT</a>
-        <a class="dropdown-item" href="#/en/?id=basic" >PLUS</a>
-        <a class="dropdown-item" href="#/en/?id=gray" >USB</a>
-        <a class="dropdown-item" href="#/en/?id=fire" >BUS</a>
-        <a class="dropdown-item" href="#/en/?id=m5stickc" >GoPlus</a>
-        <a class="dropdown-item" href="#/en/?id=m5stick" >STEPMOTOR</a>
-        <a class="dropdown-item" href="#/en/?id=m5go-lite" >SERVO</a>
-        <a class="dropdown-item" href="#/en/?id=m5go-kit" >LEGO+</a>
-        <a class="dropdown-item" href="#/en/?id=faces-kit" >FAN</a>
-        <a class="dropdown-item" href="#/en/?id=m5stick" >FACES-ENCODER</a>
-        <a class="dropdown-item" href="#/en/?id=m5go-lite" >FACES-JOYSTICK</a>
-        <a class="dropdown-item" href="#/en/?id=m5go-kit" >FACES-FINGER</a>
-        <a class="dropdown-item" href="#/en/?id=faces-kit" >FACES-RFID</a>
+            <div style="margin-left:20px">
+                <a class="dropdown-item" href="#/en/module/gps" >GPS</a>
+                <a class="dropdown-item" href="#/en/module/lora" >LORA</a>
+                <a class="dropdown-item" href="#/en/module/lorawan" >LoRaWAN</a>
+                <a class="dropdown-item" href="#/en/module/sim800" >SIM800L</a>
+                <a class="dropdown-item" href="#/en/module/commu" >COMMU</a>
+                <a class="dropdown-item" href="#/en/module/battery" >BATTERY</a>
+                <a class="dropdown-item" href="#/en/module/proto" >PROTO</a>
+                <a class="dropdown-item" href="#/en/module/proto_kit" >PROTO-KIT</a>
+                <a class="dropdown-item" href="#/en/module/plus" >PLUS</a>
+                <a class="dropdown-item" href="#/en/module/usb" >USB</a>
+                <a class="dropdown-item" href="#/en/module/bus" >BUS</a>
+                <a class="dropdown-item" href="#/en/module/goplus" >GoPlus</a>
+                <a class="dropdown-item" href="#/en/module/stepmotor" >STEPMOTOR</a>
+                <a class="dropdown-item" href="#/en/module/servo" >SERVO</a>
+                <a class="dropdown-item" href="#/en/module/lego_plus" >LEGO+</a>
+                <a class="dropdown-item" href="#/en/module/fan" >FAN</a>
+                <a class="dropdown-item" href="#/en/module/encoder" >FACES-ENCODER</a>
+                <a class="dropdown-item" href="#/en/module/joystick" >FACES-JOYSTICK</a>
+                <a class="dropdown-item" href="#/en/module/faces_finger" >FACES-FINGER</a>
+                <a class="dropdown-item" href="#/en/module/faces_rfid" >FACES-RFID</a>
+            </div>
         </div>
     </div>
     <div class="btn-group">
@@ -69,17 +71,19 @@
         Base
         </button>
         <div class="dropdown-menu" style="margin-left:45px ; margin-top:-10px">
-        <a class="dropdown-item" href="#/en/?id=basic" >LAN</a>
-        <a class="dropdown-item" href="#/en/?id=gray" >NODE</a>
-        <a class="dropdown-item" href="#/en/?id=fire" >BTC</a>
-        <a class="dropdown-item" href="#/en/?id=m5stickc" >PLC</a>
-        <a class="dropdown-item" href="#/en/?id=m5stick" >Core BOTTOM</a>
-        <a class="dropdown-item" href="#/en/?id=m5go-lite" >M5GO BOTTOM</a>
-        <a class="dropdown-item" href="#/en/?id=m5go-kit" >M5GO RFID</a>
-        <a class="dropdown-item" href="#/en/?id=faces-kit" >M5GO CHARGER</a>
-        <a class="dropdown-item" href="#/en/?id=basic" >PM2.5</a>
-        <a class="dropdown-item" href="#/en/?id=gray" >BASE15</a>
-        <a class="dropdown-item" href="#/en/?id=fire" >BASE26</a>
+            <div style="margin-left:20px">
+                <a class="dropdown-item" href="#/en/base/lan_base" >LAN</a>
+                <a class="dropdown-item" href="#/en/base/node_base" >NODE</a>
+                <a class="dropdown-item" href="#/en/base/btc_base" >BTC</a>
+                <a class="dropdown-item" href="#/en/base/plc_base" >PLC</a>
+                <a class="dropdown-item" href="#/en/base/core_bottom" >Core BOTTOM</a>
+                <a class="dropdown-item" href="#/en/base/m5go_bottom" >M5GO BOTTOM</a>
+                <a class="dropdown-item" href="#/en/base/m5go_rfid" >M5GO RFID</a>
+                <a class="dropdown-item" href="#/en/base/m5go_charger" >M5GO CHARGER</a>
+                <a class="dropdown-item" href="#/en/base/pm2.5" >PM2.5</a>
+                <a class="dropdown-item" href="#/en/base/base15" >BASE15</a>
+                <a class="dropdown-item" href="#/en/base/base26" >BASE26</a>
+            </div>
         </div>
     </div>
     <div class="btn-group">
@@ -87,43 +91,125 @@
         Unit
         </button>
         <div class="dropdown-menu" style="margin-left:45px ; margin-top:-100px ; width:40px">
-        <a class="dropdown-item" href="#/en/?id=m5go-kit" >ANGLE</a>
-        <a class="nav-link" data-bind="event" href="#" data-toggle="collapse" data-target="#camera" > Camera </a>
-        <div id="camera" class="collapse">
-            <div class="container" style="margin:10px">
-                <div class="btn-group-vertical">
-                    <a class="dropdown-item" href="#/en/?id=basic" >ESP32CAM</a>
-                    <a class="dropdown-item" href="#/en/?id=gray" >M5Camera</a>
-                    <a class="dropdown-item" href="#/en/?id=fire" >M5CameraF</a>
-                    <a class="dropdown-item" href="#/en/?id=m5stickc" >M5CameraX</a>
+            <div style="margin-left:20px">
+            <div data-bind="leave1">
+                <a class="nav-link" data-bind="event" href="#" data-toggle="collapse" data-target="#camera" > Camera </a>
+                <div id="camera" class="collapse">
+                    <div class="container" style="margin:10px">
+                        <div class="btn-group-vertical">
+                            <a href="#/en/unit/esp32cam" >ESP32CAM</a>
+                            <a href="#/en/unit/m5camera" >M5Camera</a>
+                            <a href="#/en/unit/m5camera_f" >M5CameraF</a>
+                            <a href="#/en/unit/m5camera_x" >M5CameraX</a>
+                        </div>
+                    </div>
                 </div>
             </div>
-        </div>
-        <a class="nav-link" data-bind="event" href="#" data-toggle="collapse" data-target="#sensor" > Sensor </a>
-        <div id="sensor" class="collapse">
-            <div class="container" style="margin:10px">
-                <div class="btn-group-vertical">
-                    <a class="dropdown-item" href="#/en/?id=m5stick" >ENV</a>
-                    <a class="dropdown-item" href="#/en/?id=m5go-lite" >EARTH</a>
-                    <a class="dropdown-item" href="#/en/?id=m5go-kit" >LIGHT</a>
-                    <a class="dropdown-item" href="#/en/?id=faces-kit" >PIR</a>
-                    <a class="dropdown-item" href="#/en/?id=basic" >NCIR</a>
-                    <a class="dropdown-item" href="#/en/?id=gray" >THERMAL</a>
-                    <a class="dropdown-item" href="#/en/?id=fire" >COLOR</a>
-                    <a class="dropdown-item" href="#/en/?id=m5stickc" >TOF</a>
-                    <a class="dropdown-item" href="#/en/?id=m5stick" >HEART</a>
-                    <a class="dropdown-item" href="#/en/?id=m5go-lite" >ADC</a>
-                    <a class="dropdown-item" href="#/en/?id=m5go-kit" >MAKEY</a>
-                    <a class="dropdown-item" href="#/en/?id=faces-kit" >GPS</a>
-                    <a class="dropdown-item" href="#/en/?id=basic" >FINGER</a>
-                    <a class="dropdown-item" href="#/en/?id=gray" >WEIGHT</a>
-                    <a class="dropdown-item" href="#/en/?id=fire" >TRACE</a>
-                    <a class="dropdown-item" href="#/en/?id=m5stickc" >ACCEL</a>
-                    <a class="dropdown-item" href="#/en/?id=m5stick" >OP.90</a>
-                    <a class="dropdown-item" href="#/en/?id=m5go-lite" >OP.180</a>
+            <div data-bind="leave1">
+                <a class="nav-link" data-bind="event" href="#" data-toggle="collapse" data-target="#sensor" > Sensor </a>
+                <div id="sensor" class="collapse">
+                    <div class="container" style="margin:10px">
+                        <div class="btn-group-vertical">
+                            <a href="#/en/unit/env" >ENV</a>
+                            <a href="#/en/unit/earth" >EARTH</a>
+                            <a href="#/en/unit/light" >LIGHT</a>
+                            <a href="#/en/unit/pir" >PIR</a>
+                            <a href="#/en/unit/ncir" >NCIR</a>
+                            <a href="#/en/unit/thermal" >THERMAL</a>
+                            <a href="#/en/unit/color" >COLOR</a>
+                            <a href="#/en/unit/tof" >TOF</a>
+                            <a href="#/en/unit/heart" >HEART</a>
+                            <a href="#/en/unit/adc" >ADC</a>
+                            <a href="#/en/unit/makey" >MAKEY</a>
+                            <a href="#/en/unit/gps" >GPS</a>
+                            <a href="#/en/unit/finger" >FINGER</a>
+                            <a href="#/en/unit/weight" >WEIGHT</a>
+                            <a href="#/en/unit/trace" >TRACE</a>
+                            <a href="#/en/unit/accel" >ACCEL</a>
+                            <a href="#/en/unit/op90" >OP.90</a>
+                            <a href="#/en/unit/op180" >OP.180</a>
+                        </div>
+                    </div>
                 </div>
             </div>
-        </div>
+            <div data-bind="leave1">
+                <a class="nav-link" data-bind="event" href="#" data-toggle="collapse" data-target="#hmi" > HMI </a>
+                <div id="hmi" class="collapse">
+                    <div class="container" style="margin:10px">
+                        <div class="btn-group-vertical">
+                            <a href="#/en/unit/angle" >ANGLE</a>
+                            <a href="#/en/unit/button" >BUTTON</a>
+                            <a href="#/en/unit/dual_button" >Dual-BUTTON</a>
+                            <a href="#/en/unit/joystick" >JOYSTICK</a>
+                            <a href="#/en/unit/cardkb" >CardKB</a>
+                        </div>
+                    </div>
+                </div>
+            </div>
+            <div data-bind="leave1">
+                <a class="nav-link" data-bind="event" href="#" data-toggle="collapse" data-target="#io" > I/O </a>
+                <div id="io" class="collapse">
+                    <div class="container" style="margin:10px">
+                        <div class="btn-group-vertical">
+                            <a href="#/en/unit/extio" >EXT.IO</a>
+                            <a href="#/en/unit/dac" >DAC</a>
+                            <a href="#/en/unit/relay" >RELAY</a>
+                            <a href="#/en/unit/hub" >HUB</a>
+                            <a href="#/en/unit/pahub" >PaHUB</a>
+                            <a href="#/en/unit/pbhub" >PbHUB</a>
+                            <a href="#/en/unit/relay" >RELAY</a>
+                            <a href="#/en/unit/396port" >3.96Port</a>
+                            <a href="#/en/unit/m5-bit" >M5:bit</a>
+                            <a href="#/en/unit/proto" >PROTO</a>
+                            <a href="#/en/unit/unit_fan" >FAN</a>
+                            <a href="#/en/unit/vibrator" >Vibrator-Motor</a>
+                        </div>
+                    </div>
+                </div>
+            </div>
+            <div data-bind="leave1">
+                <a class="nav-link" data-bind="event" href="#" data-toggle="collapse" data-target="#communication" > Communication </a>
+                <div id="communication" class="collapse">
+                    <div class="container" style="margin:10px">
+                        <div class="btn-group-vertical">
+                            <a href="#/en/unit/ir" >IR</a>
+                            <a href="#/en/unit/rs485" >RS485</a>
+                            <a href="#/en/unit/rfid" >RFID</a>
+                        </div>
+                    </div>
+                </div>
+            </div>
+            <div data-bind="leave1">
+                <a class="nav-link" data-bind="event" href="#" data-toggle="collapse" data-target="#c-hat" > C-HAT </a>
+                <div id="c-hat" class="collapse">
+                    <div class="container" style="margin:10px">
+                        <div class="btn-group-vertical">
+                            <a href="#/en/hat/hat-env" >ENV</a>
+                            <a href="#/en/hat/hat-pir" >PIR</a>
+                            <a href="#/en/hat/hat-spk" >SPK</a>
+                            <a href="#/en/hat/hat-proto" >PROTO</a>
+                            <a href="#/en/hat/hat-ncir" >NCIR</a>
+                            <a href="#/en/hat/hat-thermal" >Thermal</a>
+                        </div>
+                    </div>
+                </div>
+            </div>
+            <div data-bind="leave1">
+                <a class="nav-link" data-bind="event" href="#" data-toggle="collapse" data-target="#visual" > Visual </a>
+                <div id="visual" class="collapse">
+                    <div class="container" style="margin:10px">
+                        <div class="btn-group-vertical">
+                            <a href="#/en/unit/neopixel" >RGB LED</a>
+                            <a href="#/en/unit/catear" >CatEar</a>
+                            <a href="#/en/unit/hex" >HEX</a>
+                            <a href="#/en/unit/neoflash" >NeoFlash</a>
+                            <a href="#/en/unit/butterfly" >BUTTERFLY</a>
+                            <a href="#/en/unit/rgb" >RGB</a>
+                        </div>
+                    </div>
+                </div>
+            </div>  
+            </div>
         </div>
     </div>
     <div class="btn-group">
@@ -131,11 +217,13 @@
         Application
         </button>
         <div class="dropdown-menu" style="margin-left:45px ; margin-top:-10px ; width:40px">
-        <a class="dropdown-item" href="#/en/?id=basic" >BALA</a>
-        <a class="dropdown-item" href="#/en/?id=gray" >LidarBOT</a>
-        <a class="dropdown-item" href="#/en/?id=fire" >PIANO</a>
-        <a class="dropdown-item" href="#/en/?id=m5stickc" >FLIR</a>
-        <a class="dropdown-item" href="#/en/?id=m5stick" >Demo Board</a>
+        <div style="margin-left:20px">
+            <a class="dropdown-item" href="#/en/app/bala" >BALA</a>
+            <a class="dropdown-item" href="#/en/app/lidarbot" >LidarBOT</a>
+            <a class="dropdown-item" href="#/en/app/piano" >PIANO</a>
+            <a class="dropdown-item" href="#/en/app/flir" >FLIR</a>
+            <a class="dropdown-item" href="#/en/app/demo-board" >Demo Board</a>
+        </div>
         </div>
     </div>
         <div class="btn-group">
@@ -143,12 +231,14 @@
         Accessory
         </button>
         <div class="dropdown-menu" style="margin-left:45px ; margin-top:-10px ; width:40px">
-        <a class="dropdown-item" href="#/en/?id=basic" >Grove-T</a>
-        <a class="dropdown-item" href="#/en/?id=gray" >Grove Cable</a>
-        <a class="dropdown-item" href="#/en/?id=fire" >GROVE2GROVE</a>
-        <a class="dropdown-item" href="#/en/?id=m5stickc" >SCREW</a>
-        <a class="dropdown-item" href="#/en/?id=m5stick" >BUS-Socket</a>
-        <a class="dropdown-item" href="#/en/?id=fire" >Frame</a>
+        <div style="margin-left:20px">
+            <a class="dropdown-item" href="#/en/accessory/converter/grove_t" >Grove-T</a>
+            <a class="dropdown-item" href="#/en/accessory/cable/grove_cable" >Grove Cable</a>
+            <a class="dropdown-item" href="#/en/accessory/converter/grove2grove" >GROVE2GROVE</a>
+            <a class="dropdown-item" href="#/en/accessory/screw" >SCREW</a>
+            <a class="dropdown-item" href="#/en/accessory/bus_socket" >BUS-Socket</a>
+            <a class="dropdown-item" href="#/en/accessory/frame" >Frame</a>
+        </div>
         </div>
     </div>
     <div class="btn-group">
@@ -156,10 +246,12 @@
          Aluminium Profile
         </button>
         <div class="dropdown-menu" style="margin-left:45px ; margin-top:-10px ; width:40px">
-        <a class="dropdown-item" href="#/en/?id=basic" >CORNER</a>
-        <a class="dropdown-item" href="#/en/?id=gray" >NUT</a>
-        <a class="dropdown-item" href="#/en/?id=fire" >Connector</a>
-        <a class="dropdown-item" href="#/en/?id=m5stickc" >Aluminium-Profile</a>
+        <div style="margin-left:20px">
+            <a class="dropdown-item" href="#/en/1515/corner" >CORNER</a>
+            <a class="dropdown-item" href="#/en/1515/nut" >NUT</a>
+            <a class="dropdown-item" href="#/en/1515/connectors" >Connector</a>
+            <a class="dropdown-item" href="#/en/1515/ap" >Aluminium-Profile</a>
+        </div>
         </div>
     </div>
     <div class="btn-group">
@@ -167,8 +259,10 @@
          Tools
         </button>
         <div class="dropdown-menu" style="margin-left:45px ; margin-top:-10px ; width:40px">
-        <a class="dropdown-item" href="#" >USB Downloader</a>
-        <a class="dropdown-item" href="#" >USB-ISP</a>
+        <div style="margin-left:20px">
+            <a class="dropdown-item" href="#/en/tool/usb_downloader" >USB Downloader</a>
+            <a class="dropdown-item" href="#/en/tool/usb_isp" >USB-ISP</a>
+        </div>   
         </div>
     </div>
   </div>
@@ -176,9 +270,9 @@
 </div>
 
 
-<a class="nav-link" href="/#/en/faq">> Arduino API</a>
-<a class="nav-link" href="#">> M5Stack Cases</a>
-<a class="nav-link" href="#">> Related Documents</a>
+<a class="nav-link" href="#/en/api">> Arduino API</a>
+<a class="nav-link" href="#/en/case">> M5Stack Cases</a>
+<a class="nav-link" href="#/en/related_documents">> Related Documents</a>
 <a class="nav-link" href="#/en/faq">> FAQ</a>
 </div>
 
@@ -190,4 +284,4 @@
 - <a href="https://m5stack.com/"><img src="https://docs.m5stack.com/assets/img/favicon.ico" width=16px/>M5Stack</a>
 - [![Github](https://icongram.jgog.in/simple/github.svg?color=808080&size=16)Github](https://github.com/m5stack)
 - [![Twitter](https://icongram.jgog.in/simple/twitter.svg?colored&size=16)@M5Stack](http://twitter.com/M5Stack)
-- [![Facebook](https://icongram.jgog.in/simple/facebook.svg?colored&size=16)@M5Stack](https://www.facebook.com/M5Stack) -->
+- [![Facebook](https://icongram.jgog.in/simple/facebook.svg?colored&size=16)@M5Stack](https://www.facebook.com/M5Stack)
\ No newline at end of file
diff --git a/docs/zh_CN/faq.md b/docs/zh_CN/faq.md
index 5f89d172..2c4bbc55 100644
--- a/docs/zh_CN/faq.md
+++ b/docs/zh_CN/faq.md
@@ -109,7 +109,8 @@
   <button type="button" class="btn btn-primary" data-toggle="collapse" data-target="#Q9">answer</button>
   <div id="Q9" class="collapse">
     <img src="assets/img/faq/m5stickc_05.jpg" width="50%" height="50%">
-    以下操作能够使设备恢复正常：1，将G0短接到3V3。 2.插入USB线。 3，屏幕亮起后停止短接，USB继续为设备充电. 
+
+  以下操作能够使设备恢复正常：1，将G0短接到3V3。 2.插入USB线。 3，屏幕亮起后停止短接，USB继续为设备充电. 
   </div>
 </div>
 
diff --git a/docs/zh_CN/hat/hat-ncir.md b/docs/zh_CN/hat/hat-ncir.md
index 3f7e63d9..6db5015c 100644
--- a/docs/zh_CN/hat/hat-ncir.md
+++ b/docs/zh_CN/hat/hat-ncir.md
@@ -48,7 +48,7 @@ IIC（0x5A）
 
 <img src="https://m5stack.oss-cn-shenzhen.aliyuncs.com/image/EasyLoader_logo.png" width="100px" style="margin-top:20px">
 
-<a href="https://m5stack.oss-cn-shenzhen.aliyuncs.com/EasyLoader/HAT/SPEAKER/EasyLoader_StickC_HAT_SPK.exe"><button type="button" class="btn btn-primary">点击下载EasyLoader</button></a>
+<a href="https://m5stack.oss-cn-shenzhen.aliyuncs.com/EasyLoader/HAT/NCIR/EasyLoader_StickC_HAT_NCIR.exe"><button type="button" class="btn btn-primary">点击下载EasyLoader</button></a>
 
 >1.EasyLoader是一个简洁快速的程序烧录器，每一个产品页面里的EasyLoader都提供了一个与产品相关的案例程序.
 
@@ -59,4 +59,11 @@ IIC（0x5A）
 <table>
  <tr><td>M5StickC</td><td>GPIO0</td><td>GPIO26</td><td>3.3V</td><td>GND</td></tr>
  <tr><td>HAT NCIR</td><td>SDA</td><td>SCL</td><td>3.3V</td><td>GND</td></tr>
-</table>
\ No newline at end of file
+</table>
+
+
+## 相关视频
+
+<video width="500" height="315" controls>
+    <source src="https://m5stack.oss-cn-shenzhen.aliyuncs.com/video/Product_example_video/HAT/NCIR-HAT.mp4" type="video/mp4">
+</video>
diff --git a/docs/zh_CN/hat/hat-proto.md b/docs/zh_CN/hat/hat-proto.md
index 5f13c92c..45f9675c 100644
--- a/docs/zh_CN/hat/hat-proto.md
+++ b/docs/zh_CN/hat/hat-proto.md
@@ -21,9 +21,6 @@
 
 - 1x PROTO Hat
 
-## 应用
-
-- MP4/MP3
 
 ## 原理图
 
@@ -38,3 +35,8 @@
 - **[官方论坛](http://forum.m5stack.com/)**
 
 
+## 相关视频
+
+<video width="500" height="315" controls>
+    <source src="https://m5stack.oss-cn-shenzhen.aliyuncs.com/video/Product_example_video/HAT/PROTO-HAT.mp4" type="video/mp4">
+</video>
\ No newline at end of file
diff --git a/docs/zh_CN/hat/hat-thermal.md b/docs/zh_CN/hat/hat-thermal.md
index 8a5dc30d..9c3ba994 100644
--- a/docs/zh_CN/hat/hat-thermal.md
+++ b/docs/zh_CN/hat/hat-thermal.md
@@ -48,21 +48,28 @@
 
 - **[官方论坛](http://forum.m5stack.com/)**
 
-- **[PAM8303 数据手册](https://pdf1.alldatasheet.com/datasheet-pdf/view/790820/DIODES/PAM8303C.html)**
+- **[MLX90640 数据手册](https://github.com/m5stack/M5-Schematic/blob/master/datasheet/MLX90640-Datasheet-Melexis.pdf)**
 
-<!-- ## EasyLoader
+## EasyLoader
 
 <img src="https://m5stack.oss-cn-shenzhen.aliyuncs.com/image/EasyLoader_logo.png" width="100px" style="margin-top:20px">
 
-<a href="https://m5stack.oss-cn-shenzhen.aliyuncs.com/EasyLoader/HAT/SPEAKER/EasyLoader_StickC_HAT_SPK.exe"><button type="button" class="btn btn-primary">点击下载EasyLoader</button></a>
+<a href="https://m5stack.oss-cn-shenzhen.aliyuncs.com/EasyLoader/HAT/THERMAL/EasyLoader_StickC_HAT_THERMAL.exe"><button type="button" class="btn btn-primary">点击下载EasyLoader</button></a>
 
 >1.EasyLoader是一个简洁快速的程序烧录器，每一个产品页面里的EasyLoader都提供了一个与产品相关的案例程序.
 
->2.下载软件后，双击运行应用程序，将M5设备通过数据线连接至电脑,选择端口参数，点击 **"Burn"** 即可开始烧录 -->
+>2.下载软件后，双击运行应用程序，将M5设备通过数据线连接至电脑,选择端口参数，点击 **"Burn"** 即可开始烧录
 
 ### 管脚映射
 
 <table>
  <tr><td>M5StickC</td><td>GPIO0</td><td>GPIO26</td><td>3.3V</td><td>GND</td></tr>
  <tr><td>HAT Thermal</td><td>SDA</td><td>SCL-</td><td>3.3V</td><td>GND</td></tr>
-</table>
\ No newline at end of file
+</table>
+
+
+## 相关视频
+
+<video width="500" height="315" controls>
+    <source src="https://m5stack.oss-cn-shenzhen.aliyuncs.com/video/Product_example_video/HAT/THERMAL-HAT.mp4" type="video/mp4">
+</video>
\ No newline at end of file
diff --git a/docs/zh_CN/sidebar.md b/docs/zh_CN/sidebar.md
index 376011cd..c7a35123 100644
--- a/docs/zh_CN/sidebar.md
+++ b/docs/zh_CN/sidebar.md
@@ -1,8 +1,273 @@
-- [产品列表](zh_CN/)
+<!-- - [产品列表](zh_CN/)
 - [Arduino API](zh_CN/api)
 - [M5Stack 案例](zh_CN/case)
 - [相关文档](zh_CN/related_documents)
-- [常见问题解答](zh_CN/faq)
+- [常见问题解答](zh_CN/faq) -->
+
+<div class="container">
+    <a class="nav-link" href="#" data-toggle="collapse" data-target="#Product">> 产品文档</a>
+<div id="Product" class="collapse">
+<div class="container" style="margin:10px">
+  <div class="btn-group-vertical">
+    <button type="button" class="btn btn-primary"><a href="#/zh_CN/" style="color:white;text-decoration:none;margin-left:-25px">产品列表</a></button>
+    <div class="btn-group">
+        <button type="button" class="btn btn-primary dropdown-toggle" data-toggle="dropdown">
+        Core
+        </button>
+        <div class="dropdown-menu" style="margin-left:45px ; margin-top:-10px">
+            <div style="margin-left:20px">
+                <a class="dropdown-item" href="#/zh_CN/core/basic">Basic</a>
+                <a class="dropdown-item" href="#/zh_CN/core/gray">GRAY</a>
+                <a class="dropdown-item" href="#/zh_CN/core/fire" >FIRE</a>
+                <a class="dropdown-item" href="#/zh_CN/core/m5stickc" >M5StickC</a>
+                <a class="dropdown-item" href="#/zh_CN/core/m5stick" >M5Stick</a>
+                <a class="dropdown-item" href="#/zh_CN/core/m5go_lite" >M5GO Lite</a>
+                <a class="dropdown-item" href="#/zh_CN/core/m5go" >M5GO Kit</a>
+                <a class="dropdown-item" href="#/zh_CN/core/face_kit" >FACES Kit</a>
+            </div>
+        </div>
+    </div>
+        <div class="btn-group">
+        <button type="button" class="btn btn-primary dropdown-toggle" data-toggle="dropdown">
+        Module
+        </button>
+        <div class="dropdown-menu" style="margin-left:45px ; margin-top:-10px">
+            <div style="margin-left:20px">
+                <a class="dropdown-item" href="#/zh_CN/module/gps" >GPS</a>
+                <a class="dropdown-item" href="#/zh_CN/module/lora" >LORA</a>
+                <a class="dropdown-item" href="#/zh_CN/module/lorawan" >LoRaWAN</a>
+                <a class="dropdown-item" href="#/zh_CN/module/sim800" >SIM800L</a>
+                <a class="dropdown-item" href="#/zh_CN/module/commu" >COMMU</a>
+                <a class="dropdown-item" href="#/zh_CN/module/battery" >BATTERY</a>
+                <a class="dropdown-item" href="#/zh_CN/module/proto" >PROTO</a>
+                <a class="dropdown-item" href="#/zh_CN/module/proto_kit" >PROTO-KIT</a>
+                <a class="dropdown-item" href="#/zh_CN/module/plus" >PLUS</a>
+                <a class="dropdown-item" href="#/zh_CN/module/usb" >USB</a>
+                <a class="dropdown-item" href="#/zh_CN/module/bus" >BUS</a>
+                <a class="dropdown-item" href="#/zh_CN/module/goplus" >GoPlus</a>
+                <a class="dropdown-item" href="#/zh_CN/module/stepmotor" >STEPMOTOR</a>
+                <a class="dropdown-item" href="#/zh_CN/module/servo" >SERVO</a>
+                <a class="dropdown-item" href="#/zh_CN/module/lego_plus" >LEGO+</a>
+                <a class="dropdown-item" href="#/zh_CN/module/fan" >FAN</a>
+                <a class="dropdown-item" href="#/zh_CN/module/encoder" >FACES-ENCODER</a>
+                <a class="dropdown-item" href="#/zh_CN/module/joystick" >FACES-JOYSTICK</a>
+                <a class="dropdown-item" href="#/zh_CN/module/faces_finger" >FACES-FINGER</a>
+                <a class="dropdown-item" href="#/zh_CN/module/faces_rfid" >FACES-RFID</a>
+            </div>
+        </div>
+    </div>
+    <div class="btn-group">
+        <button type="button" class="btn btn-primary dropdown-toggle" data-toggle="dropdown">
+        Base
+        </button>
+        <div class="dropdown-menu" style="margin-left:45px ; margin-top:-10px">
+            <div style="margin-left:20px">
+                <a class="dropdown-item" href="#/zh_CN/base/lan_base" >LAN</a>
+                <a class="dropdown-item" href="#/zh_CN/base/node_base" >NODE</a>
+                <a class="dropdown-item" href="#/zh_CN/base/btc_base" >BTC</a>
+                <a class="dropdown-item" href="#/zh_CN/base/plc_base" >PLC</a>
+                <a class="dropdown-item" href="#/zh_CN/base/core_bottom" >Core BOTTOM</a>
+                <a class="dropdown-item" href="#/zh_CN/base/m5go_bottom" >M5GO BOTTOM</a>
+                <a class="dropdown-item" href="#/zh_CN/base/m5go_rfid" >M5GO RFID</a>
+                <a class="dropdown-item" href="#/zh_CN/base/m5go_charger" >M5GO CHARGER</a>
+                <a class="dropdown-item" href="#/zh_CN/base/pm2.5" >PM2.5</a>
+                <a class="dropdown-item" href="#/zh_CN/base/base15" >BASE15</a>
+                <a class="dropdown-item" href="#/zh_CN/base/base26" >BASE26</a>
+            </div>
+        </div>
+    </div>
+    <div class="btn-group">
+        <button type="button" class="btn btn-primary dropdown-toggle" data-toggle="dropdown">
+        Unit
+        </button>
+        <div class="dropdown-menu" style="margin-left:45px ; margin-top:-100px ; width:40px">
+            <div style="margin-left:20px">
+            <div data-bind="leave1">
+                <a class="nav-link" data-bind="event" href="#" data-toggle="collapse" data-target="#camera" > Camera </a>
+                <div id="camera" class="collapse">
+                    <div class="container" style="margin:10px">
+                        <div class="btn-group-vertical">
+                            <a href="#/zh_CN/unit/esp32cam" >ESP32CAM</a>
+                            <a href="#/zh_CN/unit/m5camera" >M5Camera</a>
+                            <a href="#/zh_CN/unit/m5camera_f" >M5CameraF</a>
+                            <a href="#/zh_CN/unit/m5camera_x" >M5CameraX</a>
+                        </div>
+                    </div>
+                </div>
+            </div>
+            <div data-bind="leave1">
+                <a class="nav-link" data-bind="event" href="#" data-toggle="collapse" data-target="#sensor" > Sensor </a>
+                <div id="sensor" class="collapse">
+                    <div class="container" style="margin:10px">
+                        <div class="btn-group-vertical">
+                            <a href="#/zh_CN/unit/env" >ENV</a>
+                            <a href="#/zh_CN/unit/earth" >EARTH</a>
+                            <a href="#/zh_CN/unit/light" >LIGHT</a>
+                            <a href="#/zh_CN/unit/pir" >PIR</a>
+                            <a href="#/zh_CN/unit/ncir" >NCIR</a>
+                            <a href="#/zh_CN/unit/thermal" >THERMAL</a>
+                            <a href="#/zh_CN/unit/color" >COLOR</a>
+                            <a href="#/zh_CN/unit/tof" >TOF</a>
+                            <a href="#/zh_CN/unit/heart" >HEART</a>
+                            <a href="#/zh_CN/unit/adc" >ADC</a>
+                            <a href="#/zh_CN/unit/makey" >MAKEY</a>
+                            <a href="#/zh_CN/unit/gps" >GPS</a>
+                            <a href="#/zh_CN/unit/finger" >FINGER</a>
+                            <a href="#/zh_CN/unit/weight" >WEIGHT</a>
+                            <a href="#/zh_CN/unit/trace" >TRACE</a>
+                            <a href="#/zh_CN/unit/accel" >ACCEL</a>
+                            <a href="#/zh_CN/unit/op90" >OP.90</a>
+                            <a href="#/zh_CN/unit/op180" >OP.180</a>
+                        </div>
+                    </div>
+                </div>
+            </div>
+            <div data-bind="leave1">
+                <a class="nav-link" data-bind="event" href="#" data-toggle="collapse" data-target="#hmi" > HMI </a>
+                <div id="hmi" class="collapse">
+                    <div class="container" style="margin:10px">
+                        <div class="btn-group-vertical">
+                            <a href="#/zh_CN/unit/angle" >ANGLE</a>
+                            <a href="#/zh_CN/unit/button" >BUTTON</a>
+                            <a href="#/zh_CN/unit/dual_button" >Dual-BUTTON</a>
+                            <a href="#/zh_CN/unit/joystick" >JOYSTICK</a>
+                            <a href="#/zh_CN/unit/cardkb" >CardKB</a>
+                        </div>
+                    </div>
+                </div>
+            </div>
+            <div data-bind="leave1">
+                <a class="nav-link" data-bind="event" href="#" data-toggle="collapse" data-target="#io" > I/O </a>
+                <div id="io" class="collapse">
+                    <div class="container" style="margin:10px">
+                        <div class="btn-group-vertical">
+                            <a href="#/zh_CN/unit/extio" >EXT.IO</a>
+                            <a href="#/zh_CN/unit/dac" >DAC</a>
+                            <a href="#/zh_CN/unit/relay" >RELAY</a>
+                            <a href="#/zh_CN/unit/hub" >HUB</a>
+                            <a href="#/zh_CN/unit/pahub" >PaHUB</a>
+                            <a href="#/zh_CN/unit/pbhub" >PbHUB</a>
+                            <a href="#/zh_CN/unit/relay" >RELAY</a>
+                            <a href="#/zh_CN/unit/396port" >3.96Port</a>
+                            <a href="#/zh_CN/unit/m5-bit" >M5:bit</a>
+                            <a href="#/zh_CN/unit/proto" >PROTO</a>
+                            <a href="#/zh_CN/unit/unit_fan" >FAN</a>
+                            <a href="#/zh_CN/unit/vibrator" >Vibrator-Motor</a>
+                        </div>
+                    </div>
+                </div>
+            </div>
+            <div data-bind="leave1">
+                <a class="nav-link" data-bind="event" href="#" data-toggle="collapse" data-target="#communication" > Communication </a>
+                <div id="communication" class="collapse">
+                    <div class="container" style="margin:10px">
+                        <div class="btn-group-vertical">
+                            <a href="#/zh_CN/unit/ir" >IR</a>
+                            <a href="#/zh_CN/unit/rs485" >RS485</a>
+                            <a href="#/zh_CN/unit/rfid" >RFID</a>
+                        </div>
+                    </div>
+                </div>
+            </div>
+            <div data-bind="leave1">
+                <a class="nav-link" data-bind="event" href="#" data-toggle="collapse" data-target="#c-hat" > C-HAT </a>
+                <div id="c-hat" class="collapse">
+                    <div class="container" style="margin:10px">
+                        <div class="btn-group-vertical">
+                            <a href="#/zh_CN/hat/hat-env" >ENV</a>
+                            <a href="#/zh_CN/hat/hat-pir" >PIR</a>
+                            <a href="#/zh_CN/hat/hat-spk" >SPK</a>
+                            <a href="#/zh_CN/hat/hat-proto" >PROTO</a>
+                            <a href="#/zh_CN/hat/hat-ncir" >NCIR</a>
+                            <a href="#/zh_CN/hat/hat-thermal" >Thermal</a>
+                        </div>
+                    </div>
+                </div>
+            </div>
+            <div data-bind="leave1">
+                <a class="nav-link" data-bind="event" href="#" data-toggle="collapse" data-target="#visual" > Visual </a>
+                <div id="visual" class="collapse">
+                    <div class="container" style="margin:10px">
+                        <div class="btn-group-vertical">
+                            <a href="#/zh_CN/unit/neopixel" >RGB LED</a>
+                            <a href="#/zh_CN/unit/catear" >CatEar</a>
+                            <a href="#/zh_CN/unit/hex" >HEX</a>
+                            <a href="#/zh_CN/unit/neoflash" >NeoFlash</a>
+                            <a href="#/zh_CN/unit/butterfly" >BUTTERFLY</a>
+                            <a href="#/zh_CN/unit/rgb" >RGB</a>
+                        </div>
+                    </div>
+                </div>
+            </div>  
+            </div>
+        </div>
+    </div>
+    <div class="btn-group">
+        <button type="button" class="btn btn-primary dropdown-toggle" data-toggle="dropdown">
+        Application
+        </button>
+        <div class="dropdown-menu" style="margin-left:45px ; margin-top:-10px ; width:40px">
+        <div style="margin-left:20px">
+            <a class="dropdown-item" href="#/zh_CN/app/bala" >BALA</a>
+            <a class="dropdown-item" href="#/zh_CN/app/lidarbot" >LidarBOT</a>
+            <a class="dropdown-item" href="#/zh_CN/app/piano" >PIANO</a>
+            <a class="dropdown-item" href="#/zh_CN/app/flir" >FLIR</a>
+            <a class="dropdown-item" href="#/zh_CN/app/demo-board" >Demo Board</a>
+        </div>
+        </div>
+    </div>
+        <div class="btn-group">
+        <button type="button" class="btn btn-primary dropdown-toggle" data-toggle="dropdown">
+        Accessory
+        </button>
+        <div class="dropdown-menu" style="margin-left:45px ; margin-top:-10px ; width:40px">
+        <div style="margin-left:20px">
+            <a class="dropdown-item" href="#/zh_CN/accessory/converter/grove_t" >Grove-T</a>
+            <a class="dropdown-item" href="#/zh_CN/accessory/cable/grove_cable" >Grove Cable</a>
+            <a class="dropdown-item" href="#/zh_CN/accessory/converter/grove2grove" >GROVE2GROVE</a>
+            <a class="dropdown-item" href="#/zh_CN/accessory/screw" >SCREW</a>
+            <a class="dropdown-item" href="#/zh_CN/accessory/bus_socket" >BUS-Socket</a>
+            <a class="dropdown-item" href="#/zh_CN/accessory/frame" >Frame</a>
+        </div>
+        </div>
+    </div>
+    <div class="btn-group">
+        <button type="button" class="btn btn-primary dropdown-toggle" data-toggle="dropdown">
+         Aluminium Profile
+        </button>
+        <div class="dropdown-menu" style="margin-left:45px ; margin-top:-10px ; width:40px">
+        <div style="margin-left:20px">
+            <a class="dropdown-item" href="#/zh_CN/1515/corner" >CORNER</a>
+            <a class="dropdown-item" href="#/zh_CN/1515/nut" >NUT</a>
+            <a class="dropdown-item" href="#/zh_CN/1515/connectors" >Connector</a>
+            <a class="dropdown-item" href="#/zh_CN/1515/ap" >Aluminium-Profile</a>
+        </div>
+        </div>
+    </div>
+    <div class="btn-group">
+        <button type="button" class="btn btn-primary dropdown-toggle" data-toggle="dropdown">
+         Tools
+        </button>
+        <div class="dropdown-menu" style="margin-left:45px ; margin-top:-10px ; width:40px">
+        <div style="margin-left:20px">
+            <a class="dropdown-item" href="#/zh_CN/tool/usb_downloader" >USB Downloader</a>
+            <a class="dropdown-item" href="#/zh_CN/tool/usb_isp" >USB-ISP</a>
+        </div>   
+        </div>
+    </div>
+  </div>
+</div>
+</div>
+
+
+<a class="nav-link" href="#/zh_CN/api">> Arduino API</a>
+<a class="nav-link" href="#/zh_CN/case">> M5Stack 案例</a>
+<a class="nav-link" href="#/zh_CN/related_documents">> 相关文档</a>
+<a class="nav-link" href="#/zh_CN/faq">> 常见问题解答</a>
+</div>
+
+
+
 
 
 - **Links**
diff --git a/docs/zh_CN/unit/accel.md b/docs/zh_CN/unit/accel.md
index 4d25ea8a..bcfec5b3 100644
--- a/docs/zh_CN/unit/accel.md
+++ b/docs/zh_CN/unit/accel.md
@@ -4,7 +4,7 @@
 
 ***
 
-:memo:**[描述](#描述)**&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;:octocat:**[例程](#例程)**&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; :electric_plug:**[原理图](#原理图)** &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;🛒**[购买链接](https://m5stack.com/collections/m5-unit/products/3-axis-analog-accelerometer-unitadx345)**&nbsp;&nbsp;&nbsp;<img src="https://m5stack.oss-cn-shenzhen.aliyuncs.com/image/EasyLoader_logo-min.jpg">**[EasyLoader](#EasyLoader)**
+:memo:**[描述](#描述)**&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;:octocat:**[例程](#例程)**&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; :electric_plug:**[原理图](#原理图)** &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;🛒**[购买链接](https://m5stack.com/products/3-axis-digital-accelerometer-unit-adxl345)**&nbsp;&nbsp;&nbsp;<img src="https://m5stack.oss-cn-shenzhen.aliyuncs.com/image/EasyLoader_logo-min.jpg">**[EasyLoader](#EasyLoader)**
 
 ## 描述