[unboxing][hrads]

熱門標籤

☆重要訊息:Blogger 官方近期推出的「RWD 自適應範本主題」沒有『行動服務』的設定選項,如果您是觀察「技研可樂」裡的文章做自己網站的設計,使用「自適應範本主題」的使用者可以直接依「技研可樂」文章裡的『電腦版』方式做設定即可完成佈置,不需要開啟『行動服務』。☆

  Blogger 自訂網址應用 CloudFlare HTTPS 系列文章:「CloudFlare

  Blogger HTTPS 相關文章列表:「HTTPS

  Blogger AdSense 廣告放置與相關自適應廣告佈屬文章列表:「AdSense

  Blogger 常用頁面判斷式用法一列表:「Blogger 常用頁面判斷式用法一覽表

Blogger 安裝 DISQUS 社群聚合留言板

DISQUS 留言系統支援大部份主流部落格平台安裝,而在社群媒介方面也支援「Twitter、G+、Facebook」,在社群集合力方面很完善,相比在 Blogger 上面的原生留言板系統,也就較為全面!尤其 Blogger 在不支援 Facebook 用戶留言的情況下,帶來了很大的方便性!

在安裝過程中,會有出現需要 Google 帳號授權的部份,若對帳號安全有顧慮的話,可先思考一下是否要安裝 ( 可先至「Step16. ~ Step18.」觀察一下關於授權的部份 ) 。建議可到後台新創一個 Blogger 網誌來試做,降低設置錯誤時的風險。

另外,安裝過程中在 HTML ( 範本 ) 裡需要「<div id='backlinks-container'>」這段代碼,如果沒有的話,可能會無法安裝!

若是在後台使用 新增小工具「HTML/JavaScript」來置入語法的話,可以成功,不過這樣在首頁也會出現「Disqus」留言工具!

Blogger 安裝 DISQUS 社群聚合留言板_001




文章更新:

此篇文章已更新,可由連結「Blogger 快速安裝 Disqus 留言板」進入。



網站連結

Disqus 官方網站:「https://disqus.com/



前置作業

若對編譯 Blogger 的 HTML 模板還不太熟悉,建議先執行『備份 Blogger 模板 (範本)』的動作,以防原始模板資料遺失。




設定教學

Step 1

進入「Disqus」網站,點擊網頁中右下方的【Add Disqus to Your Site】

Blogger 安裝 DISQUS 社群聚合留言板_101



Step 2

輸入相關註冊資料

URL ← 網站網址
Site Name ← 網站名字
Site Shortname ← 在 disqus 的個人帳號頁面
Username ← 登入 disqus 的帳號
Password ← 用來登入的密碼
Email Address ← 用來認証註冊的 Email 信箱

Blogger 安裝 DISQUS 社群聚合留言板_102



Step 3

註冊完成後,在這個頁面,點選畫面中的【Uinversal Code】圖示

Blogger 安裝 DISQUS 社群聚合留言板_103



Step 4

接著我們將「第一區的程式代碼」全選【複制】

Blogger 安裝 DISQUS 社群聚合留言板_104



Step 5

「瀏覽器」開一新分頁,來到「Blogger 後台」,選擇畫面中的【範本 \ 編輯 HTML】

Blogger 安裝 DISQUS 社群聚合留言板_105



Step 6

接著在頁框內的【程式代碼中點一下】,按下鍵盤上的【Ctrl + F】( 按著 Ctrl 再按一下 F ) 在跳出的搜尋框中 輸入 [ <div id='backlinks-container'> ] 並【按下 Enter】

Blogger 安裝 DISQUS 社群聚合留言板_106



Step 7

在「<div id='backlinks-container'>」的下方,放上剛才「Step4.」複制的程式碼
補充:程式碼 需介於下方區間,因為測試使用的模板有兩處「<div id='backlinks-container'>」


<div id='backlinks-container'>

