如何讓星級評價效果以百分比呈現﹍CSS 技巧詳解

最近接到需求要在網頁呈現「五顆星評等」的效果,就像搜尋結果常會看到的星級評等: 或 Google 商家的評分星等: 從上面的示意圖可發現,以 5 分為滿分的情況下,4.5 分(也就是 90%)所呈現的星等並非 4 星(無條件捨去法),也不是 5 星(四捨五入法...

繼續閱讀全文

使用跨域代理伺服器(CORS PROXY),解決讀取第三方網站資料問題﹍實作範例

前端開發人員寫 JS 遇到需要串接第三方 API,或是想存取第三方網站的資料時,遲早會遇到跨域限制的問題。 跨域(Cross-Origin Resource Sharing)的原理可參考這篇「 跨來源資源共用 」,因為安全性考量,網站主幾可設定收到 HTTP 請求時,是否...

繼續閱讀全文

讓 Google 商家評論星等在網頁顯示﹍製作流程研究

前陣子接到需求,希望在網頁上顯示「 Google 我的商家 」使用者評論內容、及評價星等。這個概念引起我的興趣,因為會是有力的行銷工具。 現在商家經營 SEO 需要的手法比過去複雜很多,除了基本的網站要顧,Facebook 粉絲團也不能荒廢,如上圖,Google 搜...

繼續閱讀全文

解決浮動導覽列遮住錨點位置的問題﹍CSS 技巧

網站使用「 浮動導覽列 」可提供友善的閱讀體驗,讓導覽列隨時保持在網頁最上方,訪客失焦時能重新找到方向。 不過這個設計後來發現有個隱藏的缺點,當網站使用了錨點後,訪客點擊錨點時,螢幕捲到的位置看起來怪怪的。 本站為了解決此現象,過去曾調高錨點的位置(放置隱藏的錨點),...

繼續閱讀全文

Blogger 架設電商購物車網站前,需要先考量這些問題

接到的 Blogger 商業架站需求中,有一小部分希望能購物後進行結帳,也就是需要購物車系統。由於 Blogger 是純前端的平台,就算能實現購物車功能,整個購物流程、機制、商品銷售及售後管理,一定比不上自架站的購物車系統。 那麼想要在 Blogger 架設購物車功能的...

繼續閱讀全文

商業形象網站使用 Blogger 一頁式版型,有助於提升專業度及 SEO

前陣子一個架站案例滿有參考價值的,案主一開始這麼說: 我知道 seo 的王道是內容行銷,所以我花蠻多心力在寫一些我專業領域內的文章,但前幾個月,我發現競爭對手的網站,本來排名很後面,也沒什麼在做內容行銷,但他自從請人重整網站後,seo 排名馬上就超前... 通常架站遇到...

繼續閱讀全文
TOP