「製作即時摘要」修訂間的差異
出自 MozTW Wiki
(→範例) |
|||
(未顯示由 1 位使用者於中間所作的 19 次修訂) | |||
行 1: | 行 1: | ||
+ | {{MDC|製作即時摘要}} | ||
+ | |||
+ | ---- | ||
+ | |||
即時摘要來源 (microsummary generator) 內含一組從網頁中製出即時摘要的指令,而網頁能在 <code><head></code> 元素中放入 <code><link rel="microsummary"></code> 以指定適用的摘要來源。即時摘要來源檔案中如含有適用頁面列表,則也可以獨立安裝。 | 即時摘要來源 (microsummary generator) 內含一組從網頁中製出即時摘要的指令,而網頁能在 <code><head></code> 元素中放入 <code><link rel="microsummary"></code> 以指定適用的摘要來源。即時摘要來源檔案中如含有適用頁面列表,則也可以獨立安裝。 | ||
− | 在這份教學文件中,我們將建立 [http://www.spreadfirefox.com/ Spread Firefox 首頁]的即時摘要來源,藉以顯示目前 Firefox 的總下載數。 (例: <cite>174475447 | + | 在這份教學文件中,我們將建立 [http://www.spreadfirefox.com/ Spread Firefox 首頁]的即時摘要來源,藉以顯示目前 Firefox 的總下載數。 (例: <cite>Fx 下載數: 174475447</cite>)。 |
接下來我們會用一份 XSLT 樣式表將該網頁轉換為即時摘要、指定此摘要來源的適用頁面並了解摘要來源傳佈方式,讓使用者能下載及安裝。在這份文件中每階段新增的程式碼會以粗體顯示,方便您辨識。 | 接下來我們會用一份 XSLT 樣式表將該網頁轉換為即時摘要、指定此摘要來源的適用頁面並了解摘要來源傳佈方式,讓使用者能下載及安裝。在這份文件中每階段新增的程式碼會以粗體顯示,方便您辨識。 | ||
行 7: | 行 11: | ||
= 開始 = | = 開始 = | ||
− | + | 摘要來源是 XML 文件的一種,而其根元素為 <code><generator></code>、名稱空間 (namespace) 需指定為 <cite>http://www.mozilla.org/microsummaries/0.1</cite>,所以要建立一份摘要來源就先得在空的純文字檔中放入 XML 宣告及空的 <code><generator></code> 標籤: | |
'''<?xml version="1.0" encoding="UTF-8"?>''' | '''<?xml version="1.0" encoding="UTF-8"?>''' | ||
行 13: | 行 17: | ||
'''</generator>''' | '''</generator>''' | ||
− | = | + | = 命名 = |
− | + | 每個即時摘要來源都必須有個名字,該名稱以 <code>name</code> 屬性記載、明確說明此摘要來源所建立的摘要主題。由於我們要建立的摘要來源將顯示 Firefox 總下載數,所以便命名為「Firefox 下載計數」: | |
<?xml version="1.0" encoding="UTF-8"?> | <?xml version="1.0" encoding="UTF-8"?> | ||
<generator xmlns="<nowiki>http://www.mozilla.org/microsummaries/0.1</nowiki>" | <generator xmlns="<nowiki>http://www.mozilla.org/microsummaries/0.1</nowiki>" | ||
− | '''name="Firefox | + | '''name="Firefox 下載計數"'''> |
</generator> | </generator> | ||
− | = | + | = 加上 XSLT 樣式表 = |
− | + | 即時摘要來源檔案中必須含有一份 XSLT 樣式表,以便將網頁依樣式表設定轉換為即時摘要。同一份資料碰上不同的 XSLT 樣式便能轉換為「相貌」不同的文件,這便是 XSLT 威力所在。 | |
− | + | 以下示範以 <code><template></code> 元素在摘要來源中添加 XSLT 樣式表: | |
<?xml version="1.0" encoding="UTF-8"?> | <?xml version="1.0" encoding="UTF-8"?> | ||
<generator xmlns="<nowiki>http://www.mozilla.org/microsummaries/0.1</nowiki>" | <generator xmlns="<nowiki>http://www.mozilla.org/microsummaries/0.1</nowiki>" | ||
− | name="Firefox | + | name="Firefox 下載計數"> |
'''<template>''' | '''<template>''' | ||
'''<transform xmlns="<nowiki>http://www.w3.org/1999/XSL/Transform</nowiki>" version="1.0">''' | '''<transform xmlns="<nowiki>http://www.w3.org/1999/XSL/Transform</nowiki>" version="1.0">''' | ||
行 37: | 行 41: | ||
</generator> | </generator> | ||
− | + | 即時摘要來源中可以放任何形式的 XSLT,設定為產生超文件也行,但 Firefox 目前只會顯示純文字內容。 | |
− | = | + | = 設定輸出格式 = |
− | + | 由於 XSLT 樣式表會產岀文字摘要,所以 XSLT 的 <code><output></code> 元素需設定如下: | |
<?xml version="1.0" encoding="UTF-8"?> | <?xml version="1.0" encoding="UTF-8"?> | ||
<generator xmlns="<nowiki>http://www.mozilla.org/microsummaries/0.1</nowiki>" | <generator xmlns="<nowiki>http://www.mozilla.org/microsummaries/0.1</nowiki>" | ||
− | name="Firefox | + | name="Firefox 下載計數"> |
<template> | <template> | ||
<transform xmlns="<nowiki>http://www.w3.org/1999/XSL/Transform</nowiki>" version="1.0"> | <transform xmlns="<nowiki>http://www.w3.org/1999/XSL/Transform</nowiki>" version="1.0"> | ||
行 53: | 行 57: | ||
</generator> | </generator> | ||
− | = | + | = 使用 XSLT <code><template></code> = |
− | + | XSLT 處理器會分別比對 XSLT 樣式表中每組 <code><template></code> 元素及文件中的節點。當 <code><template></code> 的 <code>match</code> 屬性設定與節點相符,處理器便依設定轉換文件。 | |
− | + | 這種處理方式可以循序檢查網頁中每個節點,依據設定條件顯示內容,非常有用。不過本例只是要顯示 Spread Firefox 網站上的即時摘要,僅用一個 <code><template></code> 元素來找一回根元素下的內容即可: | |
<?xml version="1.0" encoding="UTF-8"?> | <?xml version="1.0" encoding="UTF-8"?> | ||
<generator xmlns="<nowiki>http://www.mozilla.org/microsummaries/0.1</nowiki>" | <generator xmlns="<nowiki>http://www.mozilla.org/microsummaries/0.1</nowiki>" | ||
− | name="Firefox | + | name="Firefox 下載計數"> |
<template> | <template> | ||
<transform xmlns="<nowiki>http://www.w3.org/1999/XSL/Transform</nowiki>" version="1.0"> | <transform xmlns="<nowiki>http://www.w3.org/1999/XSL/Transform</nowiki>" version="1.0"> | ||
行 71: | 行 75: | ||
</generator> | </generator> | ||
− | = | + | = 加上下載次數 = |
− | |||
− | |||
− | + | 若想將下載次數放到 XSLT 輸出的文件中,我們得在 XSLT 中的 <code>template</code> 元素加上 <code><value-of></code> 元素,而此 <code>template</code> 元素的 <code>select</code> 屬性中指定的 XPath 必須指向涵括計數器的節點。 | |
− | + | XPath 是用來指定 HTML/XML 文件節點的語言,也有基本的節點內容處理函式。要得知能指向此節點的 XPath 陳述式,最輕鬆的方法就是使用 [https://addons.mozilla.org/firefox/1095/ XPath Checker 擴充套件]。 | |
− | XPath Checker | + | 安裝 XPath Checker 並重新啟動 Firefox 之後,先到 [http://www.spreadfirefox.com/ Spread Firefox 首頁]去,找到 Firefox 下載次數(網頁右邊欄最下方的數字),在上頭按下右鍵,於快捷選單中選擇 <cite>View XPath</cite>。此時 XPath Checker 會開啟一個新視窗,其中 <cite>XPath</cite> 欄位包含方才所選節點的 XPath 陳述式: <cite>id('download-count')</cite> 。 |
− | + | 在 XSLT 的 <code><template></code> 元素中加上一個 <code><value-of></code> 元素,其中 <code>select</code> 屬性便設為此 XPath 陳述式,如下: | |
<?xml version="1.0" encoding="UTF-8"?> | <?xml version="1.0" encoding="UTF-8"?> | ||
<generator xmlns="<nowiki>http://www.mozilla.org/microsummaries/0.1</nowiki>" | <generator xmlns="<nowiki>http://www.mozilla.org/microsummaries/0.1</nowiki>" | ||
− | name="Firefox | + | name="Firefox 下載計數"> |
<template> | <template> | ||
<transform xmlns="<nowiki>http://www.w3.org/1999/XSL/Transform</nowiki>" version="1.0"> | <transform xmlns="<nowiki>http://www.w3.org/1999/XSL/Transform</nowiki>" version="1.0"> | ||
行 96: | 行 98: | ||
</generator> | </generator> | ||
− | = | + | = 加上文字 = |
− | |||
− | |||
− | + | 為了在即時摘要中加上 <cite>Fx 下載數:</cite> 這段文字,我們必須將 <code><text></code> 元素放到 <code><template></code> 元素中文字該出現的地方。以下範例便放進一個內容為 <cite>Fx 下載數:</cite> 的 <code><text></code> 元素: | |
<?xml version="1.0" encoding="UTF-8"?> | <?xml version="1.0" encoding="UTF-8"?> | ||
<generator xmlns="<nowiki>http://www.mozilla.org/microsummaries/0.1</nowiki>" | <generator xmlns="<nowiki>http://www.mozilla.org/microsummaries/0.1</nowiki>" | ||
− | name="Firefox | + | name="Firefox 下載計數"> |
<template> | <template> | ||
<transform xmlns="<nowiki>http://www.w3.org/1999/XSL/Transform</nowiki>" version="1.0"> | <transform xmlns="<nowiki>http://www.w3.org/1999/XSL/Transform</nowiki>" version="1.0"> | ||
<output method="text"/> | <output method="text"/> | ||
<template match="/"> | <template match="/"> | ||
+ | '''<text>Fx 下載數: </text>''' | ||
<value-of select="id('download-count')"/> | <value-of select="id('download-count')"/> | ||
− | |||
</template> | </template> | ||
</transform> | </transform> | ||
行 116: | 行 116: | ||
</generator> | </generator> | ||
− | + | 此處須留心 XSLT 標籤之間的空白字元並不會出現在輸出結果中,不像 HTML 會合併顯示為一個空格,所以要在字串後多加上一個空白以便區隔下載次數及字串。 | |
− | + | 這麼一來,這個轉換 Spread Firefox 首頁為即時摘要的 XSLT 樣式便完成了。 | |
− | = | + | = 指定摘要來源的適用範圍 = |
− | + | 摘要來源的轉換樣式已大工告成,接下來要指定此樣式適用的網頁。如果我們是 Spread Firefox 的網站管理員,可以在網頁上的 <code><head></code> 元素中直接加入 <code><link rel="microsummary"></code> 標籤,以便指定此網頁對應的摘要來源: | |
<head> | <head> | ||
行 129: | 行 129: | ||
</head> | </head> | ||
− | + | 不過,由於我們並非該站網管,所以就得在檔案中規定此摘要來源的適用網頁,然後把摘要來源檔放到網路上供人下載。為了要指定適用網頁範圍,我們在 <code><generator></code> 元素中放上 <code><pages></code> 元素: | |
<?xml version="1.0" encoding="UTF-8"?> | <?xml version="1.0" encoding="UTF-8"?> | ||
<generator xmlns="<nowiki>http://www.mozilla.org/microsummaries/0.1</nowiki>" | <generator xmlns="<nowiki>http://www.mozilla.org/microsummaries/0.1</nowiki>" | ||
− | name="Firefox | + | name="Firefox 下載計數"> |
<template> | <template> | ||
<transform xmlns="<nowiki>http://www.w3.org/1999/XSL/Transform</nowiki>" version="1.0"> | <transform xmlns="<nowiki>http://www.w3.org/1999/XSL/Transform</nowiki>" version="1.0"> | ||
<output method="text"/> | <output method="text"/> | ||
<template match="/"> | <template match="/"> | ||
+ | <text>Fx 下載數: </text> | ||
<value-of select="id('download-count')"/> | <value-of select="id('download-count')"/> | ||
− | |||
</template> | </template> | ||
</transform> | </transform> | ||
行 147: | 行 147: | ||
</generator> | </generator> | ||
− | + | <code><pages></code> 元素中可以放進多個 <code><include></code> 及 <code><exclude></code> 元素。元素正如其名,<code><include></code> 元素能以規則運算式(regular expression)指定適用網頁,而 <code><exclude></code> 元素則以規則運算式指定不適用網頁。 | |
− | + | 若無另加規定,則摘要來源預設不適用所有網頁。也就是說,你必須明確指定摘要來源之適用範圍,但如無必要可不必以 <code><exclude></code> 排除其他網頁。 | |
− | + | 此處加上個 <code><include></code> 元素指定 Spread Firefox 首頁為適用範圍: | |
− | |||
− | |||
<?xml version="1.0" encoding="UTF-8"?> | <?xml version="1.0" encoding="UTF-8"?> | ||
− | <generator xmlns="<nowiki>http://www.mozilla.org/microsummaries/0.1</nowiki>" name="Firefox | + | <generator xmlns="<nowiki>http://www.mozilla.org/microsummaries/0.1</nowiki>" |
+ | name="Firefox 下載計數"> | ||
<template> | <template> | ||
<transform xmlns="<nowiki>http://www.w3.org/1999/XSL/Transform</nowiki>" version="1.0"> | <transform xmlns="<nowiki>http://www.w3.org/1999/XSL/Transform</nowiki>" version="1.0"> | ||
<output method="text"/> | <output method="text"/> | ||
<template match="/"> | <template match="/"> | ||
+ | <text>Fx 下載數: </text> | ||
<value-of select="id('download-count')"/> | <value-of select="id('download-count')"/> | ||
− | |||
</template> | </template> | ||
</transform> | </transform> | ||
行 171: | 行 170: | ||
</generator> | </generator> | ||
− | = | + | = 安裝即時摘要來源 = |
− | + | 現在萬事俱備,只差讓人能下載此摘要來源的機制。我們得先將摘要來源檔上傳到網路,接著再以一段 JavaScript 連結呼叫 Firefox 的 <cite>window.sidebar.addMicrosummaryGenerator()</cite> 方法以便下載安裝。 | |
− | + | 舉例而言,如果摘要來源檔的位置在 [http://people.mozilla.com/~myk/microsummaries/tutorial/sfx-generator.xml http://people.mozilla.com/~myk/microsummaries/tutorial/sfx-generator.xml],而我們希望使用者能從 [http://people.mozilla.com/~myk/microsummaries/tutorial/index.html http://people.mozilla.com/~myk/microsummaries/tutorial/index.html] 上下載安裝,就應該在 <cite>index.html</cite> 網頁上加上此段程式碼: | |
− | '''<a href="javascript:window.sidebar.addMicrosummaryGenerator('<nowiki>http://people.mozilla.com/~myk/microsummaries/tutorial/sfx-generator.xml</nowiki>')"> | + | '''<a href="javascript:window.sidebar.addMicrosummaryGenerator('<nowiki>http://people.mozilla.com/~myk/microsummaries/tutorial/sfx-generator.xml</nowiki>')">安裝 Spread Firefox 首頁即時摘要來源!</a>''' |
− | + | 不過,如果是不支援即時摘要的瀏覽器,按下此連結之後會產生 JavaScript 錯誤,所以我們應該幫使用者點忙、檢查他們的瀏覽器是否支援即時摘要,若不支援則顯示說明訊息: | |
'''<script>''' | '''<script>''' | ||
− | ''' const warning = " | + | ''' const warning = "不好意思ㄋㄟ,你得用支援即時摘要的瀏覽器 (如 Firefox 2.0) 才能安裝這玩意喔!";''' |
''' function addGenerator(url) {''' | ''' function addGenerator(url) {''' | ||
''' if (typeof window.sidebar == "object" &&''' | ''' if (typeof window.sidebar == "object" &&''' | ||
行 191: | 行 190: | ||
''' }''' | ''' }''' | ||
'''</script>''' | '''</script>''' | ||
− | '''<a href="javascript:addGenerator('<nowiki>http://people.mozilla.com/~myk/microsummaries/tutorial/sfx-generator.xml</nowiki>')"> | + | '''<a href="javascript:addGenerator('<nowiki>http://people.mozilla.com/~myk/microsummaries/tutorial/sfx-generator.xml</nowiki>')">安裝 Spread Firefox 首頁即時摘要來源!</a>''' |
+ | <!-- | ||
+ | 這個即時摘要來源的安裝已經放在[http://bobchao.googlepages.com/microsummary 柏強雜碎頁: Firefox 2 即時摘要來源]中,可以安裝試試結果。 | ||
+ | --> | ||
+ | = 範例 = | ||
+ | *[http://shyangs.110mb.com/microsummary/tw-weather-V7.html 中央氣象局目前天氣即時標題] | ||
− | = | + | = 結語 = |
− | + | 現在你應該瞭解怎麼製作能顯示 Firefox 下載次數的即時摘要了。試著將 Spread Firefox 首頁存為書籤,然後在<cite>新增書籤</cite>對話方塊中按下<cite>名稱</cite>下拉式選單、選擇<cite>即時標題</cite>之後的項目即可。 | |
− | + | 其他關於即時摘要的相關資訊,可以參考 [http://wiki.mozilla.org/Microsummaries Microsummaries 主題頁]。 | |
− | [ | + | ---- |
− | + | 註: | |
+ | *這個功能目前在非 UTF-8 的網頁部分有點問題,已提報 bug [https://bugzilla.mozilla.org/show_bug.cgi?id=345016 345016] | ||
+ | *如果存放摘要來源檔的伺服器無法送出正確的 MIME Type (例: Google Pages 的空間),則摘要來源將無效,您可以在網址列輸入 javascript: 來查閱錯誤。 | ||
+ | *如果摘要來源檔案中的 XML 或 XSLT 格式有誤,則摘要來源將無效,一樣可以在網址列輸入 javascript: 來查閱錯誤。 |
於 2011年8月6日 (六) 18:58 的最新修訂
即時摘要來源 (microsummary generator) 內含一組從網頁中製出即時摘要的指令,而網頁能在 <head>
元素中放入 <link rel="microsummary">
以指定適用的摘要來源。即時摘要來源檔案中如含有適用頁面列表,則也可以獨立安裝。
在這份教學文件中,我們將建立 Spread Firefox 首頁的即時摘要來源,藉以顯示目前 Firefox 的總下載數。 (例: Fx 下載數: 174475447)。
接下來我們會用一份 XSLT 樣式表將該網頁轉換為即時摘要、指定此摘要來源的適用頁面並了解摘要來源傳佈方式,讓使用者能下載及安裝。在這份文件中每階段新增的程式碼會以粗體顯示,方便您辨識。
內容大綱
開始
摘要來源是 XML 文件的一種,而其根元素為 <generator>
、名稱空間 (namespace) 需指定為 http://www.mozilla.org/microsummaries/0.1,所以要建立一份摘要來源就先得在空的純文字檔中放入 XML 宣告及空的 <generator>
標籤:
<?xml version="1.0" encoding="UTF-8"?> <generator xmlns="http://www.mozilla.org/microsummaries/0.1"> </generator>
命名
每個即時摘要來源都必須有個名字,該名稱以 name
屬性記載、明確說明此摘要來源所建立的摘要主題。由於我們要建立的摘要來源將顯示 Firefox 總下載數,所以便命名為「Firefox 下載計數」:
<?xml version="1.0" encoding="UTF-8"?> <generator xmlns="http://www.mozilla.org/microsummaries/0.1" name="Firefox 下載計數"> </generator>
加上 XSLT 樣式表
即時摘要來源檔案中必須含有一份 XSLT 樣式表,以便將網頁依樣式表設定轉換為即時摘要。同一份資料碰上不同的 XSLT 樣式便能轉換為「相貌」不同的文件,這便是 XSLT 威力所在。
以下示範以 <template>
元素在摘要來源中添加 XSLT 樣式表:
<?xml version="1.0" encoding="UTF-8"?> <generator xmlns="http://www.mozilla.org/microsummaries/0.1" name="Firefox 下載計數"> <template> <transform xmlns="http://www.w3.org/1999/XSL/Transform" version="1.0"> </transform> </template> </generator>
即時摘要來源中可以放任何形式的 XSLT,設定為產生超文件也行,但 Firefox 目前只會顯示純文字內容。
設定輸出格式
由於 XSLT 樣式表會產岀文字摘要,所以 XSLT 的 <output>
元素需設定如下:
<?xml version="1.0" encoding="UTF-8"?> <generator xmlns="http://www.mozilla.org/microsummaries/0.1" name="Firefox 下載計數"> <template> <transform xmlns="http://www.w3.org/1999/XSL/Transform" version="1.0"> <output method="text"/> </transform> </template> </generator>
使用 XSLT <template>
XSLT 處理器會分別比對 XSLT 樣式表中每組 <template>
元素及文件中的節點。當 <template>
的 match
屬性設定與節點相符,處理器便依設定轉換文件。
這種處理方式可以循序檢查網頁中每個節點,依據設定條件顯示內容,非常有用。不過本例只是要顯示 Spread Firefox 網站上的即時摘要,僅用一個 <template>
元素來找一回根元素下的內容即可:
<?xml version="1.0" encoding="UTF-8"?> <generator xmlns="http://www.mozilla.org/microsummaries/0.1" name="Firefox 下載計數"> <template> <transform xmlns="http://www.w3.org/1999/XSL/Transform" version="1.0"> <output method="text"/> <template match="/"> </template> </transform> </template> </generator>
加上下載次數
若想將下載次數放到 XSLT 輸出的文件中,我們得在 XSLT 中的 template
元素加上 <value-of>
元素,而此 template
元素的 select
屬性中指定的 XPath 必須指向涵括計數器的節點。
XPath 是用來指定 HTML/XML 文件節點的語言,也有基本的節點內容處理函式。要得知能指向此節點的 XPath 陳述式,最輕鬆的方法就是使用 XPath Checker 擴充套件。
安裝 XPath Checker 並重新啟動 Firefox 之後,先到 Spread Firefox 首頁去,找到 Firefox 下載次數(網頁右邊欄最下方的數字),在上頭按下右鍵,於快捷選單中選擇 View XPath。此時 XPath Checker 會開啟一個新視窗,其中 XPath 欄位包含方才所選節點的 XPath 陳述式: id('download-count') 。
在 XSLT 的 <template>
元素中加上一個 <value-of>
元素,其中 select
屬性便設為此 XPath 陳述式,如下:
<?xml version="1.0" encoding="UTF-8"?> <generator xmlns="http://www.mozilla.org/microsummaries/0.1" name="Firefox 下載計數"> <template> <transform xmlns="http://www.w3.org/1999/XSL/Transform" version="1.0"> <output method="text"/> <template match="/"> <value-of select="id('download-count')"/> </template> </transform> </template> </generator>
加上文字
為了在即時摘要中加上 Fx 下載數: 這段文字,我們必須將 <text>
元素放到 <template>
元素中文字該出現的地方。以下範例便放進一個內容為 Fx 下載數: 的 <text>
元素:
<?xml version="1.0" encoding="UTF-8"?> <generator xmlns="http://www.mozilla.org/microsummaries/0.1" name="Firefox 下載計數"> <template> <transform xmlns="http://www.w3.org/1999/XSL/Transform" version="1.0"> <output method="text"/> <template match="/"> <text>Fx 下載數: </text> <value-of select="id('download-count')"/> </template> </transform> </template> </generator>
此處須留心 XSLT 標籤之間的空白字元並不會出現在輸出結果中,不像 HTML 會合併顯示為一個空格,所以要在字串後多加上一個空白以便區隔下載次數及字串。
這麼一來,這個轉換 Spread Firefox 首頁為即時摘要的 XSLT 樣式便完成了。
指定摘要來源的適用範圍
摘要來源的轉換樣式已大工告成,接下來要指定此樣式適用的網頁。如果我們是 Spread Firefox 的網站管理員,可以在網頁上的 <head>
元素中直接加入 <link rel="microsummary">
標籤,以便指定此網頁對應的摘要來源:
<head> ... <link rel="microsummary" href="path/to/our/generator.xml"> </head>
不過,由於我們並非該站網管,所以就得在檔案中規定此摘要來源的適用網頁,然後把摘要來源檔放到網路上供人下載。為了要指定適用網頁範圍,我們在 <generator>
元素中放上 <pages>
元素:
<?xml version="1.0" encoding="UTF-8"?> <generator xmlns="http://www.mozilla.org/microsummaries/0.1" name="Firefox 下載計數"> <template> <transform xmlns="http://www.w3.org/1999/XSL/Transform" version="1.0"> <output method="text"/> <template match="/"> <text>Fx 下載數: </text> <value-of select="id('download-count')"/> </template> </transform> </template> <pages> </pages> </generator>
<pages>
元素中可以放進多個 <include>
及 <exclude>
元素。元素正如其名,<include>
元素能以規則運算式(regular expression)指定適用網頁,而 <exclude>
元素則以規則運算式指定不適用網頁。
若無另加規定,則摘要來源預設不適用所有網頁。也就是說,你必須明確指定摘要來源之適用範圍,但如無必要可不必以 <exclude>
排除其他網頁。
此處加上個 <include>
元素指定 Spread Firefox 首頁為適用範圍:
<?xml version="1.0" encoding="UTF-8"?> <generator xmlns="http://www.mozilla.org/microsummaries/0.1" name="Firefox 下載計數"> <template> <transform xmlns="http://www.w3.org/1999/XSL/Transform" version="1.0"> <output method="text"/> <template match="/"> <text>Fx 下載數: </text> <value-of select="id('download-count')"/> </template> </transform> </template> <pages> <include>http://(www\.)?spreadfirefox\.com/(index\.php)?</include> </pages> </generator>
安裝即時摘要來源
現在萬事俱備,只差讓人能下載此摘要來源的機制。我們得先將摘要來源檔上傳到網路,接著再以一段 JavaScript 連結呼叫 Firefox 的 window.sidebar.addMicrosummaryGenerator() 方法以便下載安裝。
舉例而言,如果摘要來源檔的位置在 http://people.mozilla.com/~myk/microsummaries/tutorial/sfx-generator.xml,而我們希望使用者能從 http://people.mozilla.com/~myk/microsummaries/tutorial/index.html 上下載安裝,就應該在 index.html 網頁上加上此段程式碼:
<a href="javascript:window.sidebar.addMicrosummaryGenerator('http://people.mozilla.com/~myk/microsummaries/tutorial/sfx-generator.xml')">安裝 Spread Firefox 首頁即時摘要來源!</a>
不過,如果是不支援即時摘要的瀏覽器,按下此連結之後會產生 JavaScript 錯誤,所以我們應該幫使用者點忙、檢查他們的瀏覽器是否支援即時摘要,若不支援則顯示說明訊息:
<script> const warning = "不好意思ㄋㄟ,你得用支援即時摘要的瀏覽器 (如 Firefox 2.0) 才能安裝這玩意喔!"; function addGenerator(url) { if (typeof window.sidebar == "object" && typeof window.sidebar.addMicrosummaryGenerator == "function") window.sidebar.addMicrosummaryGenerator(url); else alert(warning); } </script> <a href="javascript:addGenerator('http://people.mozilla.com/~myk/microsummaries/tutorial/sfx-generator.xml')">安裝 Spread Firefox 首頁即時摘要來源!</a>
範例
結語
現在你應該瞭解怎麼製作能顯示 Firefox 下載次數的即時摘要了。試著將 Spread Firefox 首頁存為書籤,然後在新增書籤對話方塊中按下名稱下拉式選單、選擇即時標題之後的項目即可。
其他關於即時摘要的相關資訊,可以參考 Microsummaries 主題頁。
註:
- 這個功能目前在非 UTF-8 的網頁部分有點問題,已提報 bug 345016
- 如果存放摘要來源檔的伺服器無法送出正確的 MIME Type (例: Google Pages 的空間),則摘要來源將無效,您可以在網址列輸入 javascript: 來查閱錯誤。
- 如果摘要來源檔案中的 XML 或 XSLT 格式有誤,則摘要來源將無效,一樣可以在網址列輸入 javascript: 來查閱錯誤。