→ 此區間為要放入的程式碼 ←

 <div expr:id='data:widget.instanceId + &quot;_backlinks-container&quot;'>

Blogger 安裝 DISQUS 社群聚合留言板_107



Step 8

「瀏覽器」回到 Disqus 的分頁,再全選【複制】網頁下方「第二區的程式代碼」

Blogger 安裝 DISQUS 社群聚合留言板_108



Step 9

「瀏覽器」回到 Blogger 後台分頁,在搜尋框中輸入 [ </body> ] 並【按下 Enter】,且在它上面放上「Step7.」的程式碼,按下畫面上方的【儲存範本】

Blogger 安裝 DISQUS 社群聚合留言板_109



Step 10

接著「瀏覽器」開一新分頁,來到「Blogger 後台 」的【設定 \ 文章和留言】

留言位置 選擇 → 隱藏
誰能留言 選擇 → 任何人
留言管理 選擇 → 永不

點擊右上方【儲存設定】之後,「瀏覽器」回到 Disqus 分頁

Blogger 安裝 DISQUS 社群聚合留言板_110



Step 11

將「Uinversal Code」下拉【選擇 Blogger】

Blogger 安裝 DISQUS 社群聚合留言板_111



Step 12

點取【See instrucitons here】

Blogger 安裝 DISQUS 社群聚合留言板_112



Step 13

將頁面中的「兩段程式代碼」,一同【複制】到「Step14.」中

Blogger 安裝 DISQUS 社群聚合留言板_113



Step 14

「瀏覽器」回到 HTML 分頁,在搜尋框中 輸入 [ <head> ] 並按下【Enter】,且在它的下面放上「Step13.」的程式碼,最後再按下畫面上方的【儲存範本】

Blogger 安裝 DISQUS 社群聚合留言板_114



Step 15

「瀏覽器」回到 Disqus 分頁,在這裡選擇畫面中的【Tools > Import】

Blogger 安裝 DISQUS 社群聚合留言板_115



Step 16

點擊【Import comments from Blogger】並在出現的視窗中點選【授予存取權】

Blogger 安裝 DISQUS 社群聚合留言板_116



Step 17

接著點擊【Import】


Blogger 安裝 DISQUS 社群聚合留言板_117

(* 如果留言數量很多的話,那對應的時間可能要 24 小時 )


Step 18

這裡是同步留言的功能,點擊【Disable syncing】並在出現的視窗中點選【授予存取權】

Blogger 安裝 DISQUS 社群聚合留言板_118



Step 19

接著的這個畫面可以【將它關掉】,因為要做的設定,在「Step10.」時已經完成

Blogger 安裝 DISQUS 社群聚合留言板_119



Step 20

回到「Blogger 前台」,可以看到「Disqus 留言板」成功運作了

Blogger 安裝 DISQUS 社群聚合留言板_120



Step 21

最後,別忘了到「電子信箱收信」,並將 Disqus 寄來的認證信做【認證】

Blogger 安裝 DISQUS 社群聚合留言板_121





相關文章

Blogger 安裝 DISQUS 最新留言

[教學] Blogger 快速安裝 DISQUS 留言板



參考文獻
黑色童話不加糖Black Tale No



分享

加入代碼加入代碼

若您在閱覽文章時,於文章頁面找不到相關的應用主題,歡迎移駕到『站內留言』一起研究討論,謝謝!

使用超連結:<a href="https://www.techcoke.com/">技研可樂</a> =『技研可樂

加入圖片 ( https ):支援 HTTPS 網址型式的 .jpg .png 格式圖檔,直接貼入 HTTPS 圖片網址即可在留言時顯示!

支援非嵌入 Youtube 視頻:https://www.youtube.com/watch?v=hdfSISI24Xk (* 瀏覽器網址列中的 Youtube 網址 )

&&amp;'&#039;"&quot;<&lt;>&gt;
技研可樂 © 2013 - 2017

Contact Form

Name

Email *

Message *