「BLOGGER 中文論壇」正式成立

Blogger 長久以來在中文環境下,沒有能匯集使用者、進行交流分享的專屬討論區。將近三年前,WFU 在 Google+ 成立了「 Blogger中文社群 」,作為中文環境的 Blogger 討論區之用。一開始在 G+ 社群功能剛發佈的推手下,討論算是十分熱絡。不過隨著時間拉長,...

繼續閱讀全文

將網頁所有網址字串轉換為超連結

雖然「 超連結 」語法不難,但終究多數的訪客並不熟悉程式語言、不瞭解 HTML 碼,那麼在留言、發表意見時,若需要引用網址,訪客是不會使用 A 標籤語法的,只會直接貼上 http 開頭的網址連結字串。 如此一來,留言中的網址連結無法點擊,不利於資訊傳播。因此我們可以看到 Fa...

繼續閱讀全文

讓網頁表格能自動排序﹍TableSorter 安裝懶人包 (CDN)

前陣子製作「 CSS 色碼英文名稱對照表一覽 」時,需要一個 "讓表格能排序" 的功能,這樣讀者就能依照自己需求,針對不同欄位進行排序,如此查找資料非常方便,算是一個「友善的使用者體驗」。 因此研究了一下網頁表格排序的功能,本篇記錄一下處理的心得,並將安裝...

繼續閱讀全文

CSS 色碼英文名稱對照表一覽﹍快速挑選好看的顏色

之前看到這篇「 CSS1-CSS3 顏色知識知多少? 」,整理了所有 "可用英文命名" 的顏色及色碼,這樣的表格對於查找顏色還滿不錯的。 由於原作者的表格,是依照 CSS1 ~ CSS3 的順序來編排,算是學術用途。我把這個表格整理了一下,變成可以依照英文...

繼續閱讀全文

Blogger 首頁文章怎麼消失了?

其實這個問題已經趨近每月一問,由於出現次數頻繁,乾脆整理成一篇,以後直接給此篇連結就好。 要瞭解這個問題之前,得先瞭解 Blogger 的官方限制。知道原理之後,就能理解解決方法了。

繼續閱讀全文

避免使用 PICASA 網路相簿圖片外連,會造成 Google+ 及 Blogger 縮圖失效

之前曾寫過一篇「 Google Drive 當圖床對 Blogger 的不好影響__使用 Picasa 的三大好處 」,主要是因為 PICASA 的圖片網址,能夠產生各種縮圖尺寸,這算是 Google 非常高竿的獨家技術。 不過 Google 前陣子推出了同質性的新產品「 G...

繼續閱讀全文

Blogger 放大留言頭像尺寸的 JS 語法

過去曾寫了幾篇關於修改 Blogger 頭像尺寸的文章,例如「 舊範本修改各種身份頭像 」、「 新範本修改留言頭像尺寸及形狀的 CSS 語法 」。 不過最近 +toa to 於這個「 Blogger 中文社群討論串 」表示, "最近發現,雖然把頭像變大了,但網址還...

繼續閱讀全文

安裝 PAYPAL 贊助+分期付款(訂閱)按鈕﹍以及使用心得

前陣子幫讀者處理 PAYPAL 贊助按鈕的設置,加上還有分期付款的需求,藉這機會整理一下心得,讓有需要的讀者參考。 雖然網站很久以前就放了 PAYPAL 贊助按鈕,不過到後來發現贊助的使用率較少,反而是支付的使用較多。因為轉帳對於某些族群比較麻煩,而 PAYPAL 的「 信用...

繼續閱讀全文

網頁使用自製紋理背景﹍雜點+拔絲+再生紙效果實作 [CSS 技巧]

過去本站各個區塊一直都是使用單色背景,稍微比較沒質感,而好處是網頁載入速度會快一些。前陣子剛好有讀者詢問哪裡可以找到不錯的紋理背景圖案,因此稍微研究了一下這方面的資訊,順便幫網站背景換上自製的紋路,不過就是得稍微犧牲幾個 http 請求。 其實網路上的免費背景圖資源非常多,可...

繼續閱讀全文

部落格「會員系統」啟用

從去年九月「 會員中心 」試營運以來,最近終於將預計規劃的功能全部上線,同時也感謝讀者的支持,目前已經累積了超過一千名會員。 究竟為何需要加入會員?使用會員中心有什麼好處?正式營運又有什麼優惠呢?請見以下詳細的說明。

繼續閱讀全文

讓 Google 問卷(表單)能自動計分 V2

由於 Google Drive 全面更新為新版雲端硬碟,過去曾寫過的「 讓 Google 試算表製作的問卷試題能自動計分 」,某些舊試算表函數功能已經被廢除,導致在新版試算表,將無法執行舊版自動計分的功能。 如果你的 Google Drive 還保有一些舊版檔案,那麼或許可以...

