深入瞭解 FireFox 七、userChrome.js 功能的強化

以下將會分為幾個章節來探討這個瀏覽器:

一、常用的附加元件
二、少用的附加元件
三、Plug-in 外掛程式
四、搜尋引擎
五、GreasMonkey 增強網頁功能!
六、免安裝版與精簡 Firefox 來加速啟動
七、userChrome.js 功能的強化
八、userChrome.css & userContent.css 介面的修改
九、火狐的安全
十、編譯版、參數、雜項跟加速
十一、自製皮膚
十二、總結

七、userChrome.js 功能的強化

前面介紹的 GreasMonkey 是使用腳本 (user.js) 來對網頁作功能上的強化,而現在所要介紹的 userChrome.js 則是使用腳本 (uc.js) 來對火狐本身增強功能!!兩者雖都是使用腳本來運作但功能不同也不互通。

藉由這個簡單的套件,Firefox真是讓我大開眼界!讓我引用一下之前我自己打的介紹:

userChromeJS
不知為何台灣這邊很少對它的討論,但這個元件讓我在從 Opera 跳到 Firefox 之後,一直無法解決的小小不滿-自定性不夠,得到解決!!
除此外,它也可以讓你用 js 腳本來達成 add-ons 的功能,藉此來讓火狐的體積更小=啟動、瀏覽更快。

以下介紹轉載自 Mozest社區(我有增減一些部分):userchrome.js 靈活的自定義擴展

在安裝此附加元件後,會載入寫在 userChrome.js 內的腳本,但若腳本太多,統一在一個文字檔中其實很難控管。因此我們將每個腳本獨立出來並用以下兩種方式來載入。

(1) 把個人設定資料夾 chrome 內的 userChrome.js 最尾端加入:

userChrome.import(“*", “UChrm");

上面這個方法是最有效率的載入方式,但對於某些腳本而言會出錯,像是 contextPopupBookmarksFolder 就無法被加載。

而另一種方式是把這個腳本 Sub-Script/Overlay Loader 的內容貼到 userChrome.js 內,雖然載入較慢,但整體支援最完整!

而上面所說的個人設定資料夾 chrome 的位置是在:

XP是在C:\Documents and Settings\使用者名稱\Application Data\Mozilla\Firefox\Profiles\8位亂數.default\chrome
Vista和win7是在C:\Users\使用者名稱\AppData\Roaming\Mozilla\Firefox\Profiles\8位亂數.default\chrome

(2) 之後只要把把各獨立腳本(*.uc.js、*.uc.xul)放在 “chrome" 下,和 userChrome.js 放在一起,重新啟動 Firefox 及可看到效果。

(3) 因為它只會載入chrome 目錄下的 .uc.js,對於其下的子資料夾並不會載入, 所以可將不想使用的腳本放在子資料夾中。

相關的討論和腳本下載可以到 Mozest社區有很多

(4) 在之後,JS 中如果想自行修改成中文選單,要轉換成 JavaScript escapes 格式,再設置到 label 中;線上轉換:

腳本收集網站
http://zoolcar9.lhukie.net/mozilla/userChromeJS/ (推薦)
http://extensions.geckozone.org/userChrome_js_scripts
http://www.xuldev.org/misc/ucjs.php(作者寫了很多好腳本,可惜很多是日語說明,這是英文說明的幾個腳本)
http://space.geocities.jp/alice0775/index2.html(腳本非常豐富,幾乎所有需要的都找的到!雖說說明是日文的但從英文檔名可略猜一二)
http://forum.moztw.org/viewtopic.php?p=99969 Moztw上的主題

Mozest論壇一位好心人收集整理的獨立腳本,很全

mozillazine上的主題

我個人使用中的腳本

腳本可以實現許多附加元件作不到的事,或者用體積極小的腳本來代替附加元件!!!
超好用的!唯一的缺點是無法自動更新……
因此,一般情況下很基礎(不容易失效)的功能我會儘可能用腳本來達成;而較需要不斷更新的就依靠附加元件。
而隨身碟版,因為要儘可能減少附加元件,所以就算是常用的功能我也會使用腳本來達成!

