2008年1月26日 星期六

3_3_1部落格嵌入MSN聊天視窗,訪客要如何使用

一般人(訪客)透過上網(網際網路)看到網站或部落格有MSN聊天視窗, 電腦上不用安裝MSN軟體,一樣能透過此MSN聊天視窗與設定的MSN帳戶互動, 而訪客如何與線上客服互動呢?本單元有仔細的說明
3_3_1部落格嵌入MSN聊天視窗,訪客要如何使用.ppt
其連結如下:
http://www.slideshare.net/p_yang/321msn












































Slide 1: 3_3_1 部落格嵌入 MSN 聊天 視窗 , 訪客要如何使用 楊乾中2008 年 1 月 cmtycc@gmail.com
Slide 2: 先備知識 • 3_3 如何將 MSN 聊天視窗 ( 即時熱線 ) 嵌 入到 Google 提供的部落格 (Blogger) 其網址為 http://www.slideshare.net/p_yang/32msngoogleblogger • 本例設定的 MSN 帳戶為 ycc0429@hotmail.com; 顯示名稱為 cicd21, 但在部落格顯示為 user
Slide 3: 觀念 • 一般人 ( 訪客 ) 透過上網 ( 網際網路 ) 看到網站或部落格有 MSN 聊天視窗 , 電腦上不用安裝 MSN 軟體 , 一樣能透過 此 MSN 聊天視窗與設定的 MSN 帳戶互動 • 一般人 ( 訪客 ) 要用何代號與設定的 MSN 帳戶互動 , 由自 已選 [Begin a Conversation] 按鈕設定 • 設定的 MSN 帳戶會以 USER 名稱出現與訪客對話 , 不會 出現設定的 MSN 帳戶 ; 所以對談的原始帳號皆不會顯現 • 此為多 ( 訪客 ) 對 1( 設定的 MSN 帳戶 ) 的方式進行 , 每一 個來賓 ( 訪客 ) 與設定的 MSN 帳戶皆會出現獨立的對話視 窗來互動 • 此種方式微軟公司 稱為「 MSN 即時熱線」 , 方便您做線 上客服 , 相關網址為 :http://wowimme.spaces.live.com/ 楊乾中2008 年 1 月 cmtycc@gmail.com
Slide 4: 3_2_1 部落格嵌入 MSN 聊天視窗 , 訪客要如何使用 • 1. 登入某一已嵌入 MSN 聊天視窗的部落格 ( 本例 http://master2super.blogspot.com/)1 , 移動 [ 捲軸 ]2 到最下方 • 2. 出現 MSN 聊天視窗 , 選 [Begin a Conversation] 按鈕 • 3. 出現請您設定對話的顯示名稱 ( 目前內定 為 visitor) • 4. 在文字方塊內 , 改成自己要顯示的名稱 ( 本例為 lilicoco)1 , 選 [ok]2 按鈕 楊乾中2008 年 1 月 cmtycc@gmail.com
Slide 5: 3_2_1 部落格嵌入 MSN 聊天視窗 , 訪客要如何使用 • 5. 出現圖形文字 (8 個碼 ) • 6. 在其下文字方塊對應輸入 8 碼圖形文字 1 , 選 [submit]2 按鈕 • 7. 返回 MSN 聊天視窗 • 8. 輸入內容 ( 本例為有人服務嗎 ?)1, 選 [send]2 按鈕 楊乾中2008 年 1 月 cmtycc@gmail.com
Slide 6: 3_2_1 部落格嵌入 MSN 聊天視窗 , 訪客要如何使用 • 9. 輸入內容出現在 MSN 聊天視窗上方(顯 示訪客代號為 lilicoco ) • 10. 此時客服人員的 MSN 視窗多一對話視 窗 , 切到此對話視窗 ( 本例為 lilicoco 視窗 ) 1 • 11. 出現 MSN 聊天視窗 • 12. 輸入內容 ( 本例為歡迎光臨 )1, 選 [ 傳送 ]2 按鈕 楊乾中2008 年 1 月 cmtycc@gmail.com
Slide 7: 3_2_1 部落格嵌入 MSN 聊天視窗 , 訪客要如何使用 • 13. 輸入內容到 MSN 聊天視窗上方 • 14. 此時部落格訪客的 MSN 聊天視窗出現 對話內容 , 但顯示名稱為 user, 不會出現客服端的 MSN 帳號 ( 本例為 ycc0429@hotmail.com) • 15. 當客服繼續輸入內容 ( 本例測試成功及 圖案 )1, 選 [ 傳送 ]2 按鈕 • 16. 輸入內容及圖案到 MSN 聊天視窗上方 楊乾中2008 年 1 月 cmtycc@gmail.com
Slide 8: 3_2_1 部落格嵌入 MSN 聊天視窗 , 訪客要如何使用 • 17. 此時部落格訪客的 MSN 聊天視窗出現 對話內容 , 但是圖案變成設定圖案的代號 ( 本例為 88) 楊乾中2008 年 1 月 cmtycc@gmail.com
Slide 9: 1. 登入某一已嵌入 MSN 聊天視窗的部落格 ( 本例 http://master2super.blogspot.com/, 移動 [ 捲軸 ]2 到最下方 1 2
Slide 10: 2. 出現 MSN 聊天視窗 , 選 [Begin a Conversation] 按鈕 目前客服在線上 (Online) 1 MSN 聊天視窗
Slide 11: 3. 出現請您設定對話的顯示名稱 ( 目前內定為 visitor)
Slide 12: 4. 在文字方塊內 , 改成自己要顯示的 名稱 ( 本例為 lilicoco)1, 選 [ok]2 按 鈕 1 2
Slide 13: 5. 出現圖形文字 (8 個碼 ) 圖形文字 , 避免用程式 自動對話
Slide 14: 6. 在其下文字方塊對應輸入 8 碼圖 形文字 1, 選 [submit]2 按鈕 1 2
Slide 15: 7. 返回 MSN 聊天視窗 本例顯示客服代號為 user 在線上
Slide 16: 8. 輸入內容 ( 本例為有人服務嗎 ?)1, 選 [send]2 按鈕 本例顯示 客服代號為 user 1 2
Slide 17: 9. 輸入內容出現在 MSN 聊天視窗上方 (顯示訪客代號為 lilicoco ) 訪客代號 本例 lilicoco 輸入內容
Slide 18: 10. 此時客服人員的 MSN 視窗多一對話視窗 , 切到此對話視窗 ( 本例為 lilicoco 視窗 )1 客服端 1
Slide 19: 11. 出現 MSN 聊天視窗本例訪客為 客服端 lilicoc Lilicoco 輸入的內容
Slide 20: 12. 輸入內容 ( 本例為歡迎光臨 )1, 選 [ 傳送 ]2 按鈕 客服端 1 2
Slide 21: 13. 輸入內容到 MSN 聊天視窗上方 客服端 本例 為 ycc0429@hotmail.com 的 MSN 帳號 輸入的內容
Slide 22: 14. 此時部落格訪客的 MSN 聊天視窗出現對話內容 , 但顯示 名稱為 user , 不會出現客服端的 MSN 帳號 ( 本例為 ycc0429@hotmail.com) 顯示名稱為 user 客服所輸入的內容
Slide 23: 15. 當客服繼續輸入內容 ( 本例測試 成功及圖案 )1, 選 [ 傳送 ]2 按鈕 客服端 2 1
Slide 24: 16. 輸入內容及圖案到 MSN 聊天視 窗上方 客服端 1 本例客服端 圖案代碼為 88
Slide 25: 17. 此時部落格訪客的 MSN 聊天視窗出現對話內容 , 但是圖案變成設定圖案的代號 ( 本例 為 88) 圖案代碼 88
Slide 26: 補充 1: 線上 (Online) • 若客服端設定為 [ 線上 ], 則部落格訪客端出 現為 user(online) 如下三張投影片
Slide 27: 1. 設成 [ 線上 ]1 1
Slide 28: 2. 出現 [ 線上 ]
Slide 29: 訪客端出現 user(online)
Slide 30: 補充 2: 忙碌 (busy) • 若客服端設定為線上 , 則部落格訪客端出現 為 user(busy) 如下三張投影片
Slide 31: 1. 設成 [ 忙碌 ]1 1
Slide 32: 2. 出現 [ 忙碌 ]
Slide 33: 訪客端出現 user(Busy)
Slide 34: 補充 3: 外出用餐 (out to lunch) • 若客服端設定為線上 , 則部落格訪客端出現 為 user(out to lunch) 如下三張投影片
Slide 35: 1. 設成 [ 外出用餐 ]1 1
Slide 36: 2. 出現 [ 外出用餐 ]
Slide 37: 訪客端出現 user(out to lunch)
Slide 38: 補充 4 • 若客服端不在線上 , 則部落格訪客端出現為 offline 如下張投影片 , 此時無法互動

3_3如何將MSN聊天視窗(即時熱線)嵌入到Google提供的部落格(Blogger)

3_3如何將MSN聊天視窗(即時熱線)嵌入到Google提供的部落格(Blogger)
http://econsultant520.blogspot.com/2008/01/33msngoogleblogger.html

先備知識:
2如何申請google的免費電子郵件帳號
http://econsultant520.blogspot.com/2008/01/2google.html

3如何在Google所提供的部落格,建立自己的部落格
http://econsultant520.blogspot.com/2008/01/3google.html

3如何在gmail中啟用Google所提供的對應部落格
http://econsultant520.blogspot.com/2008/01/3gmailgoogle.html

12如何申請google analytics新帳號
http://econsultant520.blogspot.com/2008/01/12google-analytics.html

12_1如何在google提供的部落格中加入google analytics的程式碼來統計流量
http://econsultant520.blogspot.com/2008/01/121googlegoogle-analytics.html

3_1如何在Google所提供的部落格,建立文章
http://econsultant520.blogspot.com/2008/01/31google.html
相關單元:
3_3_1部落格嵌入MSN聊天視窗,訪客要如何使用
http://econsultant520.blogspot.com/2008/01/331msn.html

3_2Google提供的部落格,如何載入影片檔
http://econsultant520.blogspot.com/2008/01/32google_26.html

3_2如何在Google 所提供的部落格,放入照片
http://econsultant520.blogspot.com/2008/01/32google.html

3_3Google提供的部落格,如何嵌入與連結簡報檔
http://econsultant520.blogspot.com/2008/01/33google.html

3_3如何在Google所 提供的部落格,嵌入Youtube影片
http://econsultant520.blogspot.com/2008/01/33google-youtube.html


3Windows XP開機,自動出現Windows Live Messenger畫面,如何讓其不出現
http://econsultant520pc.blogspot.com/2008/02/3windows-xpwindows-live-messenger.html

本文:
MSN 聊天視窗若能嵌入到部落格中;
部落格就提供了 MSN 聊天視窗(即時熱線),
讓登入部落格的人能運用線上MSN聊天視窗與你互動
3_3如何將MSN聊天視窗(即時熱線)嵌入到Google提供的部落格(Blogger)
其連結如下
:
http://www.slideshare.net/p_yang/32msngoogleblogger

















































Slide 1: 3_2 如何將 MSN 聊天視窗 ( 即時熱線 ) 嵌入到 Google 提供的部落 格 (Blogger) 楊乾中2008 年 1 月 cmtycc@gmail.com
Slide 2: 操作大綱 • 一、啟用「允許在網路上顯示您的 Messenger 狀態 , 並可傳送訊息給你」的 功能 ( 步驟 1 到步驟 5 的選 [ 儲存 ]2 按鈕 ) • 二、取得 MSN 聊天視窗用的程式碼 ( 步驟 5 到步驟 11) • 三、開啟部落格 ( 步驟 12 到步驟 16) • 四、嵌入 MSN 聊天視窗用的程式碼到部落 格 ( 步驟 17 到步驟 28) 楊乾中2008 年 1 月 cmtycc@gmail.com
Slide 3: 3_2 如何將 MSN 聊天視窗 ( 即時熱線 ) 嵌入到 Google 提供的部落格 (Blogger) • 1. 到網址 http://settings.messenger.live.com/applicat ions/websettings.aspx 出現 windows live [ 登入 ] 視窗 , 選 [ 使用不同帳號登入 ]1 按 鈕 • 2. 出現全新的 [ 登入 ] 畫面 • 3. 輸入帳號 1, 密碼 2; 選 [ 登入 ]3 按鈕 • 4. 出現 [windows live Messenger] 視窗 , 目前在 [ 首頁 ] 按鈕月 cmtycc@gmail.com 楊乾中2008 年 1
Slide 4: 3_2 如何將 MSN 聊天視窗 ( 即時熱線 ) 嵌入到 Google 提供的部落格 (Blogger) • 5. 選 [ 允許在網路上顯示您的 Messenger 狀態,並可傳送訊息給您。 ] 按鈕 , 出現勾 (v)1, 選 [ 儲存 ]2 按鈕後 , 選 [ 建立 HTML]3 按鈕 • 6. 目前在 [ 即時通訊視窗 ], 不做變更 , 移動 捲軸 1 • 7. 出現 HTML 碼 • 8. 在 HTML 區按右鍵 1, 出現快顯功能表 , 選 [ 全選 ]2 選項 年 1 月 cmtycc@gmail.com 楊乾中2008
Slide 5: 3_2 如何將 MSN 聊天視窗 ( 即時熱線 ) 嵌入到 Google 提供的部落格 (Blogger) • 9.HTML 碼全部選取 • 10. 在選取區按右鍵 1, 出現快顯功能表 , 選 [ 複製 ]2 選項 • 11.HTML 程式碼複製到剪貼簿 ( 準備貼到 部落格 HTML 碼區 ) • 12. 開啟新的瀏覽視窗 , 到網址 mail.google.com, 出現 [ 歡迎使用 gmail 視 窗] 楊乾中2008 年 1 月 cmtycc@gmail.com
Slide 6: 3_2 如何將 MSN 聊天視窗 ( 即時熱線 ) 嵌入到 Google 提供的部落格 (Blogger) • 13. 輸入使用者名稱 ( 本例為 master2super)1; 密碼 2; 選 [ 登入 ]3 按鈕 • 14. 出現 [Gmail 收件匣 ] 視窗 , 選 [ 更多 ]1 按鈕 • 15. 出現 [ 更多 Gmail 產品 ] 視窗 , 選口 ( 最 大化 )1 圖示 • 16. 選 [Blogger]1 選項 楊乾中2008 年 1 月 cmtycc@gmail.com
Slide 7: 3_2 如何將 MSN 聊天視窗 ( 即時熱線 ) 嵌入到 Google 提供的部落格 (Blogger) • 17. 出現 [Blogger 控制主頁 ] 視窗 , 選 [ 版 面配置 ]1 按鈕 • 18. 出現 [Blogger 修改版面配置 ] 視窗 , 目 前在 [ 範本 ] 標籤下的 [ 網頁元素 ] 標籤 , 選 [ 修改 HTML]1 標籤 • 19. 出現 [Blogger 修改範本 HTML] 視窗 , 移動 [ 捲軸 ]1 到最下方 • 20. 出現完整的 HTML 文字方塊 , 移動此文 字方塊 [ 捲軸 ]1 到最下方 楊乾中2008 年 1 月 cmtycc@gmail.com
Slide 8: 3_2 如何將 MSN 聊天視窗 ( 即時熱線 ) 嵌入到 Google 提供的部落格 (Blogger) • 21. 捲軸移到最後 , 找到 </body> • 22. 在 </body> 前 ( 左方 ) 按滑鼠左鍵一下 1, 將插入點移到此 • 23. 按 [Enter] 鍵 5 下 ( 要將 MSN 熱線的 HTML 貼到此 , 空大一點區域 , 方便識別 ) • 24. 在空白區按滑鼠左鍵一下 1, 將插入點 移到此 楊乾中2008 年 1 月 cmtycc@gmail.com
Slide 9: 3_2 如何將 MSN 聊天視窗 ( 即時熱線 ) 嵌入到 Google 提供的部落格 (Blogger) • 25. 在空白區按右鍵 1, 出現快顯功能表 , 選 [ 貼上 ]2 選項 • 26. 貼上 MSN 熱線的 HTML 碼 • 27. 找到 &mkt=zh-tw • 28. 刪除後 , 其後雙引號 (“) 往前遞補 , 選 [ 儲存範本 ]1 按鈕 楊乾中2008 年 1 月 cmtycc@gmail.com
Slide 10: 3_2 如何將 MSN 聊天視窗 ( 即時熱線 ) 嵌入到 Google 提供的部落格 (Blogger) • 29. 出現 [ 您的變更已儲存。 ] 訊息 , 選 [ 檢視 blog] 按鈕 • 30. 出現部落格視窗 ( 本例為趣味文章 ), 選 口 ( 最大化 )1 圖示 • 31. 移動 [ 捲軸 ]1 到最下方 • 32. 出現 [MSN 即時熱線 ] 楊乾中2008 年 1 月 cmtycc@gmail.com
Slide 11: 1. 到網址 http://settings.messenger.live.com/applications/websettings. aspx 出現 windows live [ 登入 ] 視窗 , 選 [ 使用不同帳號登入 ]1 按鈕 帳號 1
Slide 12: 2. 出現全新的 [ 登入 ] 畫面
Slide 13: 3. 輸入帳號 1, 密碼 2; 選 [ 登入 ]3 按 鈕 1 2 3
Slide 14: 4. 出現 [windows live Messenger] 視窗 , 目前在 [ 首頁 ] 按鈕
Slide 15: 5. 選 [ 允許在網路上顯示您的 Messenger 狀態,並可傳送訊息給您。 ] 按鈕 , 出現勾 (v)1, 選 [ 儲存 ]2 按鈕後 , 選 [ 建立 HTML]3 按鈕 2 3 1
Slide 16: 6. 目前在 [ 即時通訊視窗 ], 不做變 更 , 移動捲軸 1 1
Slide 17: 7. 出現 HTML 碼 HTML 內容
Slide 18: 8. 在 HTML 區按右鍵 1, 出現快顯功 能表 , 選 [ 全選 ]2 選項 按右鍵 1 2
Slide 19: 9.HTML 碼全部選取
Slide 20: 10. 在選取區按右鍵 1, 出現快顯功 能表 , 選 [ 複製 ]2 選項 2 按右鍵 1
Slide 21: 11.HTML 程式碼複製到剪貼簿 ( 準 備貼到部落格 HTML 碼區 )
Slide 22: 12. 開啟新的 IE 瀏覽視窗 , 到網址 mail.google.com, 出現 [ 歡迎使用 gmail 視窗 ]
Slide 23: 13. 輸入使用者名稱 ( 本例為 master2super)1; 密碼 2; 選 [ 登入 ]3 按鈕 1 2 3
Slide 24: 14. 出現 [Gmail 收件匣 ] 視窗 , 選 [ 更多 ]1 按鈕 1
Slide 25: 15. 出現 [ 更多 Gmail 產品 ] 視窗 , 選口 ( 最大化 )1 圖示 1
Slide 26: 16. 選 [Blogger]1 選項 1
Slide 27: 17. 出現 [Blogger 控制主頁 ] 視窗 , 選 [ 版面配置 ]1 按鈕 1
Slide 28: 18. 出現 [Blogger 修改版面配置 ] 視窗 , 目前在 [ 範本 ] 標籤下的 [ 網頁元素 ] 標籤 , 選 [ 修改 HTML]1 標籤 1
Slide 29: 19. 出現 [Blogger 修改範本 HTML] 視窗 , 移動 [ 捲軸 ]1 到最下方 1
Slide 30: 20. 出現完整的 HTML 文字方塊 , 移 動此文字方塊 [ 捲軸 ]1 到最下方 1 HTML 文字方塊
Slide 31: 21. 捲軸移到最後 , 找到 找到
Slide 32: 22. 在 前 ( 左方 ) 按滑鼠左 鍵一下 1, 將插入點移到此 插入點
Slide 33: 23. 按 [Enter] 鍵 5 下 ( 要將 MSN 熱線的 HTML 貼到此 , 空大一點區域 , 方便識別 ) MSN 熱線的 HTML 要貼到此
Slide 34: 24. 在空白區按滑鼠左鍵一下 1, 將 插入點移到此 插入點 1
Slide 35: 25. 在空白區按右鍵 1, 出現快顯功 能表 , 選 [ 貼上 ]2 選項 按右鍵 1 2
Slide 36: 26. 貼上 MSN 熱線的 HTML 碼 MSN 熱線的 HTML 碼
Slide 37: 27. 找到 &mkt=zh-tw &mkt=zh-tw
Slide 38: 28. 刪除後 , 其後雙引號 (“) 往前遞 補 , 選 [ 儲存範本 ]1 按鈕 1 刪除後’’遞補
Slide 39: 29. 出現 [ 您的變更已儲存。 ] 訊息 , 選 [ 檢視 blog] 按鈕 1
Slide 40: 30. 出現部落格視窗 ( 本例為趣味文 章 ), 選口 ( 最大化 )1 圖示 1
Slide 41: 31. 移動 [ 捲軸 ]1 到最下方 1
Slide 42: 32. 出現 [MSN 即時熱線 ] MSN 即時熱線
Slide 43: 補充 1. 步驟 27 &mkt=zh-tw 未刪除 , 選 [ 儲存範本 ]1 按鈕出現錯誤訊息
Slide 44: 補充 2. MSN 即時熱線資料 • MSN 即時熱線相關資料如以下網址 • http://wowimme.spaces.live.com/

先備知識:
2如何申請google的免費電子郵件帳號
http://econsultant520.blogspot.com/2008/01/2google.html

3如何在Google所提供的部落格,建立自己的部落格
http://econsultant520.blogspot.com/2008/01/3google.html

3如何在gmail中啟用Google所提供的對應部落格
http://econsultant520.blogspot.com/2008/01/3gmailgoogle.html

12如何申請google analytics新帳號
http://econsultant520.blogspot.com/2008/01/12google-analytics.html

12_1如何在google提供的部落格中加入google analytics的程式碼來統計流量
http://econsultant520.blogspot.com/2008/01/121googlegoogle-analytics.html

3_1如何在Google所提供的部落格,建立文章
http://econsultant520.blogspot.com/2008/01/31google.html
相關單元:
3_3_1部落格嵌入MSN聊天視窗,訪客要如何使用
http://econsultant520.blogspot.com/2008/01/331msn.html

3_2Google提供的部落格,如何載入影片檔
http://econsultant520.blogspot.com/2008/01/32google_26.html

3_2如何在Google 所提供的部落格,放入照片
http://econsultant520.blogspot.com/2008/01/32google.html

3_3Google提供的部落格,如何嵌入與連結簡報檔
http://econsultant520.blogspot.com/2008/01/33google.html

3_3如何在Google所 提供的部落格,嵌入Youtube影片
http://econsultant520.blogspot.com/2008/01/33google-youtube.html

3Windows XP開機,自動出現Windows Live Messenger畫面,如何讓其不出現
http://econsultant520pc.blogspot.com/2008/02/3windows-xpwindows-live-messenger.html