今天要來個簡單的教學，教你如何在網站的側邊，加上一排聯絡資訊，讓對你有興趣，想找你寫業配的人，可以毫不費力地聯絡到你。
光用講的可能有點抽象，之接看下圖，你就知道我在說什麼。
其實有很多外掛都可以達到這效果，甚至可以做到非常華麗。
但我們不需要華麗，簡單大方美觀才是我的擇偶條件，讓人家聯絡起來輕鬆寫意，別人才不會半路棄坑，而我今天介紹的外掛，就有這樣單純的特質。
必須先說，除非你真的有在賣服務或產品，不然會找你的人可能不多，不要以為放個聯絡資訊你就會變得很夯。
不囉唆，開始了！
安裝My Sticky Elements外掛
這類型的外掛真的很多，我以前用過Float menu，現在網站用的是Floating Chat Widget。
今天要介紹的是My Sticky Elements，因為他有我說的優點，簡單、美觀，設定起來又非常簡單，它是由premio開發，這間公司旗下的外掛都挺不錯。
安裝外掛這麼簡單的事情我就不另外寫了。
My Sticky Elements 免費版與付費版
付費版可以讓你有：
- E-mail 名單不只可加入網站，可以直接串連第三方E-mail行銷（Mailchimp)
- 無限制聯絡icon（免費版限制兩個）
- 可自行調整CSS外觀
- icon能自己上傳
- 位置能完全客製（免費版只能選上下左右）
- 更多客製化的選項
以一般使用者來說，免費版就夠用囉，所以我這篇文章也只會介紹免費版而已。
My Sticky Elements 基本設定
Contact Form設定
最上方是聯繫表單的設置，如果你網站還沒有串接任何E-mail的系統，可以先用這個來做簡單搜集名單的工具。
預設用戶需要填的資訊是：
- Name
- Phone
- Message
你可以勾選自己需要與不要的，並選擇哪些是「必填」（Required）
Contact Form 按鈕設定
1. Background Color：調整按鈕的背景色
2. Text Color：調整按鈕文字的顏色
3. Text on the Submit button：調整按鈕上要顯示什麼文字（預設是Submit）
Contact Form 外觀設定
1. Device：聯絡表單要在哪些裝置顯示（桌機/手機）
2. Direction：文字是由左至右還是由右至左
3. Background Color：聯絡表單那個表單背景顏色是什麼
4. Text Color：字的顏色
5. Form Background Color：表單的背景顏色
6. Form Headline Color：表單標題的字體顏色
7. Text in Tab：表單上顯示什麼字（預設為Contact US）
8. Contact Form Title ：表單標題上顯示什麼字（預設為Contact Form）
9. Send lends to：表單填完的資料要送去哪？（預設是進入Wordpress資料庫，免費版無法調整）
Social Channels Tabs 設定
上方這些社交平台你都可以選，但免費版的只能選兩個（兩個就夠多了）
以台灣人的使用習慣，建議選Line跟Facebook為主，選好之後，就在下方填入你的聯絡網址。
要注意的是，Line沒辦法直接聊，還是會跳轉到加Line的畫面。
Social Channels 設定
1. Templates：整個側欄的外觀有幾個套版可以選
2. Position on desktop：在桌機版時他的位置
3. Position on mobile：在手機版時他的位置
4. Open tabs when：何時打開這些聯繫的tab（hover/滑過、Click/點擊）
5. Open the form automatically：自動打開表單（不建議開啟）
6. Minimize tab：調整隱藏聯絡清單tab的顏色（見下圖）
7. Minimize bar on load：載入時先處在隱藏的情況
Font Family：調整字型
Desktop Widget size：調整整個「聯絡表單」外觀在桌機顯示的大小
Mobile Widget size：調整整個「聯絡表單」外觀在手機顯示的大小
Entry effect：進場的動畫
還是來個影片教學好了
寫了老半天，覺得拍影片一下就講完了…
結語
如果你們剛好有這個需求，那這篇文章一定能解決這個問題啊！
原本想說今天星期六，不太想動太多腦，就來寫點輕鬆的，沒想到還是寫了超久…可惡啊！
這篇文章就先這樣囉！掰～