繼續閱讀全文

會員中心贈送點數限時活動 (20150706 - 0715)

20150716 公告: 解答已公佈在「二、作答題目」 試營運已久的「 會員中心 」,最近即將宣布正式營運,同時也會有一系列活動,例如開幕期間,「會員加值文章」 所有的 "Blogger 工具" 都只要 50 點即可兌換 。 如果你是長期關注本站的忠實...

繼續閱讀全文

讓網頁顯示特定中文字型﹍安裝實作教學

在網站使用中文字型是個大問題,由於字型檔在現有的網路速度下,過長的傳輸時間讓我們不能隨心所欲使用喜歡的字型,也因為如此,只能遷就訪客作業系統現有的字型,例如「 網頁中文字型除了微軟正黑體, 還有這些好選擇! 」。 這篇「 使用 UNICODE 特殊符號取代網頁小圖示 」,使用...

繼續閱讀全文

Facebook 停止發佈粉絲頁 RSS﹍目前只剩這個替代方案能訂閱

之前製作了「 FB 粉絲頁 RSS 網址線上產生器 」,很可惜撐不到一年,日前該篇文章留言 #5 有讀者通知:「6/23 Rss for FB service has been closed down」,意思就是 FB 不支援粉絲頁的 RSS 了。 既然 FB 不玩了,那麼這...

繼續閱讀全文

取代 ICON FONT 網頁小圖示的好選擇﹍UNICODE 特殊符號

你的網站是否也用了很多小圖示,例如 "首頁"、"留言對話泡泡"、"Email" 等等?這些圖檔雖然體積小,但每個檔案的載入都需要耗費一個 http 請求,是影響網頁載入速度的一個小原因。 最早為了解決這個問題,出現「...

繼續閱讀全文

如何讓 Unicode 表情圖案 (特殊符號) 在網頁上正常顯示?

上一篇「 Unicode 表情圖案(emoji ) + 特殊符號字元一覽表 」,展示了許多可以取代網站小圖示的 UNICODE,其優點非常顯而易見: 1. 字元的傳輸量遠低於圖片的傳輸量 2. 可以 減少許多小圖示的 http 請求量 相信對於在意網站效能的站長而言,以...

繼續閱讀全文

Unicode 表情圖案(emoji ) + 特殊符號字元一覽表

網頁常常會用到一些小圖示,例如搜尋框、郵件圖示、留言對話泡泡等。最簡單的方法可以直接 Google 這些圖示、或是到素材網站尋找合適的圖案,不過最近發現「 Unicode 組織 」越做越強大,很多常用的圖示都已經可以在 Unicode 編碼中找到。 而且 Unicode 非常...

繼續閱讀全文

Blogger 插入表格流程 + 自適應寬度

過去就曾耳聞 Blogger 文章中插入表格(table)時,會遇到一些狀況,不過直到最近需要在網站整理一些表格,才有這個機會來研究這個主題。 Blogger 文章編輯器其實問題不少,過去曾整理過一篇「 Blogger 文章編輯模式只要切換, 就可能產生異常現象? 」。而插入...

繼續閱讀全文

Blogger 相關文章 V3

這個工具使用了「相關文章」的版本號,但其實跟「 相關文章 V2 」的市場、用途並不相同。V2 版的文章會顯示縮圖,而 V3 版完全只有文字,難不成這個工具退化了嗎? 其實他比較偏向「 系列文功能 」的風格,只列出建議閱讀清單的文章標題。但篩選方式又不同, 系列文是利用 &qu...

繼續閱讀全文

標頭 Banner 隨機輪播熱門文章﹍提高網站點閱率

相信在逛網站的時候,越上方的位置、越吸睛的圖片比較能吸引到目光,因此我們很常看到輪播圖片的小工具,被擺放在網頁最上方的位置。 這不是沒有道理的,根據「 F 形眼球運動軌跡 」,多數訪客的行為模式就是如此。 如果想推銷網站的熱門文章,那麼在網頁上方擺放輪播圖片,會是一個增加...

繼續閱讀全文

協助架設 Blogger 網站, 優化非官方範本

架設網站時使用的平台考量,用最簡單的二分法判斷,就是你需不需要使用主機。若不需要主機的話,使用雲端服務即可,沒有流量限制,這方面最好的選擇就是 Google 旗下的 Blogger 平台,沒有之一! 那什麼情況需要使用主機呢?無論是使用自己的主機、或是租用主機,都是一筆昂貴的...

繼續閱讀全文

客製 Blogger 行動版範本, 改善網頁載入效能

