如何將 Google Forms(表單)嵌入到 WordPress 網站?(簡單快速)

如何將 Google Forms(表單)嵌入到 WordPress 網站?(簡單快速)

這是一篇完整「 Google Forms WordPress 」教學,只要 2 步驟,即可快速完成將「 Google Forms (表單)嵌入至 WordPress 網站 」操作。

有些站長,只需要製作簡單的聯絡表單搜集訪客資料,不需表單擁有額外能力,那就可以考慮直接在 WordPress 網頁嵌入 Google Forms。更多 WordPress 表單外掛

Google Forms 是一個完全免費的表單服務,若是想在 WordPress 使用免費的表單功能,並且不在意網站出現 Google 標示,不妨使用看看!更多 Contact Form 7 表單教學

本篇文章,將會帶領大家,從 Google Forms 進行嵌入程式碼複製,並在 WordPress 頁面進行貼上,順利完成嵌入,完全不需有程式碼基礎,聽起來是不是很簡單呢?

準備好的話,我們就開始吧!

如何將 Google Forms(表單)嵌入到 WordPress 網站?(簡單快速)影片學習:

如何將 Google Forms(表單)嵌入到 WordPress 網站?(簡單快速)影片學習:

1. 前往 Google Form,複製嵌入碼

首先,我們點擊以下按鈕,前往 Google Forms 服務

Step 1:創建 / 編輯表單

進入 Google Forms 頁面,我們可以選擇新增一份表單,也可以直接點擊想嵌入 WordPress 頁面的現有表單。

Google Forms WordPress 教學:點擊現有表單,或是新增表單

不論是選擇編輯表單,或是新增表單,都會進入單一表單頁面,我們可以在這邊編輯 / 新增問題,詳細如下圖。

Google Forms WordPress 教學:編輯 / 新增 Google Forms 問題

小提醒:詳細新增 Google Forms 表單問題流程、變更表單顏色等 .. 操作,可參考 Google 官方教學,製作完整表單唷:)

Step 2:開啟填寫表單權限

新增好表單問題,切換至「 設定 」面板,這邊站長可針對表單權限進行設定。

要注意的是,若是使用機構 / 商業帳號,並且想讓非該機構的 Google 用戶填寫表單,需將「 僅限該機構使用者 」選項關閉!

Google Form WordPress:機構帳戶若想開放 Google 帳戶填寫表單,需關閉限制選項
機構帳戶若想開放 Google 帳戶填寫表單,需關閉限制選項

Step 3:複製表單短代碼

新增+設定好 Google 表單後,我們就可以來進行程式碼的複製啦!

找到並點擊最上方的「 傳送 」按鈕,切換到最右邊的「 HTML 」區塊,修改嵌入表單長寬(無特別需求,可先維持預設),最後複製表單嵌入碼。

點擊「 傳送 」,複製 HTML 程式碼

複製好代碼後,我們就可以前往 WordPress 網站,進行嵌入囉!


2. 回到 WordPress 網站,貼上嵌入碼

前往 WordPress 頁面 > 新增頁面,我們來使用區塊編輯器,新增聯絡頁面,並嵌入 Google Forms 表單。更多 新增 WordPress 頁面教學

進入新增頁面後,新增「 HTML 」小工具,貼上剛複製的表單嵌入碼,選擇發布 / 更新。

Google Form WordPress:新增 WordPress 頁面+「 HTML 」區塊小工具
Google Form WordPress:新增 WordPress 頁面+「 HTML 」區塊小工具

前往前台網站檢查,就會發現 Google Form WordPress,表單已經嵌入成功囉:)

成功將 Google Forms 嵌入至 WordPress 網站

至於,如果是使用頁面編輯器設計的網頁,同樣可以找到「 HTML 」、「 短碼 」等 .. 小工具,將 Google Form 短代碼貼上即可。更多 WordPress 最佳頁面編輯器

使用「 Google 表單 」可不用再額外安裝表單外掛,還能夠直接在後台收集填寫資料,匯出 Excel 檔案。