那麼,以下列出我個人所使用的腳本清單:

正在使用中:

1. captureWebPage_網頁截圖.uc.js

在工具列中的"工具"按鈕中,增加一個capture this Page的功能,可以直接把整個網頁畫面存成圖片

captureWebPage

2. compact_menu-隱藏工具列.uc.js

將工具列縮為一個"選單"按鈕(類似 Opera的方法),雖然也可以用附加元件達成,但用這個小小的腳本(433位元組…)就足夠了!

compact menu

3. contextPopupBookmarksFolder.uc.js

在網頁空白處的右鍵選單中增加"書籤"選單,過去沒有此功能曾是我個人從 Opera 跳過來後長久以來最大的遺憾,現在得以解決!!。

注意! 不使用 Sub-Script/Overlay Loader 的話無法使用!

context Popup Bookmarks Folder

4. olMenus-工具-添加顯示cookies、密碼管理員、憑證管理員、打開chrome資料夾.uc.js

對我來說,因為要常常修改 chrome 資料夾.,所以這個必備!

olMenus

5. paste_and_go_and_search.uc.js

在搜索列或網址列右鍵內容添加"貼上並搜尋"和"貼上並轉到",這是 Opera 首創的一個很貼心的功能,雖說附加元件也可以達到,但用這個小小的腳本(2.39Kb)就足夠了!

paste and go and search

6. smartlyCloseFindbar.uc.js

預設上搜索欄(搜尋網頁頁面內容的,ctrl+F)開啟後,除非按叉叉否則不會自動關閉;此腳本可讓它在切換分頁後自動關閉。

smartly Close Findbar

7. statusbar_zoom_panel_1.3.uc.js

在狀態欄增加一個按鈕"100%",在它上面用滑鼠滾輪捲動或右鍵可縮放頁面(左鍵返回預設大小)

statusbar zoom panel

8. StatusbarInURLBar3.uc.js

必備中的必備!!!將狀態列放到網址列裡。

一般來說,狀態列因為太下面又不顯眼,沒什麼機會去看裡面的內容;而狀態列圖示也因為和工具列相差甚遠(一個畫面寬~)所以不常用到。藉由這個套件將狀態列放到網址列中!!除了很多狀態更加顯眼,大多數狀態列圖示也更加實用了許多!!

雖然某些 Firefox佈景上可能會有所問題(要去修改佈景將狀態列背景設為透明…可參考第八章:userChrome.css&userContent.css),但這仍然是我推薦的重要的腳本!

剛用時可能要適當的調整狀態列圖示和取消顯示進度列 (參考第八章:userChrome.css&userContent.css) 但開始使用後一定會讓你有種"怎麼不預設就這樣做"的感覺!

Statusbar In URL Bar

9. TabPreview.uc.js

將滑鼠移到分頁標籤時顯示分頁內容預覽,這原本也是 Opera 的功能,因為我常常把網頁縮為一個 Icon來節省空間,因此這個功能對我來說除了美觀外也超實用!

Tab Preview

10. Textarea Sizers-調整編輯框大小.uc.js

網頁的書入框右下角增加一個小三角形,可拖曳它來增大輸入面積!

TextareaSizers

11. textLink.uc.js

自動將網頁中的文字url轉成連結(點兩下開啟)

12. ToggleFindBar-右鍵搜索列的放大鏡開搜索欄.uc.js

預設上搜索欄的開啟只能用快捷件 ctrl+F,用此腳本後等於是幫這個好用的功能增加一個開啟的按鈕。

ToggleFindBar

不使用的:

1. flexTabs.uc.js

讓分頁大小隨字數自動調整;我不使用的原因是若分頁標題超長,分頁大小就會太大(不一定每個人都認為這樣不好)

flexTabs

2. LaunchIE.uc.js

右鍵選單中增加"用 IE 查看" 直接用IE開啟網頁;但我為了推廣火狐的易用性,所以我有在頁面中切換的必要,就不使用這個小巧的腳本了。

LaunchIE

3. GrabScroll4.uc.xul

