透過 Preview 精靈,您可以快速、輕鬆且穩定地將預覽整合至網站。您還可以在書籍檢視器中嵌入書籍檢視器、連結至圖書搜尋,甚至新增預覽「彈出式視窗」視窗到網站上。方法很簡單,只要產生程式碼,然後貼到您的網頁上即可。此外,您也可以使用部分簡單的 JavaScript 函式自訂此程式碼。
預覽精靈是以 Dynamic Links 和 Embedded Viewer API 為基礎建構而成的簡易型程式庫。如果您是需要自訂整合的進階開發人員,請考慮直接使用基礎 API。
產生預覽程式碼
產生的預覽範例
下列範例是使用 Preview Wizard 產生的。
- preview Wizard-embed:在網頁中嵌入書籍檢視器。
- preview Wizard-popup:新增可點選的按鈕,以開啟網頁上的浮動預覽畫面。
- preview Wizard-linktogbs:插入按鈕,連結至圖書搜尋網站中的預覽內容。
- preview Wizard-customurl:顯示連往特定網址的按鈕。
自訂程式碼
除了使用上述精靈以外,您也可以直接呼叫一些簡單的 JavaScript「helper」函式。為此,您必須先載入預覽精靈程式庫。其中一種方法是在網頁的 <head>
部分新增以下標記:
<script type="text/javascript" src="https://books.google.com/books/previewlib.js"></script>
載入預覽程式庫後,您可以在文件 <body>
內的 <script>
標記內呼叫下列任何函式。舉例來說,如果您想插入「Google 預覽」按鈕,可以將程式碼放在頁面內所需位置的 <script>
元素中。
GBS_setLanguage
GBS_setLanguage(languageCode)
-
呼叫此函式後新增的任何按鈕或文字,變更語言。包括 [Google Preview] 按鈕的語言、內嵌預覽的介面語言等。
-
參數:
string languageCode
- 所需的 RFC 3066 語言代碼 (預設為「en」表示英文)。目前支援的語言代碼包括 hy、bg、ca、zh-CN、zh-TW、hr、cs、da、nl、en、fil、fi、fr、de、el、hi、hu、is、id、in、it、ja、ko、lv、lt、no、pl、pt-k、pt、GBS_setViewerOptions
GBS_setViewerOptions(optionObj)
-
參數:
Object optionsObj
- 傳送至 Embedded Viewer API 之 DefaultViewer 建構函式的鍵/值組合。通常用於進階自訂功能。GBS_setCobrandName
GBS_setCobrandName(cobrandName)
-
參數:
string cobrandName
- 要新增至任何「圖書搜尋」網址的聯名名稱。這通常是在現有的「聯合品牌搜尋」預覽網址中,位於 /p/
之後的部分。
舉例來說,如果將值設為 sup
,系統就會將使用者導向
https://books.google.com/books/p/sup?id=Q8ysL64pM54C&printsec=frontcover
這類連結,而不是預設的
。
https://books.google.com/books?id=Q8ysL64pM54C&printsec=frontcover
GBS_insertEmbeddedViewer
GBS_insertEmbeddedViewer(identifier, opt_width, opt_height)
-
在所有呼叫此函式的位置插入內嵌書籍預覽。如果無法預覽,就不會顯示檢視器。
-
參數:
string identifier
- 預覽網址或書籍 ID,例如 ISBN、OCLC 或 LCCN 編號。請參閱「Dynamic Links 要求格式」。Number opt_width
- 所需的檢視器寬度 (以像素為單位)。
Number opt_height
- 所需的檢視器高度,以像素為單位。
GBS_insertPreviewButtonPopup
GBS_insertPreviewButtonPopup(identifiers)
-
如果有書籍預覽畫面,這個函式會撰寫「Google Preview」按鈕。只要按一下這個按鈕,系統就會在網頁右上方開啟「浮動預覽視窗」。如果沒有可用的預覽,系統就不會繪製該按鈕。
經驗老到的開發人員可能會對這項功能內部使用的嵌入式檢視器 API 感興趣,
-
參數:
string, Array identifier
- 預覽網址或書籍 ID,例如 ISBN、OCLC 或 LCCN 編號。請參閱「Dynamic Links 要求格式」。如果您知道書籍的幾種替代 ID,可以傳遞這些 ID 的陣列,如果其中一個 ID 提供試閱內容,就會顯示這個按鈕。
GBS_insertPreviewButtonLink
GBS_insertPreviewButtonLink(identifiers, opt_options)
-
如果有書籍試閱內容,這個函式會撰寫 [Google Preview] 按鈕,直接連結至書籍的預覽頁面。根據預設,這個連結會導向 Google 圖書的試閱內容,但你也可以:
- 連結到網站中的網址 (如此應該會包含嵌入式檢視器)。只要傳送選用的
alternativeUrl
選項即可。 - 連結至書籍預覽網頁的聯合品牌版本 (如果在這個函式之前呼叫 GBS_setCobrandName)。
-
參數:
string, Array identifier
- 預覽網址或書籍 ID,例如 ISBN、OCLC 或 LCCN 編號。請參閱「Dynamic Links 要求格式」。如果您知道書籍的幾種替代 ID,可以傳遞這些 ID 的陣列,如果其中一個 ID 提供試閱內容,就會顯示這個按鈕。
Object opt_options
- 選用:用於設定按鈕行為的名稱/值對應。目前支援一個選項:alternativeUrl
。舉例來說,若要將 Google 預覽按鈕連結到您網站上的自訂預覽網頁,只要將下列程式碼做為第二個引數傳遞至 GBS_insertPreviewButtonLink
即可: { 'alternativeUrl' : 'http://yoursite.com/your-preview-page' }