Skip to main content

嵌入漫畫

把 GenToon 漫畫放到你的部落格或網站上,讀者不必離開你的頁面,就能在那裡滑完每一格。

看起來會像這樣

這是實際的嵌入播放器,滑動看看吧。

嵌入方法

  1. 在貼文上點選「嵌入」

    就在你想嵌入的漫畫貼文下方,分享按鈕的旁邊。

  2. 選擇大小

    可選擇小、標準或大。如果頁面的內文欄較窄,請開啟「響應式程式碼」。你的選擇會立刻顯示在預覽中。

    在「閱讀方式」中,可選擇「左右滑動」(預設)或「往下捲動」。往下捲動時一律從第一格開始。

  3. 點選「複製程式碼」並貼上

    貼到部落格或網站的 HTML 編輯畫面就完成了。

在 App 中,點選貼文的分享按鈕並選擇「嵌入」,就會複製程式碼。

要貼在哪裡?

自架的 WordPress
只要貼上貼文連結,播放器就會自動出現。請使用嵌入視窗中的「複製連結」。
可以放 HTML 的部落格和網站
把用「複製程式碼」複製的程式碼貼到 HTML 編輯畫面。
只能填網址的地方
如果欄位只接受網址,請填入播放器網址。網址格式如下,最後的 ID 就是貼文網址的最後一段。
https://www.gentoon.ai/embed/post/<貼文ID>
點選嵌入視窗中的「複製嵌入網址」,就會複製這個網址。

其他地方則要看網站是否允許外部 HTML 或 iframe。如果不允許,請用「複製連結」分享連結。

小提醒

  • 播放器不使用 Cookie,也不會要求任何人登入。
  • 如果作者刪除貼文或改為不公開,貼文在所有嵌入的地方都不會再顯示。
  • 播放器的按鈕文字會依每位讀者的語言顯示。
  • 作者可以在嵌入視窗的「嵌入成效」中,查看漫畫在其他網站被閱讀的次數。

給開發者

如果你的服務支援 oEmbed,只要貼文連結就能顯示播放器。

oEmbed 端點

用 url 傳入貼文網址。格式有 json 和 xml,指定 maxwidth 和 maxheight 時,會維持比例縮小播放器。貼文頁面內含 oEmbed 探索用的 link 標籤。

https://www.gentoon.ai/api/oembed

GET https://www.gentoon.ai/api/oembed?url=https%3A%2F%2Fwww.gentoon.ai%2Fcommunity%2Fposts%2F9fa0016a-1192-4a72-afa8-d0ffad90c315&format=json
GET https://www.gentoon.ai/api/oembed?url=https%3A%2F%2Fwww.gentoon.ai%2Fcommunity%2Fposts%2F9fa0016a-1192-4a72-afa8-d0ffad90c315&format=xml

回應碼:200 正常 · 404 貼文不存在,或不是 GenToon 的貼文網址 · 401 貼文存在,但無法嵌入(例如不公開或只能在 App 觀看的貼文) · 501 json 和 xml 以外的格式。

<iframe src="https://www.gentoon.ai/embed/post/9fa0016a-1192-4a72-afa8-d0ffad90c315" width="400" height="644" title="嵌入漫畫 · GenToon" frameborder="0" scrolling="no" loading="lazy" allow="clipboard-write; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen style="border:0;max-width:100%"></iframe>

播放器網址與參數

https://www.gentoon.ai/embed/post/9fa0016a-1192-4a72-afa8-d0ffad90c315?hl=en&theme=dark&start=2&layout=scroll
hl
固定顯示語言(例如 en 或 ja)。未指定時,會依照讀者的瀏覽器語言。
theme
設為 dark 時會以深色顯示。
start
從第 N 格開始顯示(從 1 開始算)。
layout
設為 scroll 時,可以直向連續閱讀每一格。未指定時,讀者會一次翻一格。oEmbed 的嵌入程式碼一律一次一格。

全螢幕按鈕只在 iframe 有 allowfullscreen 時才會顯示(我們的嵌入程式碼已包含)。WordPress 會移除這個屬性,iPhone 的 Safari 也不支援全螢幕,所以在這些地方不會有按鈕。字幕(CC)按鈕只在讀者的語言與對白語言不同時才會顯示,點選後會載入一次翻譯。

高度通知(postMessage)

播放器的高度改變時會通知父視窗。請接收下列訊息並調整 iframe 的高度。

預設格式

{"type":"gentoon:embed:resize","postId":"9fa0016a-1192-4a72-afa8-d0ffad90c315","height":644}

Embedly 和 Iframely 格式

JSON.stringify({"src":"https://www.gentoon.ai/embed/post/9fa0016a-1192-4a72-afa8-d0ffad90c315","context":"iframe.resize","height":644,"domains":"all"})

WordPress 格式(網址結尾帶有 #?secret= 時)

{"message":"height","value":644,"secret":"<secret>"}

播放器的回應不會設定 Cookie,並標記為 noindex,因此搜尋引擎不會將其編入索引。

聯絡我們

如果嵌入無法正常運作,或想與我們合作,請寄電子郵件到 service@gentoon.ai。

返回幫助中心