會使用 Google form 是因為在做簡易的網站時，如果需要聯絡我們之類的表單，又不想要麻煩工程師，那麼使用 Google form 會是一個很方便的方式。

會知道這個方式是三、四年前跟厲害的 ijs 大大聊天時，她提到可以拆 Google form 下來用，不過因為只有拆解 Google form 這幾個關鍵字，我回家之後馬上實驗，發現真的滿實用，而且表單樣式可以自訂。（ps.了解基本的 form 架構，你也可以自己拆解任何表單來實驗唷～）

製作流程

到 Google 雲端

• 新增 > Google表單
  

• 編輯完後 上面有一個回覆 > 選取回應目的地
  

• 選擇 建立新試算表 > 建立，有建立回應表，才能看到之後的回覆，不用再重找一次
  

• 然後點選右下角的問號，選擇“返回舊表單”
  

• 在舊表單的右上方有個 “查看即時表單”
  

• 點下後可以看到一頁已完成的表單頁面，打開開發者模式複製整個form
  <div class="ss-form"><form>到</form></div>

• 貼到編輯器裡，另存新檔，在 <div class="ss-form"> 與 <form> 之間插入下方的 iframe 這個 iframe 是用來跳轉 Google 表單送出後前往的頁面。 權杖名稱請自訂6~8碼英文，例如：itthirty

<iframe name="iframe_權杖名稱" id="iframe_權杖名稱" style="display:none;" onload="if(typeof sent_權杖名稱!='undefined'){window.location='form.html';}"></iframe>

• 將 form tag 部分改寫

  • target="iframe_權杖名稱" //權杖名稱就是上面自取的
  • onsubmit="sent_權杖名稱=true"

• 這時候打開表單已經可以填寫資料寄出，但是送出後會跳轉到google預設畫面，如果想停留在原本頁面的話，可以在 <iframe> 後面再加上 {window.location='原本頁面.html';}

• 當網頁是一頁式，想要在送出表單後跳到特定位置，手機版會有bug，可以在上方的原始碼加上 location.reload(); 就能解決這個問題。

{window.location='index.html#contact'; location.reload();}

• 解決完原始碼，接下來就可以自行為表單加上設計囉～

溫馨小提醒，因為 Google 舊表單的建立已經慢慢被 Google 棄用，所以前面在建立表單時要使用新表單建立再轉回舊表單去複製原始碼，不過不確定哪一天 Google 會完全砍掉舊表單，所以大家可以開始研究新表單怎麼拆解使用了XD

以上是今天的 Google 表單使用的介紹，各位看倌明天見囉～

參考資料：
https://stackoverflow.com/questions/6077054/old-google-form-redirect-after-submission