輕鬆打造網站置頂公告,抓住訪客注意力!
![輕鬆打造網站置頂公告,抓住訪客注意力!](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh7EL45fhqo3bZ92YiguoHd0hTGrjHwEycMZDfUDrKXlxmsKCKPuHdo4-Vj_oeFXyJiNCcSVMTZ1hqPfw7eQTPp8obAnx79_3tfMIVei5HkAAXlOary-Ur06GoYE4c3aP3SQZD5ATzBTQMhczcqdeGEygYlqoWSAKZYpDmGj4zw2LJFEJ9n77FjEFCb4g/s1600/website-top-bulletin.jpg)
大部分情況下網站公告通常放在首頁,或是有經營 FB 粉絲團、社群媒體的話,重大事情在社群發佈的效果會比較好。然而這樣的處理方式,只能將公告內容擴散給粉絲。至於非粉絲的話,例如從搜尋引擎而來、或從別的網站連結過來的訪客,基本上只會到達文章頁面,不會看到首頁或社群媒體。 所以網站最...
繼續閱讀全文利用 Instagram 基本顯示 API 取得圖片
![利用 Instagram 基本顯示 API 取得圖片](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg3WAbJAyQTvAgbvZSmcldAlyMv74AvPQAERxCBAGMkQor8LiSFwwyGyUnsyQg2VNK-ronRl5QDLysP9JQg0ikCtClSkoGcJNPvL2_HM51uA5L6fkEIqH5caV7KNtILCCiKz1KL2gEakXET/s1600/instagram-widget-sidebar.jpg)
IG 原本很方便就能存取圖片,做成各種小工具在網站展示,例如「 在部落格側邊欄安裝 Instagram 小工具,顯示九宮格圖片 」。 不過 IG 被 FB 收購後,於日前宣布舊的 IG API 於 2020 年 6 月 30 日失效,請參考「 IG 官網公告 」。此公告並說明...
繼續閱讀全文舊版 Instagram API 於2020年3月底失效,請更新 IG 九宮格圖片外掛
![舊版 Instagram API 於2020年3月底失效,請更新 IG 九宮格圖片外掛](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg3WAbJAyQTvAgbvZSmcldAlyMv74AvPQAERxCBAGMkQor8LiSFwwyGyUnsyQg2VNK-ronRl5QDLysP9JQg0ikCtClSkoGcJNPvL2_HM51uA5L6fkEIqH5caV7KNtILCCiKz1KL2gEakXET/s1600/instagram-widget-sidebar.jpg)
去年寫過「 部落格側邊欄 Instagram 九宮格圖片 」外掛,不過最近協助安裝 IG 圖片外掛時,發現原本提供免費取得 access token(存取權杖)的線上服務「 Pixel Union 發佈了一則聲明 」,中文意思大概是這樣: 2020 年 3 月 31 日之後...
繼續閱讀全文忘了備份要如何救回部落格網站文章內容、圖片
![忘了備份要如何救回部落格網站文章內容、圖片](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg-6SAe8H-fGfAvHvAyVVy_u976Wy4uF7Nn6nbcWNgkryDl3HscH4RabD2rTq9tkhwSlsld1dP04tU0GNh_VtS0Z2ldCCSaBfdRDOk2817TBew6T77qtNMc-yDxnGFh_T0hQiFCiFvvUuD8/s1600/web-page-recover-content-image-wayback-machine.jpg)
最近接到一個比較罕見的需求,案主表示 Blogger 每篇文章設定的「搜尋說明」(可參考「 Blogger 文章設定 」→「六、搜尋說明」),在今年 5~6 月間的文章都不見了,詢問有沒有辦法可以救回。 以前曾寫過「 Blogger 網站消失 」、「 Blogger 文章誤刪...
繼續閱讀全文在網頁擺放 FB 即時通按鈕(免裝外掛),讓訪客線上即時聯絡
![在網頁擺放 FB 即時通按鈕(免裝外掛),讓訪客線上即時聯絡](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgb0qUnXahVzOgtVmYU5Gczo6JxCTNWbnqjxhevGojyWS1_7bc3Faxc2RMAH9SMIEt1h2xHrtbTP3DoHLijJPBIKB9FQsiHAXmWe-p7w5PCvFEh7HZUE9trDokM5Bm6VTXJUdExK958ysQs/s1600/fb-messenger-online-chat-without-plugin.jpg)
前陣子在「 CC0 免費圖庫搜尋引擎 」右下角,放了一個「錯誤回報」的按鈕,讓訪客可以即時留言回報站方。 這類的浮動按鈕很醒目,效果會比導覽列或頁尾的「聯絡站長」這類連結好一些。如果是熟悉網站動線的訪客,一般會知道去哪找留言板,但可惜很多使用者不一定熟悉網路或網站的通用設計。...
繼續閱讀全文在部落格側邊欄安裝 Instagram 小工具,顯示九宮格圖片
![在部落格側邊欄安裝 Instagram 小工具,顯示九宮格圖片](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg3WAbJAyQTvAgbvZSmcldAlyMv74AvPQAERxCBAGMkQor8LiSFwwyGyUnsyQg2VNK-ronRl5QDLysP9JQg0ikCtClSkoGcJNPvL2_HM51uA5L6fkEIqH5caV7KNtILCCiKz1KL2gEakXET/s1600/instagram-widget-sidebar.jpg)
2020.7.14 公告: Instagram 官方宣布在 2020 六月底舊的 API 失效,所以本篇的工具已無效用,需要新的工具請參考「 利用 Instagram 基本顯示 API 取得圖片 」。 前陣子接到一個需求,希望在網站側邊欄擺放 IG 小工具,能顯示 9 張圖...
繼續閱讀全文各種「網頁失效連結」檢測工具評價分析及使用心得
![各種「網頁失效連結」檢測工具評價分析及使用心得](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh3hYCNDtkvL5N5uY94VpTnuxry4ND7Ac1nFL7wvz7t7jM-B8fg6K7Jhio1G6HHlO-t94iF8mlj0SoimZCK7TRbhiasFtM-5WxNrXngPOJBmOP3zcBXvO7Yp5Jto29dCOa3VmUJ1RkSdD0K/s1600/web-broken-link-checker.jpg)
以往都是使用「 Google 網站管理員 」定期檢查有無索引錯誤,也就是內部有沒有 404 無效連結。由於以前覺得文章數跟大站相比不算多,不怎麼注意外部連結會失效的問題,不過最近「 Google+ 關閉 」、「樂多」停業後,網站會產生大量的無效連結,覺得也該是時候來檢查一下網站的...
繼續閱讀全文Blogger 或部落格使用 Markdown 加快寫作速度的各種方案優劣分析
![Blogger 或部落格使用 Markdown 加快寫作速度的各種方案優劣分析](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgtG3srl_fHwkiage9SVO3bFjGEYYONjY3kO2mUHx9HnKhfWarnRQSVlW4vlMQ1WU4B_-HbIWrSUqqF1yIXC_1SYBaKVRHliabImWE18ztCe2MM1DNcMYF5qqtcf7ZP3F2M2HuOwvBHLtKP/s1600/blogger-markdown-solutions.jpg)
前陣子有讀者在「 Blogger 文章相關工具 」留言,詢問 Blogger 使用 Markdown 撰寫所發生的問題。雖然以前大致瞭解過 Markdown 的用法,但沒發表過相關文章,那麼現在就藉機會整理一下相關資料。 許多 Markdown 愛用者會希望 Blogger ...
繼續閱讀全文讓 FB 粉絲團評論星等在網頁顯示﹍製作流程研究
![讓 FB 粉絲團評論星等在網頁顯示﹍製作流程研究](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhWHpSxYXYf-SQcM1oAVnbitxmscRcXYHnhpDTgpRXtTfQafXUrkHKzSuTtv6ppoy8_5LAoJcxVhRHD85cuOLF3zWxoWhFwLk1KHiIIpxF5HR8pp_p4hSpj-U7BzqrCMVHHZMXNI9JhnXTL/s1600/fb-fanpage-rating-review-widget.jpg)
上一篇研究完「 讓 Google 商家評論星等在網頁顯示 」後,本篇繼續研究如何取得 Facebook 粉絲團評論星等的資料。 這次 FB 的處理流程沒有 Google 商家那麼繁瑣,但為了安全性因素,FB API 必須由後端呼叫,代表前後端都要處理,所以本篇仍舊無法提供安裝...
繼續閱讀全文讓 Google 商家評論星等在網頁顯示﹍製作流程研究
![讓 Google 商家評論星等在網頁顯示﹍製作流程研究](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEghaV4BfZZQVjwFzsYCO8kNonoy5R-1-3w8kHjRE_e0uBVInXogXWjyoTY5iRE4wAIRevHv6GmDMAfqo2uAMN2wQrktPcjpfx_27JFXMljGqFubpIHV691raLmblDjhGcElv79giWBPr0WP/s1600/google-my-business-rating-review-widget.jpg)
前陣子接到需求,希望在網頁上顯示「 Google 我的商家 」使用者評論內容、及評價星等。這個概念引起我的興趣,因為會是有力的行銷工具。 現在商家經營 SEO 需要的手法比過去複雜很多,除了基本的網站要顧,Facebook 粉絲團也不能荒廢,如上圖,Google 搜尋結...
繼續閱讀全文台灣縣市鄉鎮郵遞區號 下拉選單外掛 TWzipcode 使用心得
![台灣縣市鄉鎮郵遞區號 下拉選單外掛 TWzipcode 使用心得](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgqC5uQzi96DmGXe1pAULRomzY8z4DtblURrvePU4pEi7cd_-pz5L95PaLQJ57h9uUzYPAUaM6JoRQnGbztVqPdxtNdFEX4hGkyjODoY_mo7KwtC02tQ0YjmFe4Iv5N1grZeitb4IjZp032/s1600/taiwan-county-town-zip-address-twzipcode.jpg)
填寫會員資料的表單,大多需要輸入地址,不過自己製作「縣市」、「鄉鎮地區」的下拉選單其實很麻煩,而且最好也要提供郵遞區號,因為填表者自己不一定記得住。 本篇介紹的這個 jQuery 外掛 TWzipcode,可以完美地解決這些麻煩事,同時也會分享實作的心得。
繼續閱讀全文讓 Blogger 網站可以向訂閱者發佈通知﹍OneSignal 網頁推播訊息外掛
![讓 Blogger 網站可以向訂閱者發佈通知﹍OneSignal 網頁推播訊息外掛](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjdPk8CMh00KqGnM0HnHwYn2zROef_LaNYHtlL5SXhQPXKSvgqtV0cFg54NEZdnGvfNlUTnctvtsbvrqYRH97q3DLM3MFWgA-EWjwjv2h6YupvKz5ILy34VCPQmlolDg5VzkPdNY8SpD5vY/s640/onesignal-web-push-notification.jpg)
也許你曾逛過某些網站,瀏覽器會自動彈出這樣的訊息: 如果按「允許」的話,那麼日後這個網站有新文章,或是有公告訊息,瀏覽器就會傳送訊息給你。 這是 HTML5 的網頁推播技術,在 RSS、Email 訂閱式微的今天,對於站長們是很便利的一項福音,讀者只要打開瀏覽器,就能...
繼續閱讀全文讓訪客能自行放大網頁文字,提升友善閱讀體驗
![讓訪客能自行放大網頁文字,提升友善閱讀體驗](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgowPLj_Rvo3EPT2JO1skH3AANe6Qtqr_R8C20pFPI7n_s7eLc7aBmwFaTPngEYfRjtyxhEecF15dOdFYVpxoiP4itkfD49r-oHVJMtvi86gLCyUZ3d6Ov2QLVYgrGSzdpQnbXRjHMmxodS/s1600/website-zoom-in-out-text-button.jpg)
閱讀網路文章時,不免會遇到某些網頁的預設文字過小,不但看起來不舒服,也加重了眼睛的負擔。過去曾介紹過 Chrome 的外掛「 讓 Chrome 只放大縮小文字(Zoom Text Only 套件) 」,可以單獨調整文字的大小,讓我們閱讀文章時更舒服。 但並非每個訪客都會安裝這...
繼續閱讀全文專業又有質感的網頁文章註解外掛 BigFoot﹍CDN 安裝懶人包
![專業又有質感的網頁文章註解外掛 BigFoot﹍CDN 安裝懶人包](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEizwaqilcSimD2UVjamB6pVZDuSPN467bsd-N-DaQnRQxehmAyYAuVHf_9Au-qk2V7AKZXDMMMWXSkCsNCdZfa0Kas1sA5TL3v7MK9GhvL3tERvb2QyMSPSO3mkVbkYEIYCGe89n3hQGi9P/s640/post-footnote-bigfoot-js.jpg)
前陣子有案主需要將文章中的註腳功能,結合資料庫進行管理,也就是讓多處重複的註解,可以直接從試算表讀取,而不必一筆筆註釋。 因為這個案子而接觸到這個文章註腳外掛「 BigFoot 」,測試之後覺得效果跟質感都很好,比之前在「 jQuery 展開收合效果安裝懶人包 」介紹的另一個...
繼續閱讀全文安裝 PAYPAL 贊助+分期付款(訂閱)按鈕﹍以及使用心得
![安裝 PAYPAL 贊助+分期付款(訂閱)按鈕﹍以及使用心得](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhtNWi7J-Py9sZEoYk0WyxopkoFo9zhWMpDPQIHWE5cgORxCv0fr_sLXGzeEpCLU3goOy2mWfahYwBdYdiQY8BEDdDnmjVRaLGYl4-aPXnAa6hGCfwe4_dQmafavoy1MhMW2TnXwlv1r3ZJ/s640/paypal-button.jpg)
前陣子幫讀者處理 PAYPAL 贊助按鈕的設置,加上還有分期付款的需求,藉這機會整理一下心得,讓有需要的讀者參考。 雖然網站很久以前就放了 PAYPAL 贊助按鈕,不過到後來發現贊助的使用率較少,反而是支付的使用較多。因為轉帳對於某些族群比較麻煩,而 PAYPAL 的「 信用...
繼續閱讀全文標頭 Banner 隨機輪播熱門文章﹍提高網站點閱率
![標頭 Banner 隨機輪播熱門文章﹍提高網站點閱率](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjqctBzaq1y4lIAWLLARIYmRtZW1dMkIceDuEcb2zDQ0ld1v9TX0-OqUH-bW1Rhji6mUGAOQqO4sRhST5DFge-cd8pcSijZcGyYqgm2HGjt7-wURWHbwtTwbh56ye8JdPTFIohh7PIm01w6/s640/banner-random-popular-post.jpg)
相信在逛網站的時候,越上方的位置、越吸睛的圖片比較能吸引到目光,因此我們很常看到輪播圖片的小工具,被擺放在網頁最上方的位置。 這不是沒有道理的,根據「 F 形眼球運動軌跡 」,多數訪客的行為模式就是如此。 如果想推銷網站的熱門文章,那麼在網頁上方擺放輪播圖片,會是一個增加...
繼續閱讀全文[教學] 快速回到網頁上方 Go Top 按鈕 + 各種動畫效果(CSS / jQuery)
![[教學] 快速回到網頁上方 Go Top 按鈕 + 各種動畫效果(CSS / jQuery)](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgP61JneX54-Gh_wqY6PI5iiJK7dNDVtUBFDBOS3Ix6jIwqy1yA9HK_CrM_Bw9dCvO4KAKtFgL_WZtgAXSCeZbCJBXFtCxcesQKP0MDqfAOY_fYRwm2-3IuysGYusKiPEiJFRT0R7HixEPZ/s1600/go-top-button-animation.jpg)
(Pic from: keytothecity.co.uk ) 之前做過兩個「回到頂端」按鈕的版本,分別是「 Go Top 按鈕符合使用者體驗的友善設計 」、「 Go Top 按鈕放在浮動導覽列 」。最近處理的 case 需要炫一點的特效,因此將之前的版本增加一些動畫效果。 ...
繼續閱讀全文讓網頁根據訪客語言設定, 自動轉換簡繁文字 (切換按鈕升級版)
![讓網頁根據訪客語言設定, 自動轉換簡繁文字 (切換按鈕升級版)](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhG8T8hdhx9EdtUqdDpuAgRF2WdnufHuW_6rYhE37SG5GMAOcesBEavbZqYGQqk6TUFRzuIWPa89amJ9Z-yPipjVT1lYL4jscSz2jSC595sThprKNK2B0pdQFYABPStvbTFRnthhxbawI5B/s1600/tw-zh-update.jpg)
上一個版本「 相容各大瀏覽器的全網頁簡繁快速轉換語法__更新版 」FB 留言 Herman Tsao 詢問「 能做成依瀏覽器語言做自動轉換嗎? 」,其實偵測訪客的瀏覽器語言設定是做得到的,我們應該有這樣的經驗,某些安裝 Google 翻譯的網站,能得知我們的預設語言,在畫面上自動...
繼續閱讀全文雖然 PageRank 停止更新,沒關係還有 MozRank
![雖然 PageRank 停止更新,沒關係還有 MozRank](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhhUCJMNsFfI283R49zNY9hqXcKcwPK6pz2i53EGDYgp7Y-oruQnhreCNftIDnQV4XrqiaHnzpSZ2ZLiyi6mJZLZPsaxfnszAPfFSeK55tMky5_Zr1m8TeStD_QX4nQWFS65yqUR3DisBHp/s1600/mozrank.jpg)
這個「 Blogger 中文社群討論串 」提到了 Google 不再更新 PageRank 的消息,而這件事 Google 很久以前便開始預告,PageRank 的數字也有很長的一段時間沒有變動,越來越少看到網站掛上 PageRank 貼紙。 為何 Google 這麼做,想瞭...
繼續閱讀全文想知道自己網站的台灣或全球排名嗎?安裝 Alexa 貼紙秀給訪客看
![想知道自己網站的台灣或全球排名嗎?安裝 Alexa 貼紙秀給訪客看](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjPpdLM5qAz-qN950cl-9IXuRdzfG8l0Qy_rk7IJ-oS_H_hZAMjDtze3DRvovrLk5nWBODW4zJdIgqCtthvcfdp2BG3xxZ16bR2zREfi5oGFdRV4OQjItbf3O7S5pEOyyPerFwOwAjXcQrc/s1600/Alexa.jpg)
(Pic from: seomastering.com ) 經營部落格一段時間後,如果小有人氣的話,站長們可能都會好奇,自己的網站在台灣能排上第幾名呢?其實對於這件事,能提供具有公信力的來源並不多,在亞洲地區可以申請加入「 博勢力 」的部落格排行榜。不過由於分類很多,且參加排行...
繼續閱讀全文