想要改善 Blogger 行動版的網頁載入效能,最簡單的方法是使用「官方行動版範本」。如果你的網站只是純粹分享文章,那麼的確採取這個方案即可。 如果你準備經營個人品牌、形象網站,那麼「官方行動版範本」顯然是不夠的,因為無法打造自己的版面效果,營造更好的視覺形象。 使用 R...

繼續閱讀全文

取消 Blogger 行動版「向左/向右滑」切換文章的功能

有多位讀者反應 Blogger 行動版一個非常擾民的問題,也就是操作手機時,滑動螢幕只要稍微不小心往左或往右,就會切換到「上一篇/下一篇」文章。 這個功能的設計想必是出於貼心的考量、方便訪客操作頁面的切換,但往往我們是在操作「往上/往下」時,不小心手勢的角度偏左或偏右,便會立...

繼續閱讀全文

讓 Line 按鈕只在手機+行動裝置顯示

如果網站有安裝過 Line 按鈕的話,應該會發現只有行動裝置(手機+平板)有作用,而網頁版的 Line 按鈕按下後,只會連結到官網。 前陣子有讀者反應," 能否讓 Line 按鈕只在手機及平板出現,網頁版不要出現? "。的確,如果能這麼做的話是最好,以下就...

繼續閱讀全文

[教學] 讓新版 Google 表單(試算表)能自動寄信﹍(1) 製作表單格式

之前舊版的「 讓 Google 試算表能自動寄信 」,由於近期 Google Drive 雲端硬碟陸續強制升級為新版,如果是新的使用者,已經無法依照原本的流程安裝,因為官方已經取消了舊版試算表的「指令碼庫」功能,無法從後台安裝 FormEmailer 這個自動回信外掛。 其實...

繼續閱讀全文

RWD 標頭(header)圖片實作 [CSS 技巧]

使用自適應網頁(RWD)時,標頭圖片的設計與擺放,需要一些巧思與技巧。既然希望網頁能自適應調整寬度,那麼標頭圖片自然在不同寬度之下,都不能讓訪客覺得突兀。 最近接到一個標頭圖片的需求,希望在 "不同寬度下都能填滿整個螢幕"。也許字面上不容易理解,因此用文章...

繼續閱讀全文

Blogger 各種圖片異常狀況處理﹍模糊+消失+超出版面

Blogger 圖片異常的各種提問,算是非常頻繁出現的,常見狀況大致有: 1. PICASA 上傳後的圖片看起來有點失真,但 Flickr 的就不會? 2. 手機上的圖片好像比較模糊? 3. 我的 Blogger 圖片怎麼消失了? 4. 有的圖片比較大,超出文章區塊怎麼...

繼續閱讀全文

讓標題過長的文字自動省略﹍單行 CSS 技巧

在設計版面的時候,控制區塊的寬度與高度是重要的技巧,因為文字數量或圖片尺寸非我們所能控制。當內容太多、超出了區塊的範圍,如果不熟悉 CSS 語法,沒有做適當的參數設定,輕則視覺效果變差,重則版面整個爆掉! 圖片超出區塊的調整,將會另闢一個主題。本篇先說明如何使用 CSS 語法...

繼續閱讀全文

Blogger 製作自適應網頁(RWD)﹍懶人法實作

過去在「 Blogger 應該選擇自適應範本(RWD), 還是行動版範本? 」曾經歸納出的其中一個結論,對於 "有修改能力、能處理自適應範本" 的站長,Blogger 行動版方案可以選擇「自適應範本(RWD) + 自訂行動版」,這是行動版的最佳選擇。 然而...

繼續閱讀全文

Google Drive 外連產生器 V2﹍一秒鐘輕鬆複製連結, 支援新舊版雲端硬碟

由於「 Google Drive 檔案外連功能於 2016 年 9 月關閉 」,本站過去寫的所有 Google Drive 外連產生器均已失效, 本篇產生器為 2019.7.23 更新版本,目前確實可用 。

繼續閱讀全文

讓 iOS 設備(iPhone iPad)鋰電池能正確充電、降低循環次數的技巧

這個主題其實有些爭議,某些觀點認為鋰電池是消耗品,沒什麼好保養的,說不定電池還沒壞,就準備換新的行動裝置了。在這樣的前提之下,的確電池能用多久不是需要關心的事,不過事實上,如果好好對待電池的話,還是能帶給我們不少便利。 相信很多人會遇到, 電池充飽後很快又沒電 ,也就是電量消...

繼續閱讀全文

Blogger 自訂行動版範本實作﹍(3) 工具+圖片+字體

完成 Blogger 自訂行動版「 標頭+導覽列+廣告 」、「 文章+側邊欄+頁尾 」的所有版面區塊後,現在要完成最後的收尾工作。 根據「 優化網站效能該注意哪些事? 」,加快網頁載入速度需要從 "圖片" 與 "Javascript" ...

繼續閱讀全文
TOP