[WordPress] Wufoo – 製作自己的聯絡表格

一個範例提供給大家 - 低調聯絡

我使用 Wufoo 這超棒服務製作的!

在友站 - 就是,蛋! 發現的@.@

接著我要來說明一下這個服務如何使用~

首先請先至 https://secure.wufoo.com/signup/1/ 註冊

wufoo3.jpg

註冊後點擊 New Form (新增表格)

wufoo4.jpg

按照顏色順序拖曳出相對應的表格 (你也可以跟我不一樣~)

wufoo5.jpg

需注意的是

如果有需要系統自動回覆一封信給填寫訊息者

需將底下的選項勾選
wufoo6.jpg

wufoo8.jpg

並設定你自己的訊息

wufoo7.jpg

詳細步驟讓我偷懶一下~~可以看我製作的影片 - 點我觀看


接著完成編輯後請點選 code

wufoo12.jpg

選擇第二項的第一個複製程式碼
(或是選用 Iframe 都可以)

wufoo18.jpg

到你的 WordPress 新增一個分頁 (名稱你可以亂打@@)

切換到 HTML 模式

把複製的程式碼貼上發佈...

就可以像我一樣擁有這種表格

測試結果如下

wufoo15.jpg

wufoo14.jpg

wufoo16.jpg

wufoo17.jpg

你一定想問我為什麼會喜歡這個表格

因為有分析服務阿!!

@.@

wufoo19.jpg

wufoo20.jpg

雖然每個月只有 100 封可以玩~

但是我只是個小站~應該夠用^_^

大家一起來製作自己的表格吧!

[附註]
1. 現在新帳號似乎都有 [Report Abuse] 回報連結...感覺就很危險...希望不會被中二廚發現。
2. Code 的部分 Wordpress 都能使用, JavaScript 或是 Iframe 都可以。
3. 2010/08/11 更新影片錯字

留言

  1. 明天再來研究去掉 Report Abuse 的方法@.@

    回覆刪除
  2. 你只要找到他輸出HTML的CLASS(如果有的話)就可以用CSS去掉...

    回覆刪除
  3. @.@ 所以我要另外載它的 XHTML/CSS code 下來研究囉

    (CSS 一竅完全不通)

    回覆刪除
  4. 咦! 怎麼我的也沒有REPORT ABUSE。

    wsqsite(點)com/contact/

    回覆刪除
  5. 對阿!! @.@

    您是載它的 XHTML 壓縮檔案嗎?

    回覆刪除
  6. 瞭解,原來我用的是加載JS,你的是Iframe頁框。

    回覆刪除
  7. 我把整個Wufoo的網站找了個翻天覆地,也找不到是什麼原因導致的。
    或許是人品問題吧 ( 被拖走 T.T

    回覆刪除
  8. 那我真的是見到...@W@

    還是換用代理申請咧...

    怪怪...

    回覆刪除
  9. 見鬼了。
    從外部著手是不行的。
    CSS都被他預先設置了,還加上了!important。
    只有從他的源碼著手,或許你可以試試他的API ( 我不懂,懂的話別忘了指點一下我 )

    回覆刪除
  10. 恩@.@

    看起來好像真的是我自己的問題

    回覆刪除
  11. [...] 發表一篇 Wufoo – 製作自己的聯絡表格 還蠻好用的, 我也去弄了一個 XD 不過「讓 Wufoo 寄信告知你有留言」這點 zkm [...]

    回覆刪除
  12. 我剛剛也弄了, 順便也 po 了一下你沒弄的地方 XD
    http://www.coolaler.com/showthread.php?t=142744

    回覆刪除
  13. 囧....那是哪來的網址....
    http://laluna.pp.ru/wufoo1

    回覆刪除
  14. 我有影片.. = =||

    3:44 處

    回覆刪除
  15. 嘻嘻, 我沒看影片麻...XD
    反正也有提到你沒提的, 沒撞文啦^^"

    回覆刪除
  16. 我看到有人把WOFOO字樣跟LOGO都去掉了
    不知道怎用的呢?

    回覆刪除
  17. LinkWithin 的相關圖
    怎麼換成ACG圖片的呢?

    回覆刪除
  18. 他會自動抓取文章的"第一張"圖
    沒辦法改

    回覆刪除
  19. 是喔 因為很好奇為何相關文章 跟圖文無關也可以抓到
    是用隱藏語法嗎?

    另外
    ----------------------------------
    http://lh4.ggpht.com/_1a-Z529hrHU/TGGOAgKkD6I/AAAAAAAAAG4/d4lTekcw4vA/wufoo17.jpg?imgmax=640 我收信跟這封MAIL過來不一樣 怎樣能達到這效果

    回覆刪除
  20. 他就是抓第一張圖
    所以我才設計我圖片的排列順序阿..
    科科

    我後來都是使用純文字
    這設定我也忘了..

    回覆刪除
  21. 哈哈 我還是不太懂 晚上GTALK好了~_~

    回覆刪除

張貼留言

這個網誌中的熱門文章

三星S8與小米幾個產品的小小體驗心得

[Win10] Win10Tile - 自訂動態磚