華燈初上

Joomla! 資訊網站

  • 首頁
    • 會員使用條款
    • 隱私權政策
  • Joomla!
    • Joomla! 新聞
    • J2Store 教學
    • Joomla! 核心
    • 元件文章
    • 佈景主題文章
    • 經驗、觀念分享
    • 外部網路資源
  • 書籍與授課
    • Joomla! 書籍簡介
    • 簡報分享
  • 討論區
  • 留言板
  • 會員登入
    註冊
    • 忘記你的帳號?
    • 忘記你的密碼?

    使用社群網站帳號登入

    你目前位置:  
  1. 首頁
  2. Joomla!
  3. 元件文章
  4. favicon 製作最速傳說:Phoca Favicon
18 十一月 2010

favicon 製作最速傳說:Phoca Favicon

利用 favicon 讓網址圖示與眾不同

  朋友們有沒有發現在瀏覽器書籤功能 (或「我的最愛」) 中,有些網站名稱前面會有自己的圖示?透過在網站根目錄 (或網站佈景主題目錄) 放置名為 "favicon.ico" (圖片格式為 16 x 16,256色的點陣圖檔)圖檔,並且在顯示網站畫面的檔案 (例如:index.html,index.php) 加入 HTML 語法:

{code}<link rel="shortcut icon" href="favicon.ico">{/code}

  瀏覽器就會將網址列前的顯示圖示改為顯示 favicon 囉。


增添 favicon 讓網站更容易識別 (以 Google 為例)

 

  以上動作對熟悉 HTML 語法的朋友來說不難達成,不過是否有更輕鬆的方法呢?有的,就是 "Phoca Favicon" 元件。

Phoca Favicon 基本資料

  • 程式名稱:Phoca Favicon
  • JED 網址:http://extensions.joomla.org/extensions/style-a-design/design/3343
  • 相關文件:http://www.phoca.cz/documentation/section/4-phoca-favicon (英文)
  • 許可證:GPL v2 或其後版本
  • 類型:非商業化
  • 安裝需求:Joomla!1.5.x 穩定版本,PHP 4.4.1 以後版本 (GD 函數庫已啟動)

Phoca Favicon 元件使用說明

  Phoca Favicon 在安裝過程中會建立 "images/phocafavicon" 資料夾,請透過後台「媒體管理」功能或是 FTP 方式將要製作 favicon 的圖片上傳至此資料夾,然後點選「製作 Favicon」開始製作屬於自己的 favicon。


 

  製作 favicon 步驟如下:

  1. 選擇要指定的背景主題。
  2. 選擇建立 favicon 要用的原始圖片。
  3. 點選右上方的「建立」,favicon 建立完成。

簡單三個步驟,favicon 製作完成!

favicon 原始圖片使用建議:

  • 圖片寬度與高度盡量一致。
  • 圖片內容與線條盡量簡單化,讓輸出結果更完整。

變更 favicon 之前的樣子,顯示的是 Joomla! 圖案  使用 Phoca Favicon 之後,網站有了自己的 favicon 囉!

注意事項及結語

  製作好 favicon 之後,朋友需將瀏覽器的快取資料清除,同時重新開啟瀏覽器 (包含所有分頁) 之後才會看到新的 favicon 顯示,所以如果重新讀取網站內容卻看不到製作好的 favicon 出現,請記得執行上述動作喔。

 

  如果朋友想為不同的佈景主題製作專屬的 favicon,或是有經常更改 favicon 的需求,Phoca Favicon 元件會是個簡單、迅速的解決方案。朋友可透過以下連結下載中文介面的 Phoca Favicon 元件使用,如果覺得此元件好用的話也請別忘記到元件的 JED 網址幫原作者打打氣 ^^。

文後感想

  原先阿寶並沒有規劃 Phoca Favicon 元件的中文化動作,只是後來想到:大部分接觸 Joomla! 的朋友其實都不是網站製作方面的專門人員,如果能夠透過元件運作的方式減少修改程式碼 (html, php...) 的機會,那麼就應該多做一些,讓建構網站的人員能把多花點時間在自己能著力的地方。就在這個思維下阿寶開始進行元件的中文化以及介紹文章,希望這些努力能夠對使用 Joomla! 的朋友幫上忙。

back to top
  • 上一篇文章:加入 Youtube 影片至 Phoca Gallery 加入 Youtube 影片至 Phoca Gallery
  • 下一篇文章:設定簡單,具備驗證功能的留言板元件:Phoca Guestbook 設定簡單,具備驗證功能的留言板元件:Phoca Guestbook

服務條款 隱私權條款© 1999 - 2019 創用 CC 授權條款華燈初上由 A-Bo Lee 製作,以創用CC 姓名標示-非商業性-禁止改作 3.0 台灣 授權條款釋出。All Rights Reserved. Powered by Helix3

Joomla!® is the trademark of Open Source Matters, Inc. in the United States and other countries. The Joomla!® name is used under a limited license granted by Open Source Matters. 華燈初上 is not affiliated with or endorsed by Open Source Matters or the Joomla! Project.

  • 首頁
    • 會員使用條款
    • 隱私權政策
  • Joomla!
    • Joomla! 新聞
    • J2Store 教學
    • Joomla! 核心
    • 元件文章
    • 佈景主題文章
    • 經驗、觀念分享
    • 外部網路資源
  • 書籍與授課
    • Joomla! 書籍簡介
    • 簡報分享
  • 討論區
  • 留言板
  • 會員登入
 
為使您有最好的使用體驗,本網站使用 cookies 功能記錄您的喜好。
We use cookies to ensure that we give you the best experience on our website.
我同意 / I accept