!change config var name to snake

1. 設定檔統一為蛇底式命名
2. 外掛內取用依照 JS 慣例用小駝峰命名
3. colorschema 預設改成 light

README.md

@@ -24,11 +24,11 @@ fb_comments:
 ```yml
 fb_comments:
   enabled: true  # 是否開啟 FB 留言外掛
-  appId:   # FB 應用程式編號
+  app_id:   # FB 應用程式編號
   lang: zh_TW  # 語言
-  numPosts: 5  # 顯示幾則留言
+  num_posts: 5  # 顯示幾則留言
   order_by: reverse-time  # 留言排序依據，有 time 和 reverse-time
-  colorscheme: dark  # 介面風格，有 light 和 dark 可選
+  colorscheme: light  # 介面風格，有 light 和 dark 可選
   width: 100%  # 寬度
 ```
 

index.js

@@ -11,9 +11,9 @@ function initConfig() {
     return false;
 
   _config.lang = _config.lang || 'zh_TW';
-  _config.numPosts = _config.numPosts || 5;
-  _config.order_by = _config.order_by || 'reverse-time';
-  _config.colorscheme = _config.colorscheme || 'dark';
+  _config.numPosts = _config.num_posts || 5;
+  _config.orderBy = _config.order_by || 'reverse-time';
+  _config.colorscheme = _config.colorscheme || 'light';
   _config.width = _config.width || '100%';
 
   return true;
@@ -24,7 +24,7 @@ function fbCommentsHead() {
   if (!initConfig()) return("");
 
   let html = `
-    <meta property="fb:app_id" content="${_config.appId}" />
+    <meta property="fb:app_id" content="${_config.app_id}" />
     <div id="fb-root"></div>
     <script async defer crossorigin="anonymous" src="https://connect.facebook.net/${_config.lang}/sdk.js#xfbml=1&version=v12.0"></script>
   `;
@@ -41,7 +41,7 @@ function fbComments(args, content) {
       data-href="${this.permalink}"
       data-width="${_config.width}"
       data-numposts="${_config.numPosts}"
-      data-order-by="${_config.order_by}"
+      data-order-by="${_config.orderBy}"
       data-colorscheme="${_config.colorscheme}"
     ></div>
   `;