可直接拖曳移動網頁頁面,對於筆電的觸控板瀏覽網頁時很實用。

注意! 不 使用 Sub-Script/Overlay Loader 的話會無法顯示狀態列 on/off 跟設定選項!

GrabScroll4

4. AddonsDownloadsSidebar_檢視-側邊欄-添加附件元件和下載管理員.uc.js

我個人不喜歡用側邊欄 (因為開啟的話整個畫面都會跳動…)

5. CleanHide_清除隱藏文字,快捷鍵CTRL+Q.uc.js

經常在論壇複製文章的話可能需要用到。

6. Find Bar On Top.uc.js

將搜索欄置頂,這樣操作上較順手。

FindBarOnTop

7. UserContent.js

GreasMonkey 的腳本版,僅23KB (附加元件版為 57.2KB),將它解壓縮後的一個資料夾和六個文件放入 chrome 中,再把你要的 GreasMonkey 的腳本 (.user.js) 放入 content 資料夾中即可啟用,管理的話則是在"工具-userContent.js"中設定。

不使用的原因是,它在管理應用的網域上需要開啟腳本編寫,雖能自動檢測有無新版但只能手動更新,沒有附加元件版的方便!

UserContent

8. ucjs Stylish modoki

Stylish 的腳本版,僅9.92KB (附加元件版精簡後為 71.3KB),將它解壓縮後的一個資料夾和三個文件放入 chrome 中,再把你要的樣式 (.css)放入 CSS 資料夾中即可使用,管理的話是在"工具-userStylesheet"中設定。

基本上我還蠻喜歡這個腳本的,但對於"精簡"來說,我直接把我必備的樣式放入 userChrome.css 中了(參考第八章)。

ucjs Stylish Modoki

隨身碟用:

還記得我在前面不斷提及的"可用腳本代替附加元件"嗎?在此的就是為了讓隨身碟版更加輕量化而準備的,代替附加元件的腳本!

1. Easy DragToGo-精簡版.uc.js

Easy DragToGo的腳本版,拖曳圖片自動下載的下載位置為 Firefox 預設下載位置。討論帖在此

2. MouseGestures2改.uc.js

Fire Gestures 滑鼠手勢的腳本,這裡的"改"指是因為我把它的"捲到頁首\頁尾"改成了"上\下"而已~,作者的網頁在此

3. openNewTabLitest.uc.js

書籤、歷史、搜尋列開啟在新的分頁中,以此來代替管理分頁功能的附加元件。

4. TEST-快速撥號.uc.js

用 js 寫成的超簡單版本,但基本的九宮格仍可以自己編輯 js 內的網址來自定。

快速撥號

5. undoCloseTabMenuuc.js

添加「復原已關閉分頁」按紐!因為隨身碟版不想安裝管理分頁的附加元件,所以這個按鈕得另外找角本來實現。
另外,要調整按鈕的位置須要開啟腳本修改:

var refNode = document.getElementById(‘urlbar‘);

中的urlbar來決定這個按鈕要在什麼元件的右邊;搜尋列為 searchbar、網址列為 urlbar、首頁按鈕是 home-button

undoCloseTabMenu

6. zzz_ClearSearchTerm2.uc.js

讓搜尋框在搜索完後自動清空,這是我為了配合 Foobar 用的 (這樣用網址列搜索完後才會自動回覆為網址~)

小結

userChrome.js 真是太太太好用了!! 老樣子 ,我將我所有的的腳本提供在這邊,安裝 userChromeJS 後請自行把所需要的腳本從子目錄放到 chrom 資料夾中。
感覺上台灣這裡的討論真的很少……
而原創的大多又是日本人(日文不行…….)
幸好Mozest論壇有很多熱心的網友把各國的腳本翻譯成簡體來發佈,閒著沒事就去逛逛看有什麼新的功能被設計出來吧!!

  • http://奇摩 小樂

    你好﹕我看不懂脚本旦想要一種特殊腳本在信箱說不清楚 能請你用qq跟我交談嗎 我的q号1619474942
    ———————————————————————-
    回覆『小樂』:
    已經加你QQ