Google Form WordPress:後台可檢視完整表單資料,匯出 Excel 檔案
Google Form WordPress:後台可檢視完整表單資料,匯出 Excel 檔案

不過相對的,直接嵌入 Google Form 也會有:無法客製化表單樣式、缺少額外進階功能、出現 Google 圖標 等 .. 限制。

但對於想快速製作一份表單,並且不會長久使用的站長來說,在 WordPress 網站嵌入 Google Forms 是一個非常好的選擇。

不過若是想完整客製化 WordPress 表單,可能還是需要使用外掛,才能讓表單擁有更佳的能力。更多 最佳 WordPress 表單外掛

以上就是完整「 在 WordPress 網頁嵌入 Google 表單 」教學,是不是很簡單呢~


常見問題

Google Forms 是什麼?它是免費的嗎?

是的,Google Forms 是完全免費的,它是 Google 於 2008 年完成開發,並且完全免費的表單功能。

只要擁有一個 Google 帳戶,即可快速建立表單,新增各種問題,快速搜集+匯出資料,也能夠將表單嵌入在各式各樣的網頁:)

如何將 Google Forms 嵌入 WordPress 網站?

先在 Google Forms 建立一份表單,選擇「 傳送 」,複製好表單短代碼。

接著前往 WordPress 頁面,新增「 HTML 」小工具,將短代碼貼上,即可完成嵌入。

本文內有詳細圖文教學,可供大家參考!

我想要客製化表單樣式 …

如果想客製化表單樣式,那也許額外安裝 WordPress 表單外掛,會是更好的選擇唷!

犬哥網站已經有整理: 最佳 WordPress 表單外掛推薦

如果想使用免費表單外掛,可參考:Contact Form 7 表單外掛教學

若是 WordPress 新手使用者,並且想先體驗表單外掛功能,可參考:WPForms Lite 版本 。


WordPress 學習資源

學習 WordPress 網站架設流程中,或許會遇到一些解決不了問題,可以在下方留言給我,我會盡力協助解答!

接下來,額外分享 3 項架站資源,可有效幫助大家處理網站問題。

資源一:犬哥數位(專業 WordPress 網頁設計公司)

如果你沒時間自己架站、或是遇到解決不了的網站問題。歡迎洽詢 犬哥數位(WordPress 網頁設計公司),請專家製作會更有效率!

WordPress 網頁設計公司|犬哥數位

資源二:WP 精選模組攻略書

由於 WordPress 主題 / 外掛有非常多種,很多網友私訊我不知道安裝哪一款,才有辦法實現功能。或是已經試了很多款外掛,但始終找不到適合自己的。

對此我整理了 高達 90 多款精選主題&外掛大全(電子書),這些都是我們團隊協助客戶開發案件時,會搭配使用的。一來外掛品質優良,二來功能性也足夠強!

WordPress 模組電子書

資源三:官方教學資源(含 FB 社群解答)

如果你偏愛自架網站,也歡迎持續關注 犬哥網站 Blog,我們都持續有發布新的網站架設、網路行銷教學。

或是你比較喜歡看影片學習,也可關注 YouTube 頻道,幫助你更容易進入狀況。

當然,如果你在操作過程中遇到問題,也可以加入 WordPress 架站 x SEO 教學時光屋 – 犬哥網站 ,除了有網友一同幫你解惑外,犬哥團隊也會同步在社團幫助大家。

犬哥網站:WordPress 架站 x SEO 優化技巧,一站式學習!

希望這些對你有所幫助,祝一切順利啦!

關於作者

犬哥網站:網頁設計 x 網路行銷教學平台

犬哥網站

我們分享 WordPress 架站 x 網路行銷知識,不需會任何程式技術,就能自己建立各種網站。 搭配豐富的網路行銷教學,幫助你被更多人看到。 趕快跟著我們的腳步,開始學習吧:)

發佈留言

發佈留言必須填寫的電子郵件地址不會公開。

回到頂端