發表文章

目前顯示的是 11月, 2013的文章

Blogger 行動版安裝社群分享按鈕

圖片
這次的設置,主要是想安裝「LINE、Google+、Facebook 及 Twitter」的社群 分享按鈕 ,在「 Blogger 行動版 網頁」上,裝設的位置安排在文章頁腳作者區塊的下方。 雖然行動裝置上的社群分享源已經很完善,不過在文章尾增加一個 LINE 的分享按鈕,除了可以提醒經過的朋友可以用 LINE 分享文章之外,提供一個直接按就可以觸發分享的動作也許是更直觀方便的選擇! 若你的網站也在 Blogger ,想為自己的「行動版網站 ( 移動版 )」加入額外的「社群分享按鈕」,可以接著往下觀看以下的相關設置流程。 設定說明 大家如果用手機瀏覽自己的 Blogger 行動版網頁會發現,在文章最下方頁腳區塊預設的分享按鈕為一個土色隱藏跳出式按鈕,及一個 Google+ 數值式分享按鈕。如下圖: 完成後的狀態為,去除內建的 Google+ 按鈕,保留土色的跳出式按鈕,增加 LINE 及 Facebook 、 Google+ 、 Twitter 等數值式按鈕。如下圖: 相關連結 Line 官方網站|用 Line 傳送「 https://media.line.me/howto/zh-hant/ 」 範例 DEMO 頁面|行動版網頁:「 行動版 」 設置流程 開啟「自訂」Blogger 行動範本 範本中找查需要置入分享按鈕的程式碼區段 文章頁腳加入社群分享按鈕程式碼 部署分享按鈕「JS、CSS」 隱藏行動範本跳出式按鈕 設置前準備 若對編譯 Blogger 的 HTML 模板還不太熟悉,建議先執行『 備份 Blogger 模板 (範本) 』的動作,以防原始模板資料遺失。 設定教學 Step 1 開啟「自訂」Blogger 行動範本 如果想在行動版網站中添加額外的小工具、CSS、廣告或是分享按鈕,就得開啟 Blogger 行動版範本的「自訂」功能。 登入 Blogger 後,前往 Blogger 後台,「範本〉行動服務」點擊【 齒輪 】。 在跳出來的畫面中圈選,『⓪ 是,在行動裝置上顯示行動範本」〉「選擇行動範本 \ 自訂」〉【儲存】。 Step 2 範本中找查需要置入分享按鈕的程式碼區段 接著點擊【範本〉編輯 H

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

圖片
Blogger 網誌模板範本應用 教學 :最近更換 Blogger 模版,試裝「 Disqus 留言板 」的時候發現,用 Disqus 官方的 Blogger ( 小工具 ) 安裝法安裝 留言板 ,在安裝完成後留言板已經可以直接使用了!留言框只會出現在文章頁面。 早前介紹過一篇「 Blogger 安裝 Disqus 社群聚合留言板 」 ,是於 Blogger 後台中使用「編輯HTML」的方式安裝 Disqus 留言板,動作繁複且容昜把 Blogger 模板的 HTML 弄的亂亂的。 會使用該方式安裝是因為用原本官方提供的 Blogger 安裝法安裝 Disqus 留言板,在網站中的每一個頁面都會出現留言框,所以才用更改 HTML 的方式安裝 Disqus 留言板 ( HTML 方式安裝完成後只會出現在文章頁面 ) 。 既然現在直接用「新增小工具」就可以安裝使用,當然一樣把安裝流程記錄下來,以供未來安裝時方便查閱。 相關連結 DISQUS 官方網站「 http://disqus.com/ 」 範例 DEMO 頁面|電腦版網頁:「 電腦版 」 範例 DEMO 頁面|行動版網頁:「 行動版 」 設定流程 註冊 Disqus 帳號 用 Blogger 的「新增小工具」安裝 Disqus 留言板 讓留言板相容 IE 瀏覽器,在首頁及文章頁面顯示留言數 同步 Blogger 留言至 Disqus 留言板 導入 Blogger 留言至 Disqus 留言板 驗證 Disqus 電子郵件註冊信 驗證 Disqus 安裝 讓 Disqus 留言版,在行動版網頁顯示 設置前準備 若對編譯 Blogger 的 HTML 模板還不太熟悉,建議先執行『 備份 Blogger 模板 (範本) 』的動作,以防原始模板資料遺失。 設定教學 Step 1 註冊 Disqus 帳號 進入 DISQUS 官網,按下畫面中的「Add Disqus to Your Site」 輸入要登入的「帳號名稱、電子郵件、登入的密碼」,按下『Next step』 輸入「網站名稱、Disqus帳號網址、網站屬性」,點擊『Finish registration』 Step 2

繼續閱讀: